@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');


*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}


body{

background:#ffffff;

color:#0b1f44;

padding-bottom:110px;

}



/* MAIN CONTAINER */

.container{

max-width:650px;

margin:auto;

padding:20px;

}



/* HEADER */

.header{

display:flex;

align-items:center;

justify-content:flex-start;

margin-bottom:25px;

}


.header a{

width:52px;

height:52px;

display:flex;

align-items:center;

justify-content:center;

background:white;

border:1px solid #e5e7eb;

border-radius:18px;

color:#D4AF37;

font-size:20px;

text-decoration:none;

box-shadow:

0 10px 25px rgba(11,31,68,.12);

}



/* PRODUCTS AREA */

#productsContainer{

display:grid;

grid-template-columns:1fr;

gap:22px;

}



/* LOADING */

.loading{

background:white;

border-radius:28px;

padding:35px;

text-align:center;

color:#64748b;

border:1px solid #e5e7eb;

box-shadow:

0 15px 40px rgba(11,31,68,.08);

}



/* PRODUCT CARD */

.product-card{

background:white;

border-radius:28px;

overflow:hidden;

border:1px solid #e5e7eb;

box-shadow:

0 18px 45px rgba(11,31,68,.10);

transition:.3s;

}


.product-card:hover{

transform:translateY(-4px);

}



/* IMAGE */

.product-card img{

width:100%;

height:240px;

object-fit:cover;

display:block;

}



/* CARD CONTENT */

.product-content{

padding:20px;

}


.product-title{

font-size:22px;

font-weight:800;

color:#0b1f44;

margin-bottom:10px;

}



.product-price{

font-size:26px;

font-weight:800;

color:#D4AF37;

margin-bottom:15px;

}



.product-meta{

display:flex;

gap:8px;

flex-wrap:wrap;

margin-bottom:18px;

}


.product-meta span{

background:#fff8e7;

color:#0b1f44;

padding:7px 12px;

border-radius:999px;

font-size:12px;

font-weight:700;

}



/* ACTION BUTTONS */

.product-actions{

display:flex;

gap:12px;

}



.product-actions button,
.product-actions a{

flex:1;

padding:14px;

border-radius:16px;

border:none;

font-weight:700;

text-align:center;

text-decoration:none;

cursor:pointer;

}



.view-btn{

background:#0b1f44;

color:white;

}



.promote-btn{

background:#D4AF37;

color:#0b1f44;

}



/* EMPTY STATE */

.empty-card{

background:white;

border-radius:28px;

padding:40px 20px;

text-align:center;

border:1px solid #e5e7eb;

color:#64748b;

}



/* BOTTOM NAV */


.bottom-nav{

position:fixed;

left:18px;

right:18px;

bottom:18px;

height:75px;

background:#0b1f44;

border-radius:40px;

display:flex;

justify-content:space-around;

align-items:center;

z-index:999;

box-shadow:

0 20px 45px rgba(11,31,68,.35);

}



.nav-item{

color:white;

text-decoration:none;

display:flex;

flex-direction:column;

align-items:center;

gap:4px;

font-size:12px;

font-weight:600;

}



.nav-item i{

font-size:20px;

}



.nav-item.active{

color:#D4AF37;

}





/* ==========================
PROMOTION MODAL
========================== */


.promotion-modal{

display:none;

position:fixed;

inset:0;

background:rgba(11,31,68,.55);

z-index:9999;

padding:20px;

}



.promotion-box{

background:white;

max-width:420px;

margin:60px auto;

border-radius:32px;

overflow:hidden;

box-shadow:

0 30px 80px rgba(0,0,0,.25);

}



/* TOP */

.promotion-top{

background:#0b1f44;

color:white;

padding:30px;

text-align:center;

}



.promotion-icon{

width:70px;

height:70px;

border-radius:50%;

background:#D4AF37;

display:flex;

align-items:center;

justify-content:center;

margin:auto auto 15px;

font-size:28px;

color:#0b1f44;

}



.promotion-top h3{

font-size:25px;

font-weight:800;

}



.promotion-top p{

font-size:14px;

opacity:.85;

margin-top:8px;

}



/* PROMO CONTENT */

#promotionContent{

padding:25px;

}



