/* =====================================================
   FarmerKart Global Styles
   Version : 1.0
   Founder : Saikumar
===================================================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{

    font-family:'Inter',sans-serif;

    background:#f5f7fa;

    color:#333;

    overflow-x:hidden;

}

a{

    text-decoration:none;

    color:inherit;

}

ul{

    list-style:none;

}

img{

    width:100%;

    display:block;

}

/* ---------------- Container ---------------- */

.container{

    width:95%;

    max-width:1400px;

    margin:auto;

}

/* ---------------- Theme Colors ---------------- */

:root{

    --primary:#2E7D32;

    --primary-dark:#1B5E20;

    --secondary:#F9A825;

    --background:#F5F7FA;

    --white:#ffffff;

    --text:#333333;

    --gray:#777777;

    --shadow:0 8px 25px rgba(0,0,0,.08);

    --radius:12px;

}

/* ---------------- Buttons ---------------- */

.btn{

    display:inline-block;

    padding:12px 24px;

    background:var(--primary);

    color:#fff;

    border-radius:8px;

    transition:.3s;

    font-weight:600;

}

.btn:hover{

    background:var(--primary-dark);

}

/* ---------------- Section ---------------- */

section{

    padding:60px 0;

}

.section-title{

    font-family:'Poppins',sans-serif;

    font-size:32px;

    color:var(--text);

    margin-bottom:30px;

}

.card{

    background:#fff;

    border-radius:12px;

    box-shadow:var(--shadow);

}
/* =====================================================
   FARMERKART SEARCH PAGE
===================================================== */

.search-page {
    padding-top: 50px;
    padding-bottom: 70px;
}

/* Search Header */

.search-header {
    margin-bottom: 35px;
}

.search-header h1 {
    font-family: 'Poppins', sans-serif;
    font-size: 38px;
    font-weight: 700;
    color: #222;
    margin-bottom: 8px;
}

.search-header p {
    font-size: 17px;
    color: #777;
}

.search-header strong {
    color: #2E7D32;
}


/* =====================================================
   PRODUCT GRID
===================================================== */

.search-page .product-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 25px;
    align-items: stretch;
}


/* =====================================================
   PRODUCT CARD
===================================================== */

.search-page .product-card {
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    display: flex;
    flex-direction: column;
}

.search-page .product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
}


/* =====================================================
   PRODUCT IMAGE
===================================================== */

.search-page .product-image {
    display: block;
    width: 100%;
    height: 250px;
    overflow: hidden;
    background: #f5f5f5;
}

.search-page .product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.search-page .product-card:hover .product-image img {
    transform: scale(1.05);
}


/* =====================================================
   PRODUCT INFORMATION
===================================================== */

.search-page .product-info {
    padding: 18px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.search-page .product-info h3 {
    font-family: 'Poppins', sans-serif;
    font-size: 19px;
    line-height: 1.35;
    margin: 0 0 8px;
    color: #222;
}

.search-page .product-info h3 a {
    color: #222;
}

.search-page .product-info h3 a:hover {
    color: #2E7D32;
}


/* Unit */

.search-page .product-unit {
    font-size: 14px;
    color: #777;
    margin-bottom: 8px;
}


/* Price */

.search-page .product-price {
    font-size: 22px;
    font-weight: 700;
    color: #2E7D32;
    margin-bottom: 8px;
}


/* Verified Farmer */

.search-page .verified-farmer {
    font-size: 14px;
    color: #2E7D32;
    margin-bottom: 16px;
}


/* =====================================================
   ADD TO CART
===================================================== */

.search-page .add-cart-btn {
    width: 100%;
    margin-top: auto;
    border: none;
    cursor: pointer;
    padding: 12px 16px;
    font-size: 15px;
}

.search-page .add-cart-btn i {
    margin-right: 6px;
}


/* =====================================================
   EMPTY / NO RESULTS
===================================================== */

.search-empty {
    background: #fff;
    border-radius: 14px;
    padding: 70px 30px;
    text-align: center;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
}

.search-icon {
    font-size: 55px;
    margin-bottom: 15px;
}

.search-empty h2 {
    font-family: 'Poppins', sans-serif;
    font-size: 26px;
    margin-bottom: 10px;
    color: #222;
}

.search-empty p {
    color: #777;
    font-size: 16px;
    margin-bottom: 25px;
}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 1100px) {

    .search-page .product-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 768px) {

    .search-page {
        padding-top: 35px;
        padding-bottom: 50px;
    }

    .search-header h1 {
        font-size: 30px;
    }

    .search-page .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 15px;
    }

    .search-page .product-image {
        height: 190px;
    }

    .search-page .product-info {
        padding: 14px;
    }

    .search-page .product-info h3 {
        font-size: 16px;
    }

    .search-page .product-price {
        font-size: 19px;
    }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 480px) {

    .search-page .product-grid {
        grid-template-columns: 1fr;
    }

    .search-page .product-image {
        height: 230px;
    }

}

/* =====================================================
   FARMERKART SEARCH PAGE
===================================================== */

.search-page{
    width:95%;
    max-width:1400px;
    margin:0 auto;
    padding:55px 0 80px;
}

/* Search Heading */

.search-header{
    margin-bottom:35px;
}

.search-header h1{
    margin:0 0 8px;
    font-family:'Poppins',sans-serif;
    font-size:36px;
    font-weight:700;
    line-height:1.2;
    color:#222;
}

.search-header p{
    margin:0;
    font-size:17px;
    color:#777;
}

.search-header strong{
    color:#2E7D32;
}


/* =====================================================
   PRODUCT GRID
===================================================== */

.search-product-grid{
    width:100%;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:25px;
    align-items:stretch;
}


/* =====================================================
   PRODUCT CARD
===================================================== */

.search-product-grid .product-card{
    width:100%;
    min-width:0;
    margin:0;
    padding:0;
    background:#fff;
    border-radius:14px;
    overflow:hidden;
    box-shadow:0 6px 20px rgba(0,0,0,.08);
    display:flex;
    flex-direction:column;
    transition:.25s ease;
}

.search-product-grid .product-card:hover{
    transform:translateY(-5px);
    box-shadow:0 12px 30px rgba(0,0,0,.12);
}


