/* Overrides,,, */
body {
    overflow: hidden;
}

/* Scrollbar... */
::-webkit-scrollbar {
    background-color: #000;
    width: 12px;
    border-radius: 10px;
}

::-webkit-scrollbar-track {
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.3);
}

::-webkit-scrollbar-thumb {
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(.5, var(--red-crimson)), color-stop(1, var(--pink-tickle-me)));
    border-radius: 10px;
}


header {
    background-color: black;
}

.custombox-content>* {
    max-height: 70vh;
    overflow-x: auto;
    color: black;
}

/* Components... */
.material-card {
    border: 0 !important;
}

.material-card.material-card-light {
    background-color: white !important;
    color: black;
}

.material-card.material-card-rounded {
    border-radius: 7px !important;
}

.material-card.material-card-rounded img {
    border-radius: 7px !important;
}

.custom-select {
    background-color: #fff;
    font-weight: 700;
    box-shadow: var(--box-shadow-sm-dark);
    padding: 15px;
}

.custom-select-arrow {
    float: right;
}


/* List Product... */
.list-product .product-inner {
    margin-bottom: 30px;
}

.list-product:hover .product-inner {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

.material-card .material-card-thumb {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.material-card .material-card-content {
    padding: 24px;
}

/* List Product... */
.list-product .product-inner {
    margin-bottom: 30px;
}

.list-product:hover .product-inner {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    /* box-shadow: var(--material-box-shadow-sm-red-radical) !important; */
}

/* Button */
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 999999;
}

.preloader-hide {
    pointer-events: none;
}

.preloader-hide>lord-icon {
    animation: fade-out .25s ease both;
}

.preloader-hide:before {
    animation: slide-out-left .25s ease both;
}

.preloader-hide:after {
    animation: slide-out-right .25s ease both;
}

#preloader:before,
#preloader:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 50%;
    z-index: -1;
    will-change: transform, opacity;
}

#preloader:before {
    background-color: #fff;
    top: 0;
    left: 0;
}

#preloader:after {
    background-color: #fff;
    right: 0;
    bottom: 0;
}

#preloader-lordicon {
    z-index: inherit;
}

.lozad[data-loaded="true"] {
    animation: fade-in .25s ease;
}

/* Categories */
.category-active {
    position: relative;
}

.category-active::before {
    content: '';
    position: absolute;
    background-color: var(--red-radical);
    width: 5px;
    height: 100%;
    top: 0;
    left: 0;
}

/*
@media (min-width: 1025px) {
    #leftbarproducts,
    #category-list-container {
        position: fixed;
    }


    #leftbarproducts {
        top: 23.5vh;
        left: 0;
    }

    #category-list-container {
        top: 19vh;
        right: 0;
    }
} */

/* Misc... */
#add-to-cart-popup {
    background-color: white;
    color: black;
}

/* Cards... */
.product-material-card {
    display: flex;
}

/* Grids... */
.grid-item {
    padding: 20px;
    text-align: center;
    margin-bottom: 10px;
}

/* Button... */
.button {
    height: fit-content !important;
    text-align: center;
    font-weight: 600;
}

.button.primary {
    background-color: var(--blue-robins-egg);
    color: black;
}

.button.outlined {
    height: fit-content;
    text-align: center;
    background-color: black;
    color: #25F4EE;
    border-style: solid;
    border-width: 1px;
    border-color: #25F4EE;
}

/* Header... */
#hamburger {
    font-size: 30px;
}

/* Navigation... */
.navigation {
    position: absolute;
}

.navigation,
.navbar-level {
    position: absolute;
    width: 100%;
}

.navbar-level {
    display: none;
    width: 100%;
    z-index: 9999;
    position: absolute;
}

.firstlevel {
    top: 50px;
}

.firstlevel.open {
    opacity: 1;
}

/* Categories */
.categories {
    align-items: center;
    flex-direction: column;
    background-color: var(--dark-bunker);
}

/* Misc... */
#home-slider-area {
    margin-top: 100px;
}

/* Utils... */
/* Bgs.. */
.bg-blue-robins-egg {
    background-color: var(--blue-robins-egg);
}

