body {}
nav#top {display: none;}
@media (min-width: 768px) {header > .container > div {margin-top: 8px;}}
#logo img {border-radius: 5px;
    border: 8px solid white;
    filter: drop-shadow(2px 2px 12px white);}
header > .container > div div + div {padding-top: 6px;}
#menu {
    /* background-image: linear-gradient(to bottom, #172125, #b41fbb); */
    background-image: linear-gradient(to bottom, #710011, #b3999c);
}

#navbar-menu {justify-content: center;}

footer {background-color: #710011;}
.background-hero1 footer {background-color: #331330;}

.carousel {
    border-radius: 12px;
    box-shadow: 0 1px 4px rgb(71 11 11 / 45%);}
    
.img-fluid {
    width: 100%;}

/*  background blurat  */

.background-hero1 { /* black semitransparent */
	background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('/image/Background-Ocazii-Dulci.png');
	background-attachment: fixed;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

                         input.form-control.form-control-lg {text-align: center;}
.background-hero1 header input.form-control.form-control-lg {background-color: black; color: white; text-align: center;}

.background-hero1 header input.form-control::placeholder {color: #99cffb; /* #a685da;  #d36f6fd9; - sau -  #a95959d9; - sau - #fa9393d9; #93d7fa; #a685da; */}

.background-hero1 header input.form-control:focus {border-color: white;}

.background-hero1 #menu {
    background-image: linear-gradient(to bottom, #172125, #ac0b0b) !important;
    background-image: linear-gradient(to bottom, #190317, darkred) !important;
    background-image: linear-gradient(to bottom, #1b0719, var(--bs-danger-text-emphasis)) !important;
    
    border-color: black !important;}
    
.background-hero1 .breadcrumb {border: none; background-color: transparent;}
.background-hero1 li.breadcrumb-item {text-shadow: 0 0 7px #9b1818;}
.background-hero1 li.breadcrumb-item a {color: white;}


.background-hero1 #compare-total, .background-hero1 #compare-total:hover {background: #faebd72b; border-color: #5e0348;}

/*.background-hero1 #product-list > div > div > div.content > div > h4 a,*/
/*.background-hero1 #product-list > div > div > div.content > div > p,*/
/*.background-hero1 #product-list > div > div > div.content > div > .price,*/
/*    .background-hero1 #recomandate > div > div > div.content > div > h4 a,*/
/*    .background-hero1 #recomandate > div > div > div.content > div > p,*/
/*    .background-hero1 #recomandate > div > div > div.content > div > .price {color: white;}*/

/*.background-hero1 #product-list > div > div > div.content > div > h4,*/
/* .background-hero1 #recomandate > div > div > div.content > div > h4 {min-height: 48px;}*/


.background-hero1 { /* idem dar nested */
    #product-list, #recomandate, #similare {
        
        > div > div > div.content > div {
            h4 a, p, .price {color: white;}
            /* h4 {min-height: 48px;} */
            h4 {min-height: 70px;}
        }
    }
}

        h1, h2, h3, h4, h5, h6, #content h1 + p, .product-thumb .price {
            color: #15809a;
            text-shadow: none;
        }

.background-hero1 h1, .background-hero1 h2, .background-hero1 h3, .background-hero1 h4, .background-hero1 h5, .background-hero1 h6, .background-hero1 #content h1 + p {
    color: var(--bs-gray-200);
               /* color: #15809a */
    text-shadow: 0 0 2px #eedeea, 0 0 12px navy;
                /* text-shadow: none; */
}

.background-hero1 #product-category #content h1 + h3 + div ul li a {color: #f7e5e5; font-size: larger;}

/*.background-hero1 #product-list .product-thumb {border: 2px solid #ddd; border-radius: 12px;}*/
/*.background-hero1 #product-list .product-thumb .img-fluid {border-radius: 11px 11px 0 0;}*/
/*.background-hero1 #product-list .product-thumb .button {border-radius: 0 0 11px 11px; overflow: hidden;}*/
/*    .background-hero1 #recomandate .product-thumb {border: 2px solid #ddd; border-radius: 12px;}*/
/*    .background-hero1 #recomandate .product-thumb .img-fluid {border-radius: 11px 11px 0 0;}*/
/*    .background-hero1 #recomandate .product-thumb .button {border-radius: 0 0 11px 11px; overflow: hidden;}*/

        .product-thumb {
            border: 2px solid #ddd; border-radius: 12px;
            .img-fluid {border-radius: 11px 11px 0 0;}
        }

.background-hero1 {  /* idem dar nested */
    #product-list, #recomandate, #similare {
    
        .product-thumb {
            border: 2px solid #ddd; border-radius: 12px;

            .img-fluid {border-radius: 11px 11px 0 0;}

            /*.button {border-radius: 0 0 11px 11px; overflow: hidden;}*/
        }
    }
}

/*.background-hero1 #product-list .product-thumb .description {background: #33133073;}*/
/*.background-hero1 #product-list .product-thumb:hover .description {background: #331330;}*/
/*    .background-hero1 #recomandate .product-thumb .description {background: #33133073;}*/
/*    .background-hero1 #recomandate .product-thumb:hover .description {background: #331330;}*/

/*.background-hero1 #product-list .product-thumb .image a:hover {opacity: initial !important;}*/
/*.background-hero1 #product-list .product-thumb:hover img {filter: brightness(108%);}*/
/*    .background-hero1 #recomandate .product-thumb .image a:hover {opacity: initial !important;}*/
/*    .background-hero1 #recomandate .product-thumb:hover img {filter: brightness(108%);}*/

                            /*    .product-thumb .description p {min-height: 72px;}  */

.background-hero1 { /* idem dar nested */
    #product-list, #recomandate, #similare {
        
        .product-thumb {
            .description, form {background: #33133040;
                /* p {min-height: 72px;} */
                p {min-height: 94px;}
            }

            &:hover {
                .description, form {background: #331330;}
                img {filter: brightness(108%);}
            }

            .image a:hover {opacity: initial !important;}
        }
    }
}

    a.btn-primary, a.btn-primary:hover, button.btn-primary, button.btn-primary:hover {background-color: #710011;}

.background-hero1 .text-end {
    a.btn-primary, a.btn-primary:hover, button.btn-primary, button.btn-primary:hover {
        background-color: #331330; border-color: #8b7d7c;
    }
}
                   .list-group-item {border-color: #f8dcdf;}
                   .list-group-item.active {background: #b3999c; border-color: #6c0d0d;}

.background-hero1 a.list-group-item.active {background: black !important; border-color: #6c0d0d;}

                    div.input-group > label, div.input-group > select, div.input-group > input {border-color: #f8dcdf;}


            /* product page, too */ 
            
                    .background-hero1 aside#column-left .list-group-item {background-color: #ffececf2;}
            
                    .background-hero1 #product .input-group-text,
                    .background-hero1 #product .input-group-text + input {background-color: #e1cfff; background-color: #ffcfe8; background-color: #ffdcecb0;}
                    .background-hero1 #product-info li,
                    .background-hero1 #tab-description * {color: white; text-shadow: 0 0 2px darkred;}  
                    .background-hero1 #button-cart {background-color: #331330; border-color: #a685da; color: #a685da;} 
                    .background-hero1 #button-cart:hover {border-color: #331330; border-color: white; color: white; transform: scale(1.02);}
                    
            /* info pages, too */
                    .background-hero1 #information-sitemap h1 + div {
                        li, a {color: white; font-weight: 600; text-shadow: 0 0 3px rebeccapurple;}
                        a:hover {color: #ffbaf9; text-shadow: 0 0 12px black;}
                    }
                    
                    .background-hero1 #information-contact fieldset {
                        legend, div label {color: white; font-weight: 600; text-shadow: 0 0 15px rebeccapurple;}
                    }
                    .background-hero1 #cart > div > ul > li > table, .background-hero1 #output-cart table {
                        td > a, td.text-start a, small /*, td.text-end */ {color: black; text-shadow: 1px 1px 3px #331330; font-weight: 600;}
                    }
                    .background-hero1 #cart > div > ul > li > table, .background-hero1 #output-cart table {
                        td.text-end {font-weight: 600;}
                    }
                    
                                      #cart table td > a, #output-cart table td.text-wrap > a {font-weight: 700; color: rgb(49 127 153);}
                    
                    .background-hero1 #cart table.table-bordered td.text-end:first-of-type {background: #daa8a824;}
                    .background-hero1 #cart table.table-bordered td + td.text-end {background: #f8dcdb85; border: 2px solid #4e050514; font-weight: 600; font-size: larger; padding-right: 16px;}
                    .background-hero1 #cart table.table-bordered + p.text-end {
                        a {color: rgb(51 19 48); text-shadow: 1px 1px 4px #770e6d61;}
                        a:hover {color: rgb(51 19 48); text-shadow: 1px 1px 6px darkred; transform: scale(1.08);}
                    }
                    
                                      #checkout-total td + td {font-weight: bolder; padding: 8px 16px 8px 8px;}
                                      #output-cart td.text-end {font-size: larger; padding: 8px 16px 8px 8px;}
                    .background-hero1 #checkout-total td + td.text-end {font-weight: 600; font-size: larger; padding-right: 14px;}
                    
                                      #checkout-payment button {background-color: #490d13 !important;}
                    
                    .background-hero1 #account-login p, .background-hero1 #form-login label, .background-hero1 #form-login a {color: white;}
                                      #account-login h2 + p + p {flex: 1;}
                    
                                      .invalid-feedback {color: yellow; background: #1d1ba1b5; /* red */; padding-left: 14px;} .invalid-feedback::before {content: ' 💡 ';}
                    
                    .background-hero1 #form-register {p, fieldset legend, fieldset label, label {color: white;} legend {text-shadow: 0 0 2px #eedeea, 0 0 12px navy;} p a, label a {color: #99cffb;} button.btn-primary, button.btn-primary:hover {color: white; background: #331330;} .invalid-feedback {color: yellow; background: red; padding-left: 14px;} .invalid-feedback::before {content: ' 💡 ';}}
                    .background-hero1 #checkout-shipping-method, .background-hero1 #checkout-payment-method, .background-hero1 #form-forgotten {legend, label {color: white;} legend {text-shadow: 0 0 2px #eedeea, 0 0 12px navy;} label a {color: #99cffb;} .input-group button.btn-primary {color: white; background: #331330;} .invalid-feedback {color: yellow; background: red; padding-left: 14px;} .invalid-feedback::before {content: ' 💡 ';}}
                                      #checkout-confirm a {color: rgb(108 11 21); font-size: larger; font-weight: bolder;}
                                      #checkout-confirm tfoot td + td {font-size: larger;}
                    .background-hero1 #checkout-confirm {tbody td a {color: darkred; font-weight: 600; font-size: larger; text-shadow: 1px 1px 3px #331330a3;} tfoot td.text-end:first-of-type {background: #fff6f6;} tfoot tr td + td.text-end {background: #fff2f2; border: 2px solid #f1dedede; font-weight: 600; font-size: larger; padding-right: 14px;}}
                    
                        /*.background-hero1 #error-name.d-block, .background-hero1 #error-email.d-block, .background-hero1 #error-enquiry.d-block {color: yellow; background: red; padding-left: 14px;}*/
                        /*.background-hero1 #error-name.d-block::before, .background-hero1 #error-email.d-block::before, .background-hero1 #error-enquiry.d-block::before {content: ' 💡 ';}*/
                    
                    .background-hero1 h4.modal-title {color: #19162b;}
                    
                    .background-hero1 #form-contact {
                        .invalid-feedback {color: yellow; background-color: red; padding-left: 14px;}
                        .invalid-feedback::before {content: ' 💡 ';}
                    }
                    
                    .background-hero1 #shopping-cart > div.alert.alert-danger.alert-dismissible {text-shadow: 1px 1px 3px #ed87e3; font-weight: 600;}
                    .background-hero1 #shopping-cart p {color: white;}
/*  end background blurat  */

#recomandate, #product-list { > div > div > div.content > div {
    padding-bottom: 85px;
    margin-bottom: unset !important;
    border-radius: 0 0 12px 12px;
}}
#content div.product-thumb > div.content .button {
    justify-content: center;
    border-left: none !important;
}
/*#product-list > div:nth-child(1) > div > div.content > form > div {background-color: #331330;}*/

#content div.product-thumb > div.content .button button[type='submit'] {
    width: 70%;
    max-width: 318px;
    border-radius: 12px;
    border: 2px solid rebeccapurple;
    border: 2px solid #e1acc7;
    margin-bottom: 16px;
    color: rebeccapurple; 
    color: #591b3b;
    font-weight: bold;
}

        .product-thumb .price {
            text-align: center;
            font-size: 1.6em;}
            
.background-hero1 .product-thumb .price {
    color: #fec0c0 !important;}
.background-hero1 #product-info #content span[class^="price"] {
    font-size: 1.15em;
    color: #fec0c0 !important;}
    
#shopping-cart #accordion {
    display: none;
}
.background-hero1 #product-search {
    label, h2 + p {color: white; opacity: 1;}
}
.background-hero1 .page-link.active, .background-hero1 .active > .page-link {background-color: #4e274d;}
.background-hero1 .pagination .page-item {border: 1px solid #e8d0d0;}

.background-hero1 #cart.staysimple td.text-end {background-color: white !important;}

.background-hero1 #product-list + div .text-end {color: white;}

.col.notificomenzi {
    margin: 16px 44px; border: 1px solid grey; border-radius: 12px; padding: 12px 24px; color: #4f0648; background-color: #f8dcdb; font-weight: 600; border: 1px solid white; cursor: pointer;
}

#modal-shipping, #modal-payment { h5.modal-title {color: black;}}

.background-hero1  #common-success p {color: white;}

li.breadcrumb-item a {color: #bf0f69;}

#kodprodus {color: #bf0f69;}
.background-hero1 #kodprodus {color: #ff9393;}



/*  gototop btn  */
        #backToTop {
            position: fixed;
            bottom: 30px;
            right: 40px;
            width: 60px;
            height: 60px;
            background-color: #462d4e;
            color: white;
            border: none;
            border-radius: 50%;
            font-size: 20px;
            cursor: pointer;
            display: none;
            box-shadow: 0 0 12px rgb(255 248 248);
            z-index: 30;
        }
        
        #backToTop:hover {
          background-color: #5d0404;
        }
/*  end gototop  */




/*  ofertetop grid  */

        .grid-container {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); /* 4 elem */
        	/*grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); // 5 elem */
            gap: 2rem 1.2rem;
        }
        
                /*@media (max-width: 1399px) {.grid-container {column-gap: 1.2rem;}}*/
        
        .box {
            background-color: #ffffff;
            padding: 2rem;
            border-radius: 1rem;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            text-align: center;
            transition: transform 0.4s ease-out;
        }
        
                @media (max-width: 443px) {.box {margin: 12px;}}
        
        .box:hover {
          transform: translateY(-5px);
        }
        
        .box img {
            /* max-width: 80%; */
            /* height: auto; */
            width: auto;
            height: 170px;
            border-radius: 5px; 
            border: 1px solid #9447474f;}

        .box a {color: #462d4e; text-shadow: 0 0 3px #c72d2d;}
        
        .box-title {
            font-weight: bold;
            font-size: 1.2rem;
            color: #333;
            margin-bottom: 1rem;
            line-height: normal;
            min-height: 55px;
        }
        
        .box-text {
            font-size: 1rem;
            color: #555;
            line-height: 1.5;
                        overflow: hidden;
                        text-align: center;
        }
        
        #motivatii {
            margin: 35px auto;
        }
        
                                /*.grid-container#motivatii {display: none;}*/
        
        #motivatii > div {
            box-shadow: 3px 3px 7px #9f6d6d;
            margin-bottom: -13px;
            padding-top: 15px;
            padding-bottom: 25px;
            transition: box-shadow 0.6s ease-out;
            user-select: none;
        }
        
        #motivatii > div:hover {
            box-shadow: 6px 6px 8px #7e3e3e; 
             /* cursor: url('/image/cadou.png'), auto; */
        }

/*  end ofertetop  */




/*  theme changer  */
        #theme-toggle {
            display: flex;
            justify-content: center;
            align-items: center;
            border: 1px solid #32171a;
            border-radius: 17px 0 0 17px;
                right: -1px;
        }
        #theme-toggle:has(.fa-sun) { 
            /*border-radius: 50%;*/
            /*background-color: #57201d;*/
            background-color: #8e5b5b;
            padding: 5px 26px 5px 8px;
        }

        #theme-toggle:has(.fa-moon) {
            background-color: #fcecec;
            padding: 5px 25px 5px 10px;
        }
        
        .theme-button {
            position: absolute;
            /*right: 30px;*/
            top: 60px;
            cursor: pointer;
            font-size: 24px;
            z-index: 1000;
            transition: all 0.3s ease;
            color: yellow;
        }
        
        .fa-sun {color: yellow;}
        .fa-moon {color: #727228;}
        
        /* Ajustare pentru ecrane sub 768px */
        @media (max-width: 767px) {
            .theme-button {
                /*top: 10px;*/
                top: 16px;
                right: -3px !important;
            }
        }

/* end theme changer */



/*  css user account  */

        .background-hero1 #account-account #content ul li a,
        .background-hero1 #form-customer legend, .background-hero1  #form-customer label,
        .background-hero1 #form-password legend, .background-hero1 #form-password label,
        .background-hero1 #payment-method,
        .background-hero1 #account-wishlist p,
        .background-hero1 #address,
        .background-hero1 #account-transaction table + div, .background-hero1 #account-reward div.text-end,
        .background-hero1 #form-newsletter label {color: white;}
        
        li[id^="no"] {display: none;}
        #common-success #column-right {visibility: hidden; width: 0;}
        
        [id^="account-"] #column-right {
        	a[href*="route=account/wishlist"],
        	a[href*="route=account/download"],
        	a[href*="route=account/subscription"],
        	a[href*="route=account/reward"],
        	a[href*="route=account/return"],
        	a[href*="route=account/transaction"]{
        		display: none !important;}
        }
        
        #column-right {padding-top: 34px;}
/*  end user account  */


.background-hero1 .paginfo {
    p, ul li {
        color: white;
        font-weight: 600;
        text-shadow: 0 0 15px rebeccapurple;}
}

.depaste p {font-size: larger;
    font-weight: normal !important;}
    
#comandaacum select, #comandaacum input, #comandaacum textarea {
    background-color: antiquewhite;
    border-radius: 8px;
    border-width: 1px;
}

#comandaacum select:focus option,
#comandaacum input:focus,
#comandaacum textarea:focus {color: darkred; font-weight: 600;}