/* =====================================================
   PRODUCT IMAGE
===================================================== */

.search-product-grid .product-image{
    width:100%;
    height:240px;
    overflow:hidden;
    background:#f5f5f5;
}

.search-product-grid .product-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    margin:0;
}

.search-product-grid .product-card:hover
.product-image img{
    transform:scale(1.05);
}


/* =====================================================
   PRODUCT INFORMATION
===================================================== */

.search-product-grid .product-info{
    width:100%;
    padding:18px;
    display:flex;
    flex-direction:column;
    flex:1;
}

.search-product-grid .product-info h3{
    margin:0 0 8px;
    font-family:'Poppins',sans-serif;
    font-size:18px;
    line-height:1.35;
    font-weight:600;
    color:#222;
}

.search-product-grid .product-info h3 a{
    color:#222;
}

.search-product-grid .product-info h3 a:hover{
    color:#2E7D32;
}

.search-product-grid .product-unit{
    margin:0 0 8px;
    font-size:14px;
    color:#777;
}

.search-product-grid .product-price{
    margin:0 0 8px;
    font-size:22px;
    font-weight:700;
    color:#2E7D32;
}

.search-product-grid .verified-farmer{
    margin:0 0 18px;
    font-size:14px;
    color:#2E7D32;
}


/* =====================================================
   ADD TO CART
===================================================== */

.search-product-grid .add-cart-btn{
    width:100%;
    margin-top:auto;
    padding:12px 15px;
    border:0;
    border-radius:8px;
    background:#2E7D32;
    color:#fff;
    font-size:15px;
    font-weight:600;
    cursor:pointer;
}

.search-product-grid .add-cart-btn:hover{
    background:#1B5E20;
}


/* =====================================================
   NO RESULTS
===================================================== */

.search-empty{
    width:100%;
    background:#fff;
    border-radius:14px;
    padding:70px 30px;
    text-align:center;
    box-shadow:0 6px 20px rgba(0,0,0,.06);
}

.search-icon{
    font-size:55px;
    margin-bottom:15px;
}

.search-empty h2{
    margin-bottom:10px;
    font-family:'Poppins',sans-serif;
    font-size:26px;
    color:#222;
}

.search-empty p{
    margin-bottom:25px;
    color:#777;
}


/* =====================================================
   TABLET
===================================================== */

@media(max-width:1100px){

    .search-product-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media(max-width:768px){

    .search-page{
        padding-top:35px;
        padding-bottom:50px;
    }

    .search-header h1{
        font-size:30px;
    }

    .search-product-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:15px;
    }

    .search-product-grid .product-image{
        height:190px;
    }

    .search-product-grid .product-info{
        padding:14px;
    }

    .search-product-grid .product-info h3{
        font-size:16px;
    }

    .search-product-grid .product-price{
        font-size:19px;
    }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media(max-width:480px){

    .search-product-grid{
        grid-template-columns:1fr;
    }

    .search-product-grid .product-image{
        height:230px;
    }

}
/* =====================================================
   FARMERKART PRODUCT DETAILS
   FLIPKART-STYLE PRODUCT PAGE
===================================================== */

.product-layout {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 58%) minmax(380px, 42%);
    gap: 35px;
    align-items: start;
    background: #fff;
    border-radius: 14px;
    padding: 30px;
    margin-bottom: 35px;
    box-shadow: 0 4px 18px rgba(0,0,0,.06);
}


/* =====================================================
   PRODUCT GALLERY
===================================================== */

.product-gallery {
    position: relative;
    padding: 0;
    margin: 0;
    background: #fff;
}

.product-image-area {
    width: 100%;
    display: grid;
    grid-template-columns: 90px minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}


/* =====================================================
   THUMBNAILS
===================================================== */

.thumbnail-gallery {
    width: 90px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.thumbnail-gallery .thumb {
    width: 82px;
    height: 82px;
    padding: 5px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    overflow: hidden;
}

.thumbnail-gallery .thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 5px;
}

.thumbnail-gallery .thumb.active {
    border: 2px solid #2E7D32;
}

.thumbnail-gallery .thumb:hover {
    border-color: #2E7D32;
}


/* =====================================================
   MAIN PRODUCT IMAGE
===================================================== */

.main-image {
    width: 100%;
    height: 560px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 10px;
    overflow: hidden;
}

.main-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    transition: transform .3s ease;
}

.main-image:hover img {
    transform: scale(1.03);
}


/* =====================================================
   WISHLIST
===================================================== */

.product-wishlist {
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 5;

    width: 44px;
    height: 44px;

    border: 1px solid #ddd;
    border-radius: 50%;

    background: #fff;
    color: #555;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 20px;
    cursor: pointer;

    box-shadow: 0 2px 8px rgba(0,0,0,.08);
}

.product-wishlist:hover {
    color: #e53935;
    border-color: #e53935;
}


/* =====================================================
   PRODUCT INFORMATION
===================================================== */

.product-layout > .product-info {
    width: 100%;
    padding: 5px 10px 10px;
    margin: 0;
    background: #fff;
}


/* Category */

.product-info .product-category {
    display: inline-block;

    font-size: 14px;
    font-weight: 600;

    color: #2E7D32;

    margin-bottom: 12px;
}


/* Product Title */

.product-info .product-title {
    margin: 0 0 12px;

    font-family: 'Poppins', sans-serif;

    font-size: 28px;
    line-height: 1.35;
    font-weight: 600;

    color: #212121;
}


/* =====================================================
   RATING / VERIFIED
===================================================== */

.product-rating-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.rating-badge {
    display: inline-flex;
    align-items: center;

    padding: 5px 10px;

    border-radius: 4px;

    background: #2E7D32;
    color: #fff;

    font-size: 13px;
    font-weight: 600;
}

.rating-text {
    font-size: 14px;
    color: #777;
}


/* =====================================================
   PRICE
===================================================== */

.price-section {
    padding: 15px 0;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    margin-bottom: 18px;
}

.sale-price {
    display: block;

    font-size: 34px;
    line-height: 1.2;

    font-weight: 700;

    color: #2E7D32;
}

.price-note {
    display: block;

    margin-top: 5px;

    font-size: 12px;
    color: #777;
}