.promo-plan{

padding:18px;

border-radius:18px;

border:1px solid #e5e7eb;

margin-bottom:14px;

cursor:pointer;

font-weight:700;

color:#0b1f44;

transition:.3s;

}



.promo-plan.active{

border-color:#D4AF37;

background:#fffaf0;

}



.promo-btn{

width:100%;

padding:17px;

border:none;

border-radius:16px;

background:#0b1f44;

color:white;

font-size:16px;

font-weight:700;

cursor:pointer;

}



.promo-btn:hover{

background:#D4AF37;

color:#0b1f44;

}



.promo-success{

text-align:center;

padding:30px;

}



.promo-success h2{

color:#D4AF37;

font-weight:800;

}



.promo-close{

width:100%;

padding:15px;

margin-top:20px;

border:none;

border-radius:16px;

background:#0b1f44;

color:white;

font-weight:700;

}



/* MOBILE */

@media(max-width:480px){

.container{

padding:15px;

}


.product-card img{

height:210px;

}


.product-title{

font-size:20px;

}


.product-price{

font-size:23px;

}

}
/* ==========================================
   NEXORA PREMIUM LISTINGS ADDITIONAL STYLE
   GOLD + NAVY + IVORY THEME
========================================== */


/* PRODUCT CARD */

.product-card{

    background:#ffffff;

    border-radius:28px;

    padding:22px;

    border:1px solid #eee7d5;

    box-shadow:
    0 15px 40px rgba(11,31,68,.10);

    cursor:pointer;

    transition:.3s ease;

}


.product-card:hover{

    transform:translateY(-5px);

    box-shadow:
    0 25px 60px rgba(11,31,68,.16);

}



/* PRODUCT TITLE */

.product-title{

    font-size:22px;

    font-weight:800;

    color:#0B1F44;

    line-height:1.35;

    margin-bottom:12px;

}



/* PRODUCT PRICE */

.product-price{

    font-size:28px;

    font-weight:900;

    color:#D4AF37;

    margin-bottom:15px;

}



/* PRODUCT INFORMATION TAGS */

.product-info{

    display:inline-block;

    background:#F8F6EF;

    color:#475569;

    padding:8px 14px;

    border-radius:999px;

    font-size:13px;

    font-weight:600;

    margin:5px 5px 5px 0;

    border:1px solid #E8DDB8;

}



/* STATUS BADGES */

.sponsored-badge{

    background:#D4AF37;

    color:#0B1F44;

    padding:10px;

    border-radius:16px;

    text-align:center;

    font-weight:800;

    margin-top:15px;

}



.pending-badge{

    background:#FFF7D6;

    color:#92400E;

    padding:10px;

    border-radius:16px;

    text-align:center;

    font-weight:800;

    margin-top:15px;

}



/* SELLER ACTION AREA */

.actions{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:10px;

    margin-top:22px;

}



/* ALL ACTION BUTTONS */

.actions button{

    border:none;

    padding:14px 10px;

    border-radius:16px;

    font-size:14px;

    font-weight:700;

    cursor:pointer;

    transition:.3s ease;

}


.actions button:hover{

    transform:translateY(-2px);

}



/* EDIT */

.edit-btn{

    background:#E8F0FF;

    color:#1736D1;

}



/* STOCK */

.stock-btn{

    background:#E8FFF4;

    color:#047857;

}



/* PROMOTE */

.promote-btn{

    background:#D4AF37;

    color:#0B1F44;

}



/* DELETE */

.delete-btn{

    background:#FFE8E8;

    color:#B91C1C;

}



/* PROMOTION MODAL */

.promotion-box{

    border-radius:30px;

    background:#FFFDF8;

    box-shadow:
    0 25px 70px rgba(0,0,0,.25);

}



.promo-header{

    background:
    linear-gradient(
    135deg,
    #0B1F44,
    #1736D1
    );

    color:#ffffff;

    padding:25px;

    font-size:24px;

    font-weight:800;

}



.promo-plan{

    background:white;

    border:1px solid #E5E7EB;

    border-radius:20px;

    padding:18px;

    margin-bottom:14px;

    font-weight:800;

    color:#0B1F44;

    transition:.3s;

}



.promo-plan:hover{

    border-color:#D4AF37;

}



.promo-plan.active{

    background:#FFF9E6;

    border:2px solid #D4AF37;

}