.bg-red-radical {
    background-color: var(--red-radical);
    color: black;
}

/* Texts... */
.text-underline {
    position: relative;
}

.text-underline:before {
    content: '';
    position: absolute;
    bottom: 0;
    height: 3px;
    width: 5vh;
    left: 0;
    right: 0;
    margin: -10px auto;
    background-color: var(--red-radical);
}

/* Box Shadows... */
.material-box-shadow-md-red-radical {
    box-shadow: var(--material-box-shadow-xs-red-radical) !important;
}

.material-box-shadow-md-red-radical {
    box-shadow: var(--material-box-shadow-md-red-radical) !important;
}

.material-box-shadow-lg-red-radical {
    box-shadow: var(--material-box-shadow-lg-red-radical) !important;
}

.material-box-shadow-lg-dark {
    box-shadow: var(--material-box-shadow-lg-dark) !important;
}

.box-shadow-sm-dark {
    box-shadow: var(--box-shadow-sm-dark);
}

.box-shadow-sm-top-dark {
    box-shadow: var(--box-shadow-sm-top-dark);
}

/* Transitions... */
.hvr-grow {
    transition: transform .25s ease;

    &:hover {
        transform: scale3d(1.1, 1.1, 1.1);
    }
}

.hvr-box-shadow-red-radical {
    transition: box-shadow .25s var(--bezier-butter);
}

.hvr-box-shadow-red-radical:hover {
    box-shadow: var(--material-box-shadow-sm-red-radical);
}

/* Img Processing...
.transparent-img {
    mask-image: url('https://www.playbox.gr/fotos/products/medium/10651.jpg');
    mask-size: cover;
    mask-repeat: no-repeat;
    -webkit-mask-image: url('https://www.playbox.gr/fotos/products/medium/10651.jpg');
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
} */

/* Responsiveness.. */
/* Mobile... */
@media (max-width: 767px) {
    #filters {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    #home-slider-area {
        margin-top: auto;
    }

    .badge {
        font-size: 1rem !important;
    }

    .mobile-header .icon {
        height: 10vw !important
    }
}

/* Tablet... */
@media (min-width: 576px) and (max-width: 991px) {
    #home-slider-area {
        margin-top: auto;
    }
}

/* Mobile Landscape... */
@media (max-height: 480px) and (min-width: 576px) {
    .mobile-header .icon {
        width: 18vh !important;
        height: 15vh !important;
    }

    .mobile-header .logo-container {
        flex: 0 0 auto !important;
        width: 25% !important;
    }
}

/* Desktop... */
@media (min-width: 1200px) {
    .product-select {
        width: 100%;
    }

    .mobile-header .icon {
        height: 5vh !important;
    }
}

/* Animations... */
.slide-out-left {
    animation: slide-out-left .25s ease both;
}

.fade-out {
    will-change: opacity;
    animation: fade-out .25s ease both;
}

@keyframes slide-out-left {
    0% {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }

    100% {
        transform: translate3d(-50%, 0, 0);
        opacity: 0;
    }
}

@keyframes slide-out-right {
    0% {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }

    100% {
        transform: translate3d(50%, 0, 0);
        opacity: 0;
    }
}

@keyframes fade-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fade-out {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes blur-in {
    0% {
        opacity: 0;
        filter: blur(15px);
        transform: scale3d(.98, .98, .98);
    }

    100% {
        opacity: 1;
        filter: blur(0px);
        transform: scale3d(1, 1, 1);
    }
}

.producttitle {
  color: #1f1f1f;
  text-transform: capitalize !important;  /* Πρώτο γράμμα κεφαλαίο, υπόλοιπα μικρά */
  display: inline-block !important;
  max-width: 35ch !important;             /* Περιορίζει το πλάτος σε 50 χαρακτήρες */
  white-space: normal !important;         /* επιτρέπει το σπάσιμο γραμμής */
  word-wrap: break-word !important;       /* σπάει μεγάλες λέξεις */
  overflow-wrap: break-word !important;   /* ίδιο με το word-wrap (modern) */
}