/* =====================================================
   STOCK
===================================================== */

.product-info .product-stock {
    display: flex;
    align-items: center;
    gap: 7px;

    margin-bottom: 22px;

    font-size: 15px;
    color: #2E7D32;
}

.product-info .product-stock i {
    font-size: 16px;
}


/* =====================================================
   UNIT
===================================================== */

.weight-section {
    margin-bottom: 22px;
    padding: 0;
}

.weight-section h4,
.quantity-section h4 {
    margin: 0 0 10px;

    font-size: 15px;
    font-weight: 600;
    color: #333;
}

.weight-buttons {
    display: flex;
    gap: 10px;
}

.weight {
    min-width: 75px;

    padding: 10px 18px;

    background: #fff;

    border: 1px solid #2E7D32;
    border-radius: 6px;

    color: #2E7D32;

    font-size: 14px;
    font-weight: 600;

    cursor: pointer;
}

.weight.active {
    background: #f1f8f2;
}


/* =====================================================
   QUANTITY
===================================================== */

.quantity-section {
    margin-bottom: 22px;
}

.quantity-control {
    display: inline-flex;

    height: 42px;

    border: 1px solid #ccc;
    border-radius: 6px;

    overflow: hidden;
}

.quantity-control button {
    width: 42px;

    border: 0;
    background: #f7f7f7;

    font-size: 20px;
    color: #333;

    cursor: pointer;
}

.quantity-control button:hover {
    background: #e8f5e9;
}

.quantity-control input {
    width: 50px;

    border: 0;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;

    text-align: center;

    font-size: 16px;
    font-weight: 600;

    outline: none;
}

.stock-note {
    margin-top: 7px;

    font-size: 12px;
    color: #777;
}


/* =====================================================
   ACTION BUTTONS
===================================================== */

.product-buttons {
    width: 100%;

    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 12px;

    margin-top: 10px;
}

.add-cart-form {
    width: 100%;
    margin: 0;
}

.product-buttons .cart-btn,
.product-buttons .buy-btn {
    width: 100%;
    min-height: 52px;

    border: 0;
    border-radius: 6px;

    font-size: 16px;
    font-weight: 700;

    cursor: pointer;

    transition: .2s ease;
}

.product-buttons .cart-btn {
    background: #2E7D32;
    color: #fff;
}

.product-buttons .cart-btn:hover {
    background: #1B5E20;
}

.product-buttons .buy-btn {
    background: #F9A825;
    color: #fff;
}

.product-buttons .buy-btn:hover {
    background: #EF8F00;
}


/* =====================================================
   DELIVERY INFORMATION
===================================================== */

.delivery-information {
    margin-top: 25px;

    border-top: 1px solid #eee;

    padding-top: 18px;
}

.delivery-item {
    display: flex;
    align-items: flex-start;

    gap: 12px;

    padding: 10px 0;
}

.delivery-icon {
    width: 35px;
    min-width: 35px;
    height: 35px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #f1f8f2;

    border-radius: 50%;

    font-size: 17px;
}

.delivery-item strong {
    display: block;

    margin-bottom: 2px;

    font-size: 14px;
    color: #333;
}

.delivery-item p {
    margin: 0;

    font-size: 13px;
    line-height: 1.4;

    color: #777;
}


/* =====================================================
   OUT OF STOCK
===================================================== */

.out-of-stock-box {
    padding: 15px;

    background: #fff3f3;

    border: 1px solid #ffcdd2;
    border-radius: 8px;

    color: #d32f2f;

    font-weight: 600;

    margin-bottom: 20px;
}


/* =====================================================
   FARMER / DESCRIPTION / RELATED
===================================================== */