/* PROMOTION BUTTON */

.promo-btn{

    background:#0B1F44;

    color:white;

    border-radius:18px;

    padding:16px;

    font-weight:800;

    border:none;

    width:100%;

}



/* PAYMENT SECTION */

.payment-amount{

    font-size:32px;

    font-weight:900;

    color:#D4AF37;

    text-align:center;

    margin:15px 0;

}



.till-box{

    background:#FFF9E6;

    border:2px solid #D4AF37;

    border-radius:20px;

    padding:18px;

    text-align:center;

}



/* SUCCESS AREA */

.promo-success h2{

    color:#0B1F44;

}



/* MOBILE */

@media(max-width:480px){

    .product-card{

        padding:18px;

        border-radius:24px;

    }


    .product-title{

        font-size:20px;

    }


    .product-price{

        font-size:25px;

    }


    .actions{

        grid-template-columns:1fr;

    }

}
/* CLOSE BUTTON */

.promo-close-x{

position:absolute;

top:18px;

right:18px;

width:42px;

height:42px;

border-radius:50%;

border:none;

background:white;

color:#0B1F44;

font-size:30px;

font-weight:300;

line-height:1;

cursor:pointer;

display:flex;

align-items:center;

justify-content:center;

box-shadow:
0 8px 20px rgba(0,0,0,.15);

z-index:10;

}


.promo-close-x:hover{

background:#D4AF37;

color:#ffffff;

}


/* REQUIRED FOR POSITIONING */

.promotion-box{

position:relative;

}
/* =====================================
   LISTINGS INTRO HEADER
===================================== */

.listings-intro{

    margin:25px 0 30px;

    padding:25px;

    background:#ffffff;

    border-radius:28px;

    border:1px solid #eee7d5;

    box-shadow:
    0 15px 40px rgba(11,31,68,.08);

}


.listings-intro h1{

    font-size:32px;

    font-weight:900;

    color:#0B1F44;

    margin-bottom:10px;

}


.listings-intro h1::after{

    content:"";

    display:block;

    width:70px;

    height:4px;

    background:#D4AF37;

    border-radius:20px;

    margin-top:12px;

}


.listings-intro p{

    margin-top:18px;

    color:#64748B;

    font-size:15px;

    line-height:1.8;

}


@media(max-width:480px){

    .listings-intro{

        padding:22px;

    }


    .listings-intro h1{

        font-size:26px;

    }

}

/* ==========================================================
   NEXORA — CYBERMUSE-INSPIRED RESPONSIVE VISUAL SYSTEM
   Mobile • Tablet • Desktop
   Dark editorial • champagne accents • square geometry
========================================================== */

:root{
    --nx-bg:#08070c;
    --nx-bg2:#17121c;
    --nx-panel:rgba(255,255,255,.045);
    --nx-panel-strong:rgba(255,255,255,.075);
    --nx-line:rgba(255,255,255,.11);
    --nx-gold-line:rgba(234,223,207,.28);
    --nx-text:#fff;
    --nx-muted:rgba(255,255,255,.62);
    --nx-muted-2:rgba(255,255,255,.78);
    --nx-champagne:#eadfcf;
    --nx-gold:#d4af37;
    --nx-danger:#ff9aad;
    --nx-success:#a9efbd;
}

html,
body{
    background:
        radial-gradient(circle at 10% 5%,rgba(141,118,255,.12),transparent 28%),
        radial-gradient(circle at 90% 75%,rgba(212,175,55,.08),transparent 30%),
        linear-gradient(135deg,var(--nx-bg),var(--nx-bg2) 60%,#29221f) !important;
    color:var(--nx-text) !important;
}

body{
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}

button,
input,
select,
textarea{
    font:inherit;
}

button,
input,
select,
textarea,
a{
    -webkit-tap-highlight-color:transparent;
}

button,
input,
select,
textarea{
    border-radius:0 !important;
}

input,
select,
textarea{
    background:rgba(255,255,255,.045) !important;
    color:#fff !important;
    border:1px solid var(--nx-line) !important;
    box-shadow:none !important;
    outline:none !important;
}

input::placeholder,
textarea::placeholder{
    color:rgba(255,255,255,.38) !important;
}

input:focus,
select:focus,
textarea:focus{
    border-color:rgba(234,223,207,.52) !important;
    box-shadow:0 0 0 2px rgba(234,223,207,.06) !important;
}

select option{
    background:#17141c;
    color:#fff;
}

::-webkit-scrollbar{
    width:5px;
    height:5px;
}

::-webkit-scrollbar-track{
    background:#09080c;
}

::-webkit-scrollbar-thumb{
    background:rgba(234,223,207,.35);
    border-radius:0;
}


/* ==========================================================
   MY LISTINGS PAGE
========================================================== */

.container{
    width:min(100%,980px) !important;
    max-width:980px !important;
    margin:auto !important;
    padding:24px 18px 110px !important;
}

.header a{
    border-radius:0 !important;
    background:rgba(255,255,255,.055) !important;
    color:var(--nx-champagne) !important;
    border:1px solid var(--nx-line) !important;
    box-shadow:none !important;
}

.loading,
.empty-card,
.product-card,
.listings-intro{
    border-radius:0 !important;
    background:var(--nx-panel) !important;
    color:#fff !important;
    border:1px solid var(--nx-line) !important;
    box-shadow:none !important;
}

.listings-intro h1,
.product-title{
    color:#fff !important;
}

.listings-intro p,
.loading,
.empty-card{
    color:var(--nx-muted) !important;
}

#productsContainer{
    gap:14px !important;
}

.product-card{
    padding:0 !important;
    overflow:hidden !important;
}

.product-card:hover{
    transform:none !important;
    border-color:rgba(234,223,207,.32) !important;
}

.product-card img{
    width:100% !important;
    height:auto !important;
    aspect-ratio:16/10 !important;
    max-height:480px !important;
    object-fit:cover !important;
    background:#050505 !important;
}

.product-content{
    padding:18px !important;
}

.product-price{
    color:var(--nx-champagne) !important;
}

.product-meta span,
.product-info,
.sponsored-badge,
.pending-badge{
    border-radius:0 !important;
    background:rgba(255,255,255,.035) !important;
    color:var(--nx-muted-2) !important;
    border:1px solid var(--nx-line) !important;
}

.sponsored-badge{
    background:var(--nx-champagne) !important;
    color:#111 !important;
    border-color:var(--nx-champagne) !important;
}

.pending-badge{
    background:rgba(212,175,55,.10) !important;
    color:#f5d98d !important;
    border-color:rgba(212,175,55,.28) !important;
}

.product-actions button,
.product-actions a,
.actions button{
    border-radius:0 !important;
    box-shadow:none !important;
}

.view-btn,
.promote-btn{
    background:#fff !important;
    color:#111 !important;
}

.edit-btn,
.stock-btn{
    background:rgba(255,255,255,.045) !important;
    color:var(--nx-champagne) !important;
    border:1px solid var(--nx-line) !important;
}

.delete-btn{
    background:rgba(255,154,173,.10) !important;
    color:var(--nx-danger) !important;
    border:1px solid rgba(255,154,173,.28) !important;
}

/* Promotion modal */
.promotion-modal{
    background:rgba(0,0,0,.86) !important;
    backdrop-filter:blur(14px) !important;
}

.promotion-box{
    border-radius:0 !important;
    background:#141118 !important;
    color:#fff !important;
    border:1px solid var(--nx-line) !important;
    box-shadow:none !important;
}

.promotion-top,
.promo-header{
    background:#0d0b11 !important;
    color:#fff !important;
    border-bottom:1px solid var(--nx-line) !important;
}

.promotion-icon{
    border-radius:0 !important;
    background:var(--nx-champagne) !important;
    color:#111 !important;
}

.promo-plan,
.till-box{
    border-radius:0 !important;
    background:rgba(255,255,255,.035) !important;
    color:#fff !important;
    border:1px solid var(--nx-line) !important;
}

.promo-plan.active{
    background:rgba(234,223,207,.08) !important;
    border-color:var(--nx-champagne) !important;
}

.promo-btn,
.promo-close{
    border-radius:0 !important;
    background:#fff !important;
    color:#111 !important;
}

.promo-close-x{
    border-radius:0 !important;
    background:rgba(255,255,255,.055) !important;
    color:#fff !important;
    border:1px solid var(--nx-line) !important;
    box-shadow:none !important;
}