.product-layout + .farmer-card,
.product-layout ~ .farmer-card,
.product-layout ~ .product-description,
.product-layout ~ .related-products {
    margin-top: 30px;
}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 1000px) {

    .product-layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .main-image {
        height: 500px;
    }

    .product-layout > .product-info {
        padding: 0;
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 600px) {

    .product-layout {
        width: 100%;
        padding: 15px;
        border-radius: 8px;
        gap: 25px;
    }

    .product-image-area {
        grid-template-columns: 65px minmax(0, 1fr);
        gap: 10px;
    }

    .thumbnail-gallery {
        width: 65px;
    }

    .thumbnail-gallery .thumb {
        width: 60px;
        height: 60px;
    }

    .main-image {
        height: 350px;
    }

    .product-info .product-title {
        font-size: 23px;
    }

    .sale-price {
        font-size: 29px;
    }

    .product-buttons {
        grid-template-columns: 1fr;
    }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 400px) {

    .main-image {
        height: 300px;
    }

    .product-image-area {
        grid-template-columns: 55px minmax(0, 1fr);
    }

    .thumbnail-gallery {
        width: 55px;
    }

    .thumbnail-gallery .thumb {
        width: 52px;
        height: 52px;
    }

}
/* =====================================================
   PRODUCT DETAILS - FINAL STRUCTURE FIX
===================================================== */

/* Remove global section spacing from product components */
.product-layout .product-gallery,
.product-layout .product-info {
    padding: 0 !important;
    margin: 0 !important;
}

/* Main two-column layout */
.product-layout {
    width: 100% !important;
    max-width: 1400px !important;

    display: grid !important;

    grid-template-columns: 58% 42% !important;

    gap: 35px !important;

    align-items: start !important;

    padding: 30px !important;

    margin: 30px auto !important;

    background: #fff;

    border-radius: 14px;

    box-shadow: 0 4px 18px rgba(0,0,0,.06);
}


/* =====================================================
   GALLERY
===================================================== */

.product-layout .product-gallery {
    width: 100% !important;

    display: grid !important;

    grid-template-columns: 85px minmax(0,1fr) !important;

    gap: 18px !important;

    position: relative;
}


/* Thumbnail column */

.product-layout .thumbnail-gallery {
    width: 85px !important;

    display: flex !important;

    flex-direction: column !important;

    gap: 12px !important;

    padding: 0 !important;

    margin: 0 !important;
}


/* Thumbnail */

.product-layout .thumbnail-gallery .thumb {
    width: 75px !important;
    height: 75px !important;

    object-fit: cover;

    border: 1px solid #ddd;

    border-radius: 8px;

    cursor: pointer;

    padding: 3px;

    background: #fff;
}

.product-layout .thumbnail-gallery .thumb.active {
    border: 2px solid #2E7D32;
}


/* Main image */

.product-layout .main-image {
    width: 100% !important;
    height: 560px !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    background: #fff;

    border: 1px solid #eee;

    border-radius: 10px;

    overflow: hidden;

    padding: 10px;
}

.product-layout .main-image img {
    width: 100% !important;
    height: 100% !important;

    object-fit: contain !important;

    display: block;
}


/* =====================================================
   PRODUCT INFORMATION
===================================================== */

.product-layout > .product-info {
    width: 100% !important;

    padding: 5px 10px !important;

    margin: 0 !important;

    display: block !important;
}


/* Category */

.product-layout .product-category {
    display: block;

    margin-bottom: 12px;

    font-size: 14px;

    color: #2E7D32;

    font-weight: 600;
}


/* Title */

.product-layout .product-title {
    margin: 0 0 15px !important;

    font-size: 28px !important;

    line-height: 1.35;

    font-weight: 600;

    color: #222;
}


/* Price */

.product-layout .product-price {
    margin: 15px 0 !important;
}

.product-layout .sale-price {
    font-size: 34px !important;

    font-weight: 700;

    color: #2E7D32;
}


/* Stock */

.product-layout .product-stock {
    margin: 15px 0 !important;

    color: #2E7D32;

    font-weight: 600;
}


/* Unit */

.product-layout .weight-section {
    margin: 20px 0 !important;
}

.product-layout .weight-buttons {
    display: flex;

    gap: 10px;
}

.product-layout .weight {
    padding: 10px 20px;

    border: 1px solid #2E7D32;

    border-radius: 6px;

    background: #fff;

    color: #2E7D32;

    cursor: pointer;
}


/* Quantity */

.product-layout .quantity-section {
    margin: 20px 0 !important;
}

.product-layout .quantity-box {
    display: inline-flex !important;

    align-items: center;

    border: 1px solid #ccc;

    border-radius: 6px;

    overflow: hidden;

    height: 42px;
}

.product-layout .quantity-box button {
    width: 42px;

    height: 42px;

    border: 0;

    background: #f5f5f5;

    cursor: pointer;

    font-size: 18px;
}

.product-layout .quantity-box input {
    width: 55px;

    height: 42px;

    border: 0;

    border-left: 1px solid #ddd;

    border-right: 1px solid #ddd;

    text-align: center;

    font-size: 16px;
}


/* =====================================================
   BUTTONS
===================================================== */

.product-layout .product-buttons {
    width: 100% !important;

    display: grid !important;

    grid-template-columns: 1fr 1fr !important;

    gap: 12px !important;

    margin-top: 25px !important;
}

.product-layout .product-buttons form {
    width: 100%;
}

.product-layout .cart-btn,
.product-layout .buy-btn {
    width: 100% !important;

    height: 52px;

    border: 0;

    border-radius: 6px;

    font-size: 16px;

    font-weight: 700;

    cursor: pointer;
}

.product-layout .cart-btn {
    background: #2E7D32;

    color: #fff;
}

.product-layout .buy-btn {
    background: #F9A825;

    color: #fff;
}


/* =====================================================
   DELIVERY
===================================================== */

.product-layout .delivery-box {
    margin-top: 25px !important;

    padding: 15px;

    background: #f8faf8;

    border-radius: 8px;

    color: #333;
}


/* =====================================================
   DESKTOP
===================================================== */

@media (min-width: 1001px) {

    .product-layout {
        grid-template-columns: 58% 42% !important;
    }

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 1000px) {

    .product-layout {
        grid-template-columns: 1fr !important;
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 600px) {

    .product-layout {
        width: 100% !important;

        padding: 15px !important;

        grid-template-columns: 1fr !important;
    }

    .product-layout .product-gallery {
        grid-template-columns: 60px minmax(0,1fr) !important;
    }

    .product-layout .thumbnail-gallery {
        width: 60px !important;
    }

    .product-layout .thumbnail-gallery .thumb {
        width: 55px !important;
        height: 55px !important;
    }

    .product-layout .main-image {
        height: 350px !important;
    }

    .product-layout .product-title {
        font-size: 23px !important;
    }

    .product-layout .product-buttons {
        grid-template-columns: 1fr !important;
    }

}

/* =========================================================
   FARMERKART PRODUCT PAGE - TEMPORARY FINAL FIX
   ========================================================= */

.product-details-page .product-main-section .product-layout {
    display: grid !important;
    grid-template-columns: 55% 45% !important;
    gap: 30px !important;

    width: 92% !important;
    max-width: 1400px !important;

    margin: 0 auto !important;

    align-items: start !important;
    box-sizing: border-box !important;
}


/* LEFT SIDE */

.product-details-page .product-left {
    width: 100% !important;
    min-width: 0 !important;
}


/* RIGHT SIDE */

.product-details-page .product-right {
    width: 100% !important;
    min-width: 0 !important;
}


/* PRODUCT GALLERY */

.product-details-page .product-gallery {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* MAIN IMAGE BOX */

.product-details-page .main-image {
    width: 100% !important;
    height: 600px !important;

    background: #fff !important;

    border: 1px solid #e5e5e5 !important;
    border-radius: 12px !important;

    overflow: hidden !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}


/* MAIN IMAGE */

.product-details-page .main-image img {
    width: 100% !important;
    height: 100% !important;

    object-fit: contain !important;

    display: block !important;
}


/* THUMBNAILS */

.product-details-page .thumbnail-gallery {
    display: flex !important;
    gap: 12px !important;

    margin-top: 15px !important;
}


.product-details-page .thumbnail-gallery img {
    width: 75px !important;
    height: 75px !important;

    object-fit: cover !important;

    border: 2px solid #ddd !important;
    border-radius: 8px !important;
}


/* RIGHT PRODUCT INFORMATION */

.product-details-page .product-info {
    width: 100% !important;

    display: flex !important;
    flex-direction: column !important;

    gap: 18px !important;

    box-sizing: border-box !important;
}


/* PRODUCT TITLE */

.product-details-page .product-title {
    font-size: 30px !important;
    line-height: 1.3 !important;

    margin: 0 !important;
}


/* PRICE */

.product-details-page .sale-price {
    font-size: 38px !important;
    font-weight: 700 !important;
}


/* QUANTITY */

.product-details-page .quantity-box {
    display: flex !important;

    width: 150px !important;
    height: 45px !important;

    border: 1px solid #ccc !important;
    border-radius: 8px !important;

    overflow: hidden !important;
}


.product-details-page .quantity-box button {
    width: 45px !important;
    border: none !important;

    background: #f5f5f5 !important;

    font-size: 20px !important;
}


.product-details-page .quantity-box input {
    flex: 1 !important;

    width: 60px !important;

    border: none !important;

    text-align: center !important;

    font-size: 17px !important;
}


/* BUTTONS */

.product-details-page .product-buttons {
    display: flex !important;

    gap: 15px !important;

    width: 100% !important;
}


.product-details-page .product-buttons form {
    flex: 1 !important;
}


.product-details-page .cart-btn,
.product-details-page .buy-btn {
    width: 100% !important;

    min-height: 52px !important;

    border-radius: 8px !important;

    font-size: 16px !important;
}


/* DELIVERY */

.product-details-page .delivery-box {
    width: 100% !important;

    box-sizing: border-box !important;
}


/* =========================================================
   TABLET / MOBILE
   ========================================================= */

@media (max-width: 900px) {

    .product-details-page .product-main-section .product-layout {
        grid-template-columns: 1fr !important;
    }

    .product-details-page .main-image {
        height: 500px !important;
    }

}


@media (max-width: 600px) {

    .product-details-page .product-main-section .product-layout {
        width: 94% !important;
    }

    .product-details-page .main-image {
        height: 350px !important;
    }

    .product-details-page .product-title {
        font-size: 25px !important;
    }

    .product-details-page .sale-price {
        font-size: 32px !important;
    }

    .product-details-page .product-buttons {
        flex-direction: column !important;
    }

}
/* =========================================================
   FARMERKART HOME PRODUCT ACTION BUTTONS
   ========================================================= */

.product-card .product-actions {
    display: flex;
    gap: 10px;
    width: 100%;
    margin-top: 18px;
    align-items: stretch;
}

/* Add to Cart form */

.product-card .featured-cart-form {
    flex: 1;
    margin: 0;
    padding: 0;
    display: flex;
}

/* Both buttons */

.product-card .product-actions .cart-btn,
.product-card .product-actions .buy-btn {
    width: 100%;
    min-height: 48px;
    height: 48px;
    padding: 0 12px;
    border: none;
    border-radius: 9px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    font-size: 14px;
    font-weight: 600;
    line-height: 1;

    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}

/* Add to Cart */

.product-card .product-actions .cart-btn {
    background: #2E7D32;
    color: #fff;
    flex: 1;
}

/* Buy Now */

.product-card .product-actions .buy-btn {
    background: #ff9800;
    color: #fff;
    flex: 1;
}

/* Hover */

.product-card .product-actions .cart-btn:hover {
    background: #256728;
}

.product-card .product-actions .buy-btn:hover {
    background: #e68900;
}

/* Form must not create extra width/height */

.product-card .featured-cart-form button {
    width: 100%;
    height: 48px;
}

/* Prevent old global cart button rules */

.product-card .product-actions form {
    flex: 1;
    width: auto;
}

/* Mobile */

@media (max-width: 600px) {

    .product-card .product-actions {
        flex-direction: column;
        gap: 8px;
    }

    .product-card .product-actions .cart-btn,
    .product-card .product-actions .buy-btn,
    .product-card .featured-cart-form,
    .product-card .featured-cart-form button {
        width: 100%;
    }

}
/* =========================================================
   CUSTOMER DASHBOARD
========================================================= */

.customer-dashboard {
    background: #f5f7f6;
    min-height: calc(100vh - 180px);
    padding: 45px 0 70px;
}

.dashboard-header {
    background: #ffffff;
    border-radius: 18px;
    padding: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 25px;
    margin-bottom: 25px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.06);
}

.dashboard-welcome {
    color: #2e7d32;
    font-weight: 600;
    margin: 0 0 5px;
}

.dashboard-header h1 {
    margin: 0;
    font-size: 32px;
    color: #17221a;
}

.dashboard-subtitle {
    margin: 8px 0 0;
    color: #6b7280;
}

.dashboard-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.dashboard-shop-btn,
.dashboard-logout-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
    border-radius: 10px;
    text-decoration: none;
    font-weight: 600;
}

.dashboard-shop-btn {
    background: #2e7d32;
    color: #ffffff;
}

.dashboard-shop-btn:hover {
    background: #256b29;
    color: #ffffff;
}

.dashboard-logout-btn {
    background: #f1f3f2;
    color: #333333;
}

.dashboard-logout-btn:hover {
    background: #e5e7e6;
}


/* PROFILE */

.dashboard-profile-card {
    background: #ffffff;
    border-radius: 18px;
    padding: 28px;
    display: flex;
    gap: 22px;
    align-items: flex-start;
    margin-bottom: 25px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.05);
}