/* Bottom nav */
.bottom-nav{
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    height:70px !important;
    border-radius:0 !important;
    background:rgba(8,7,12,.96) !important;
    border-top:1px solid var(--nx-line) !important;
    box-shadow:none !important;
    backdrop-filter:blur(18px) !important;
}

.nav-item{
    color:var(--nx-muted) !important;
}

.nav-item.active{
    color:var(--nx-champagne) !important;
}

/* MOBILE */
@media(max-width:767px){

    .container{
        width:100% !important;
        padding:12px 0 95px !important;
    }

    .header,
    .listings-intro{
        margin-left:12px !important;
        margin-right:12px !important;
    }

    #productsContainer{
        grid-template-columns:1fr !important;
        gap:10px !important;
    }

    .product-card{
        border-left:0 !important;
        border-right:0 !important;
    }

    .product-actions,
    .actions{
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:8px !important;
    }

    .product-card img{
        aspect-ratio:4/3 !important;
    }
}

/* TABLET */
@media(min-width:768px) and (max-width:1199px){

    .container{
        max-width:920px !important;
        padding:28px 24px 110px !important;
    }

    #productsContainer{
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:16px !important;
    }
}

/* DESKTOP */
@media(min-width:1200px){

    .container{
        max-width:1180px !important;
        padding:38px 0 120px !important;
    }

    #productsContainer{
        display:grid !important;
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        gap:18px !important;
    }
}

/* ==========================================================
   FINAL MY LISTINGS — HORIZONTAL CARD LAYOUT
   IMAGE LEFT • DESCRIPTION + ACTIONS RIGHT
========================================================== */

#productsContainer{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;
    width:100% !important;
}

#productsContainer .product-card{
    width:100% !important;
    display:grid !important;
    grid-template-columns:minmax(135px,34%) minmax(0,66%) !important;
    align-items:stretch !important;
    padding:0 !important;
    margin:0 !important;
    overflow:hidden !important;
    border-radius:0 !important;
    background:rgba(255,255,255,.045) !important;
    border:1px solid rgba(255,255,255,.11) !important;
    box-shadow:none !important;
    cursor:pointer !important;
    min-height:220px !important;
    transition:border-color .2s ease,background .2s ease !important;
}

#productsContainer .product-card:hover{
    transform:none !important;
    border-color:rgba(255,193,107,.45) !important;
    background:rgba(255,255,255,.06) !important;
}

.listing-image-side{
    position:relative !important;
    width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
    background:#09090b !important;
}

#productsContainer .product-card .listing-product-image{
    display:block !important;
    width:100% !important;
    height:100% !important;
    min-height:220px !important;
    max-height:none !important;
    aspect-ratio:auto !important;
    object-fit:cover !important;
    object-position:center !important;
    margin:0 !important;
    border:0 !important;
    border-radius:0 !important;
}

.listing-status{
    position:absolute !important;
    top:10px !important;
    left:10px !important;
    z-index:4 !important;
    margin:0 !important;
    padding:6px 9px !important;
    background:#FFC16B !important;
    color:#111 !important;
    border:0 !important;
    border-radius:0 !important;
    font-size:9px !important;
    font-weight:900 !important;
    letter-spacing:1px !important;
}

.listing-stock-overlay{
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    padding:9px 8px !important;
    background:rgba(12,10,14,.90) !important;
    color:#fff !important;
    text-align:center !important;
    font-size:9px !important;
    font-weight:800 !important;
    letter-spacing:1px !important;
    backdrop-filter:blur(8px) !important;
}

.listing-details-side{
    min-width:0 !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:space-between !important;
    gap:14px !important;
    padding:16px !important;
    background:rgba(255,255,255,.018) !important;
}

.listing-main-info{min-width:0 !important;}

#productsContainer .product-title{
    margin:0 0 6px !important;
    color:#fff !important;
    font-size:18px !important;
    line-height:1.25 !important;
    font-weight:800 !important;
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    overflow:hidden !important;
}

#productsContainer .product-price{
    margin:0 0 10px !important;
    color:#FFC16B !important;
    font-size:20px !important;
    font-weight:900 !important;
    line-height:1.2 !important;
}

.listing-description{
    margin-bottom:12px !important;
    color:rgba(255,255,255,.68) !important;
    font-size:12px !important;
    line-height:1.55 !important;
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    overflow:hidden !important;
}

.listing-meta{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:6px !important;
    margin-bottom:8px !important;
}

.listing-meta span{
    display:inline-flex !important;
    align-items:center !important;
    gap:5px !important;
    padding:5px 7px !important;
    background:rgba(255,255,255,.045) !important;
    border:1px solid rgba(255,255,255,.09) !important;
    border-radius:0 !important;
    color:rgba(255,255,255,.74) !important;
    font-size:9px !important;
    font-weight:600 !important;
}

.listing-meta i{color:#FFC16B !important;}

#productsContainer .pending-badge{
    display:inline-flex !important;
    width:auto !important;
    margin:6px 0 0 !important;
    padding:6px 8px !important;
    border-radius:0 !important;
    background:rgba(255,193,107,.09) !important;
    border:1px solid rgba(255,193,107,.28) !important;
    color:#FFC16B !important;
    font-size:8px !important;
    font-weight:800 !important;
    letter-spacing:.6px !important;
}

#productsContainer .actions{
    width:100% !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:6px !important;
    margin:0 !important;
}

#productsContainer .actions button{
    width:100% !important;
    min-width:0 !important;
    min-height:38px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    padding:8px 6px !important;
    border-radius:0 !important;
    font-size:10px !important;
    font-weight:800 !important;
    white-space:nowrap !important;
    box-shadow:none !important;
}

#productsContainer .edit-btn{
    background:rgba(255,255,255,.06) !important;
    color:#fff !important;
    border:1px solid rgba(255,255,255,.13) !important;
}

#productsContainer .stock-btn{
    background:rgba(255,193,107,.08) !important;
    color:#FFC16B !important;
    border:1px solid rgba(255,193,107,.26) !important;
}

#productsContainer .promote-btn{
    background:#FFC16B !important;
    color:#111 !important;
    border:1px solid #FFC16B !important;
}

#productsContainer .delete-btn{
    background:rgba(255,89,117,.10) !important;
    color:#ff8da1 !important;
    border:1px solid rgba(255,89,117,.25) !important;
}

@media(max-width:767px){
    #productsContainer{gap:8px !important;}
    #productsContainer .product-card{
        grid-template-columns:42% 58% !important;
        min-height:205px !important;
        border-left:0 !important;
        border-right:0 !important;
    }
    #productsContainer .product-card .listing-product-image{min-height:205px !important;}
    .listing-details-side{padding:12px 10px !important;gap:9px !important;}
    #productsContainer .product-title{font-size:14px !important;margin-bottom:5px !important;}
    #productsContainer .product-price{font-size:16px !important;margin-bottom:7px !important;}
    .listing-description{font-size:10px !important;line-height:1.45 !important;margin-bottom:8px !important;-webkit-line-clamp:2 !important;}
    .listing-meta{gap:4px !important;}
    .listing-meta span{padding:4px 5px !important;font-size:7.5px !important;}
    #productsContainer .actions{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:5px !important;}
    #productsContainer .actions button{min-height:34px !important;padding:6px 3px !important;font-size:8px !important;gap:3px !important;}
}

@media(max-width:380px){
    #productsContainer .product-card{grid-template-columns:40% 60% !important;}
    .listing-description{-webkit-line-clamp:1 !important;}
    #productsContainer .actions button{font-size:7.5px !important;}
}

@media(min-width:768px) and (max-width:1199px){
    #productsContainer{display:flex !important;flex-direction:column !important;gap:12px !important;}
    #productsContainer .product-card{grid-template-columns:260px minmax(0,1fr) !important;min-height:250px !important;}
    #productsContainer .product-card .listing-product-image{min-height:250px !important;}
    #productsContainer .actions{max-width:460px !important;}
}

@media(min-width:1200px){
    #productsContainer{display:flex !important;flex-direction:column !important;gap:14px !important;}
    #productsContainer .product-card{grid-template-columns:300px minmax(0,1fr) !important;min-height:280px !important;}
    #productsContainer .product-card .listing-product-image{min-height:280px !important;}
    .listing-details-side{padding:22px !important;}
    #productsContainer .product-title{font-size:22px !important;}
    #productsContainer .product-price{font-size:25px !important;}
    .listing-description{max-width:650px !important;font-size:13px !important;}
    #productsContainer .actions{max-width:520px !important;}
}