.profile-icon {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #eef7e9;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    flex-shrink: 0;
}

.profile-details {
    flex: 1;
}

.profile-details h2 {
    margin: 0 0 20px;
    font-size: 22px;
}

.profile-info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.profile-info-grid div {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.profile-info-grid span {
    font-size: 13px;
    color: #777;
}

.profile-info-grid strong {
    color: #222;
    font-size: 15px;
}


/* STATS */

.dashboard-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 30px;
}

.stat-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 25px;
    display: flex;
    align-items: center;
    gap: 18px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.05);
}

.stat-icon {
    width: 55px;
    height: 55px;
    border-radius: 14px;
    background: #eef7e9;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 25px;
}

.stat-card span {
    display: block;
    color: #777;
    font-size: 14px;
    margin-bottom: 5px;
}

.stat-card strong {
    font-size: 22px;
    color: #2e7d32;
}


/* ORDERS */

.dashboard-section {
    background: #ffffff;
    border-radius: 18px;
    padding: 30px;
    margin-bottom: 30px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.05);
}

.section-heading {
    margin-bottom: 22px;
}

.section-heading h2 {
    margin: 0;
    font-size: 24px;
}

.section-heading p {
    color: #777;
    margin: 6px 0 0;
}

.orders-table-wrapper {
    width: 100%;
    overflow-x: auto;
}

.customer-orders-table {
    width: 100%;
    border-collapse: collapse;
}

.customer-orders-table th {
    text-align: left;
    padding: 15px;
    background: #f5f7f6;
    color: #555;
    font-size: 14px;
}

.customer-orders-table td {
    padding: 17px 15px;
    border-bottom: 1px solid #eeeeee;
    color: #333;
}

.customer-orders-table tr:last-child td {
    border-bottom: none;
}

.order-price {
    color: #2e7d32;
}

.payment-status,
.order-status {
    display: inline-flex;
    padding: 6px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

.payment-status {
    background: #fff4dc;
    color: #a56800;
}

.order-status {
    background: #eef2f3;
    color: #555;
}

.status-confirmed {
    background: #e8f5e9;
    color: #2e7d32;
}

.status-packed {
    background: #e3f2fd;
    color: #1565c0;
}

.status-shipped {
    background: #ede7f6;
    color: #5e35b1;
}

.status-delivered {
    background: #e8f5e9;
    color: #2e7d32;
}

.status-cancelled {
    background: #ffebee;
    color: #c62828;
}


/* EMPTY ORDERS */

.no-orders {
    text-align: center;
    padding: 55px 20px;
    background: #f8faf8;
    border-radius: 14px;
}

.no-orders-icon {
    font-size: 45px;
    margin-bottom: 10px;
}

.no-orders h3 {
    margin: 0 0 8px;
}

.no-orders p {
    color: #777;
    margin-bottom: 22px;
}


/* QUICK LINKS */

.dashboard-quick-links {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.quick-link {
    background: #ffffff;
    border-radius: 16px;
    padding: 22px;
    display: flex;
    align-items: center;
    gap: 15px;
    text-decoration: none;
    color: #222;
    box-shadow: 0 8px 25px rgba(0,0,0,0.05);
    transition: 0.2s ease;
}

.quick-link:hover {
    transform: translateY(-3px);
    color: #2e7d32;
}

.quick-link > span {
    font-size: 28px;
}

.quick-link strong {
    display: block;
    margin-bottom: 4px;
}

.quick-link small {
    color: #777;
}

.logout-link:hover {
    color: #c62828;
}


/* MOBILE */

@media (max-width: 900px) {

    .dashboard-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .profile-info-grid {
        grid-template-columns: 1fr 1fr;
    }

    .dashboard-stats {
        grid-template-columns: 1fr 1fr;
    }

    .dashboard-quick-links {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 600px) {

    .customer-dashboard {
        padding: 25px 0 50px;
    }

    .dashboard-header,
    .dashboard-profile-card,
    .dashboard-section {
        padding: 20px;
    }

    .dashboard-header h1 {
        font-size: 25px;
    }

    .profile-info-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-stats {
        grid-template-columns: 1fr;
    }

    .dashboard-actions {
        width: 100%;
    }

    .dashboard-shop-btn,
    .dashboard-logout-btn {
        flex: 1;
    }

    .customer-orders-table {
        min-width: 700px;
    }
}
/* CUSTOMER DASHBOARD TEST */

.customer-dashboard {
    background: #f5f7f6;
    min-height: 600px;
    padding: 40px 0 70px;
}

.dashboard-header {
    background: #ffffff;
    padding: 30px;
    border-radius: 18px;
    margin-bottom: 25px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.08);
}

.dashboard-profile-card {
    background: #ffffff;
    padding: 30px;
    border-radius: 18px;
    margin-bottom: 25px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.08);
}

.dashboard-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 30px;
}

.stat-card {
    background: #ffffff;
    padding: 25px;
    border-radius: 16px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
}

.dashboard-section {
    background: #ffffff;
    padding: 30px;
    border-radius: 18px;
    margin-bottom: 30px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.06);
}

.dashboard-quick-links {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.quick-link {
    background: #ffffff;
    padding: 22px;
    border-radius: 16px;
    text-decoration: none;
    color: #222;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
}

.dashboard-shop-btn {
    display: inline-block;
    background: #2e7d32;
    color: #ffffff;
    padding: 12px 20px;
    border-radius: 10px;
    text-decoration: none;
}

.dashboard-logout-btn {
    display: inline-block;
    background: #eeeeee;
    color: #333333;
    padding: 12px 20px;
    border-radius: 10px;
    text-decoration: none;
}

.profile-info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

@media (max-width: 700px) {

    .dashboard-stats {
        grid-template-columns: 1fr;
    }

    .dashboard-quick-links {
        grid-template-columns: 1fr;
    }

    .profile-info-grid {
        grid-template-columns: 1fr;
    }
}
/* =========================================================
   CUSTOMER ACCOUNT DROPDOWN
========================================================= */

.customer-account {
    position: relative;
    display: inline-block;
}


/* Customer name button */

.customer-account-btn {
    border: none;
    background: transparent;

    display: flex;
    align-items: center;
    gap: 7px;

    padding: 10px 8px;

    font-size: 16px;
    font-weight: 600;

    color: #222;

    cursor: pointer;

    border-radius: 8px;
}

.customer-account-btn:hover {
    color: #2e7d32;
    background: #f4f8f4;
}

.account-arrow {
    font-size: 17px;
    margin-left: 2px;
}


/* Dropdown */

.customer-account-menu {
    position: absolute;

    top: calc(100% + 8px);
    right: 0;

    width: 270px;

    background: #ffffff;

    border: 1px solid #e5e5e5;

    border-radius: 12px;

    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.15);

    overflow: hidden;

    z-index: 99999;

    display: none;
}


/* When opened */

.customer-account-menu.show {
    display: block;
}


/* Header */

.account-menu-header {
    display: flex;
    align-items: center;

    gap: 12px;

    padding: 16px;

    background: #f4f9f4;

    border-bottom: 1px solid #eeeeee;
}

.account-avatar {
    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #e8f5e9;

    border-radius: 50%;

    font-size: 20px;
}

.account-menu-header strong {
    display: block;

    color: #222;

    font-size: 15px;
}

.account-menu-header small {
    display: block;

    margin-top: 3px;

    color: #777;

    font-size: 12px;
}


/* Menu links */

.customer-account-menu a {
    display: flex;
    align-items: center;

    gap: 12px;

    padding: 13px 16px;

    color: #333;

    text-decoration: none;

    font-size: 14px;

    transition: 0.2s ease;
}

.customer-account-menu a:hover {
    background: #f3f8f3;

    color: #2e7d32;
}


/* Divider */

.account-menu-divider {
    height: 1px;

    background: #eeeeee;

    margin: 5px 0;
}


/* Logout */

.customer-account-menu .account-logout {
    color: #c62828;
}

.customer-account-menu .account-logout:hover {
    background: #fff3f3;

    color: #b71c1c;
}
/* =========================================================
   FARMERKART - FINAL CSS FIX
   Version: 2.0
   Purpose:
   - Customer account dropdown
   - Customer dashboard
   - Mobile header
   - Mobile account menu
   - Prevent layout conflicts
========================================================= */


/* =========================================================
   CUSTOMER ACCOUNT
========================================================= */

.customer-account {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    z-index: 10000 !important;
}

.customer-account-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 7px !important;

    height: 42px !important;
    padding: 8px 10px !important;

    border: 0 !important;
    background: transparent !important;

    color: #222 !important;

    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 600 !important;

    cursor: pointer !important;

    border-radius: 8px !important;
}

.customer-account-btn:hover {
    color: #2E7D32 !important;
    background: #f1f8f2 !important;
}

.customer-account-btn span {
    white-space: nowrap !important;
}

.account-arrow {
    font-size: 15px !important;
    line-height: 1 !important;
}


/* =========================================================
   ACCOUNT DROPDOWN
========================================================= */

.customer-account-menu {
    position: absolute !important;

    top: calc(100% + 8px) !important;
    right: 0 !important;

    width: 280px !important;
    max-width: calc(100vw - 20px) !important;

    padding: 0 !important;
    margin: 0 !important;

    background: #ffffff !important;

    border: 1px solid #e5e5e5 !important;
    border-radius: 14px !important;

    box-shadow:
        0 12px 35px rgba(0, 0, 0, 0.16) !important;

    overflow: hidden !important;

    z-index: 999999 !important;

    display: none !important;
}

.customer-account-menu.show {
    display: block !important;
}


/* =========================================================
   ACCOUNT MENU HEADER
========================================================= */

.account-menu-header {
    display: flex !important;
    align-items: center !important;

    gap: 12px !important;

    padding: 16px !important;

    background: #f4f9f4 !important;

    border-bottom: 1px solid #eeeeee !important;
}

.account-avatar {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #e8f5e9 !important;

    border-radius: 50% !important;

    font-size: 21px !important;
}

.account-menu-header strong {
    display: block !important;

    margin: 0 !important;

    color: #222 !important;

    font-size: 15px !important;
    font-weight: 700 !important;
}

.account-menu-header small {
    display: block !important;

    margin-top: 4px !important;

    color: #777 !important;

    font-size: 12px !important;
}


/* =========================================================
   ACCOUNT MENU LINKS
========================================================= */

.customer-account-menu a {
    width: 100% !important;

    display: flex !important;
    align-items: center !important;

    gap: 12px !important;

    padding: 13px 16px !important;
    margin: 0 !important;

    color: #333 !important;

    background: #fff !important;

    font-size: 14px !important;
    font-weight: 500 !important;

    text-decoration: none !important;

    transition: background .2s ease, color .2s ease !important;
}

.customer-account-menu a:hover {
    background: #f3f8f3 !important;
    color: #2E7D32 !important;
}


/* Divider */

.account-menu-divider {
    width: 100% !important;
    height: 1px !important;

    margin: 4px 0 !important;

    background: #eeeeee !important;
}


/* Logout */

.customer-account-menu .account-logout {
    color: #c62828 !important;
}

.customer-account-menu .account-logout:hover {
    background: #fff3f3 !important;
    color: #b71c1c !important;
}


/* =========================================================
   CUSTOMER DASHBOARD
========================================================= */

.customer-dashboard {
    width: 100% !important;

    min-height: calc(100vh - 180px) !important;

    padding: 45px 0 70px !important;

    background: #f5f7f6 !important;
}

.customer-dashboard .container {
    width: 95% !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
}


/* Dashboard Header */

.customer-dashboard .dashboard-header {
    width: 100% !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    gap: 25px !important;

    padding: 30px !important;
    margin-bottom: 25px !important;

    background: #fff !important;

    border-radius: 18px !important;

    box-shadow: 0 8px 30px rgba(0,0,0,.06) !important;
}

.dashboard-welcome {
    margin: 0 0 5px !important;

    color: #2E7D32 !important;

    font-size: 15px !important;
    font-weight: 600 !important;
}

.dashboard-header h1 {
    margin: 0 !important;

    color: #17221a !important;

    font-size: 32px !important;
    line-height: 1.2 !important;
}

.dashboard-subtitle {
    margin: 8px 0 0 !important;

    color: #6b7280 !important;

    font-size: 15px !important;
}


/* Dashboard buttons */

.dashboard-actions {
    display: flex !important;
    align-items: center !important;

    gap: 12px !important;
}

.dashboard-shop-btn,
.dashboard-logout-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 46px !important;

    padding: 12px 20px !important;

    border-radius: 10px !important;

    text-decoration: none !important;

    font-size: 14px !important;
    font-weight: 600 !important;
}

.dashboard-shop-btn {
    background: #2E7D32 !important;
    color: #fff !important;
}

.dashboard-shop-btn:hover {
    background: #1B5E20 !important;
    color: #fff !important;
}

.dashboard-logout-btn {
    background: #f1f3f2 !important;
    color: #333 !important;
}


/* =========================================================
   PROFILE CARD
========================================================= */

.customer-dashboard .dashboard-profile-card {
    width: 100% !important;

    display: flex !important;
    align-items: flex-start !important;

    gap: 22px !important;

    padding: 28px !important;
    margin-bottom: 25px !important;

    background: #fff !important;

    border-radius: 18px !important;

    box-shadow: 0 8px 30px rgba(0,0,0,.05) !important;
}

.profile-icon {
    width: 58px !important;
    min-width: 58px !important;
    height: 58px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #eef7e9 !important;

    border-radius: 50% !important;

    font-size: 28px !important;
}

.profile-details {
    flex: 1 !important;
    min-width: 0 !important;
}

.profile-details h2 {
    margin: 0 0 20px !important;

    font-size: 22px !important;
}

.profile-info-grid {
    display: grid !important;

    grid-template-columns: repeat(3, 1fr) !important;

    gap: 20px !important;
}

.profile-info-grid div {
    display: flex !important;
    flex-direction: column !important;

    gap: 6px !important;
}

.profile-info-grid span {
    color: #777 !important;

    font-size: 13px !important;
}

.profile-info-grid strong {
    color: #222 !important;

    font-size: 15px !important;
}


/* =========================================================
   DASHBOARD STATS
========================================================= */

.dashboard-stats {
    width: 100% !important;

    display: grid !important;

    grid-template-columns: repeat(3, 1fr) !important;

    gap: 20px !important;

    margin-bottom: 30px !important;
}

.stat-card {
    display: flex !important;
    align-items: center !important;

    gap: 18px !important;

    padding: 25px !important;

    background: #fff !important;

    border-radius: 16px !important;

    box-shadow: 0 8px 25px rgba(0,0,0,.05) !important;
}

.stat-icon {
    width: 55px !important;
    min-width: 55px !important;
    height: 55px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #eef7e9 !important;

    border-radius: 14px !important;

    font-size: 25px !important;
}

.stat-card span {
    display: block !important;

    margin-bottom: 5px !important;

    color: #777 !important;

    font-size: 14px !important;
}

.stat-card strong {
    display: block !important;

    color: #2E7D32 !important;

    font-size: 22px !important;
}


/* =========================================================
   DASHBOARD SECTIONS
========================================================= */

.customer-dashboard .dashboard-section {
    width: 100% !important;

    padding: 30px !important;
    margin-bottom: 30px !important;

    background: #fff !important;

    border-radius: 18px !important;

    box-shadow: 0 8px 30px rgba(0,0,0,.05) !important;
}

.section-heading h2 {
    margin: 0 !important;

    font-size: 24px !important;
}

.section-heading p {
    margin: 6px 0 0 !important;

    color: #777 !important;
}


/* =========================================================
   QUICK LINKS
========================================================= */

.dashboard-quick-links {
    display: grid !important;

    grid-template-columns: repeat(3, 1fr) !important;

    gap: 20px !important;
}

.quick-link {
    display: flex !important;
    align-items: center !important;

    gap: 15px !important;

    padding: 22px !important;

    background: #fff !important;

    border-radius: 16px !important;

    color: #222 !important;

    text-decoration: none !important;

    box-shadow: 0 8px 25px rgba(0,0,0,.05) !important;

    transition: transform .2s ease, box-shadow .2s ease !important;
}

.quick-link:hover {
    transform: translateY(-3px) !important;

    color: #2E7D32 !important;

    box-shadow: 0 12px 30px rgba(0,0,0,.08) !important;
}


/* =========================================================
   MOBILE HEADER
========================================================= */

@media (max-width: 768px) {

    .container {
        width: 94% !important;
    }

    .header .container {
        width: 100% !important;
    }

    .navbar {
        position: relative !important;
    }

    .nav-right {
        display: flex !important;
        align-items: center !important;

        gap: 8px !important;

        margin-left: auto !important;
    }

    .nav-right > a {
        white-space: nowrap !important;
    }

    .customer-account {
        position: relative !important;
    }

    .customer-account-btn {
        height: 38px !important;

        padding: 6px 7px !important;

        font-size: 14px !important;
    }

    .customer-account-btn span:first-of-type {
        max-width: 110px !important;

        overflow: hidden !important;

        text-overflow: ellipsis !important;
    }

    .customer-account-menu {
        position: fixed !important;

        top: 125px !important;
        right: 10px !important;
        left: auto !important;

        width: 280px !important;

        max-width: calc(100vw - 20px) !important;
    }

    .customer-account-menu a {
        min-height: 46px !important;

        padding: 12px 15px !important;
    }


    /* Dashboard */

    .customer-dashboard {
        padding: 25px 0 50px !important;
    }

    .customer-dashboard .container {
        width: 94% !important;
    }

    .customer-dashboard .dashboard-header {
        flex-direction: column !important;

        align-items: flex-start !important;

        padding: 22px !important;
    }

    .dashboard-header h1 {
        font-size: 25px !important;
    }

    .dashboard-actions {
        width: 100% !important;
    }

    .dashboard-shop-btn,
    .dashboard-logout-btn {
        flex: 1 !important;
    }


    /* Profile */

    .customer-dashboard .dashboard-profile-card {
        padding: 22px !important;

        flex-direction: column !important;
    }

    .profile-info-grid {
        grid-template-columns: 1fr !important;
    }


    /* Stats */

    .dashboard-stats {
        grid-template-columns: 1fr !important;

        gap: 15px !important;
    }

    .stat-card {
        padding: 20px !important;
    }


    /* Sections */

    .customer-dashboard .dashboard-section {
        padding: 22px !important;
    }


    /* Quick links */

    .dashboard-quick-links {
        grid-template-columns: 1fr !important;

        gap: 15px !important;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .top-bar {
        font-size: 12px !important;

        padding: 8px 5px !important;

        text-align: center !important;
    }

    .top-bar span {
        margin: 0 3px !important;
    }

    .customer-account-btn {
        font-size: 13px !important;
    }

    .customer-account-menu {
        top: 115px !important;
        right: 8px !important;

        width: calc(100vw - 16px) !important;
    }

    .dashboard-actions {
        flex-direction: column !important;
    }

    .dashboard-shop-btn,
    .dashboard-logout-btn {
        width: 100% !important;

        flex: none !important;
    }

    .dashboard-header h1 {
        font-size: 23px !important;
    }

    .profile-info-grid {
        gap: 15px !important;
    }

}