/* ========================================
   DHANVANTRI AROGYA - MODERN UI REDESIGN
   Version: 3.0
   Minimal, wellness-focused design system
   ======================================== */

/* === CSS VARIABLES === */
:root {
    --primary: #2e7d32;
    --primary-light: #4caf50;
    --primary-dark: #1b5e20;
    --secondary: #5d4037;
    --accent: #ff8f00;
    --bg-light: #fafbf7;
    --bg-white: #ffffff;
    --bg-section: #f5f7f2;
    --text-dark: #1a2e1a;
    --text-body: #3d4f3d;
    --text-muted: #6b7b6b;
    --border: #e0e8d8;
    --shadow-sm: 0 2px 8px rgba(46, 125, 50, 0.06);
    --shadow-md: 0 4px 20px rgba(46, 125, 50, 0.1);
    --shadow-lg: 0 8px 40px rgba(46, 125, 50, 0.12);
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --font-heading: 'Inter', 'Noto Sans', sans-serif;
    --font-body: 'Inter', 'Noto Sans', sans-serif;
    --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

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

body {
    font-family: var(--font-body) !important;
    color: var(--text-body) !important;
    background: var(--bg-light) !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
    -webkit-font-smoothing: antialiased !important;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading) !important;
    color: var(--text-dark) !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
    text-transform: capitalize !important;
}

p {
    font-family: var(--font-body) !important;
    color: var(--text-body) !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

/* === HEADER REDESIGN === */
.header_top {
    background: var(--primary-dark) !important;
    padding: 8px 0 !important;
    font-size: 13px;
}

.header_top ul li,
.header_top ul li a {
    color: rgba(255,255,255,0.9) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
}

.header_top ul li a:hover {
    color: #fff !important;
}

header .sticky {
    background: rgba(255, 255, 255, 0.98) !important;
    padding: 12px 0 !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--border);
    box-shadow: none !important;
}

header .is-sticky .sticky {
    box-shadow: var(--shadow-sm) !important;
}

header .logo img {
    height: 45px !important;
    transition: var(--transition);
}

header .navbar li a {
    font-family: var(--font-body) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--text-dark) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    padding: 10px 0 !important;
    margin: 0 12px !important;
}

header .navbar li a:before {
    background: var(--primary) !important;
    height: 3px !important;
    border-radius: 2px !important;
    top: auto !important;
    bottom: 0 !important;
}

header .navbar li.active a,
header .navbar li a:hover {
    color: var(--primary) !important;
}

/* Cart badge */
.cart-badge {
    background: var(--accent) !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    border-radius: 50% !important;
    padding: 2px 6px !important;
    position: relative;
    top: -8px;
    left: -5px;
}

/* === BUTTONS REDESIGN === */
.btn {
    font-family: var(--font-body) !important;
    font-weight: 600 !important;
    border-radius: var(--radius-sm) !important;
    padding: 12px 28px !important;
    font-size: 14px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    line-height: 1.5 !important;
    transition: var(--transition) !important;
    border: none !important;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.btn-primary,
.btn-round {
    background: var(--primary) !important;
    color: #fff !important;
    border: none !important;
}

.btn-primary:hover,
.btn-round:hover {
    background: var(--primary-dark) !important;
    color: #fff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(46, 125, 50, 0.25) !important;
}

.btn-success {
    background: var(--primary) !important;
    color: #fff !important;
}

.btn-success:hover {
    background: var(--primary-dark) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(46, 125, 50, 0.25) !important;
}

.btn-outline-primary {
    background: transparent !important;
    color: var(--primary) !important;
    border: 2px solid var(--primary) !important;
}

.btn-outline-primary:hover {
    background: var(--primary) !important;
    color: #fff !important;
}

.btn-sm {
    padding: 8px 18px !important;
    font-size: 13px !important;
    border-radius: var(--radius-sm) !important;
}

.btn-lg {
    padding: 16px 36px !important;
    font-size: 16px !important;
}

.btn-small {
    padding: 10px 24px !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
}

/* === HERO SECTION REDESIGN === */
.home-slider.simple-head {
    background: linear-gradient(135deg, rgba(27,94,32,0.55) 0%, rgba(46,125,50,0.5) 100%), url('../site/images/slide-bg-3.jpg') center center / cover no-repeat !important;
    min-height: 520px !important;
    padding-top: 0 !important;
    padding-bottom: 60px !important;
    margin-bottom: 0 !important;
    position: relative;
    overflow: hidden;
    display: flex !important;
    align-items: center !important;
}

.home-slider.simple-head::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, transparent 70%);
    border-radius: 50%;
}

.home-slider.simple-head::after {
    content: '';
    position: absolute;
    bottom: -30%;
    left: -10%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(255,255,255,0.03) 0%, transparent 70%);
    border-radius: 50%;
}

.home-slider .position-center-center {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
}

.home-slider .price {
    background: rgba(255, 143, 0, 0.9) !important;
    padding: 6px 18px !important;
    border-radius: 30px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    display: inline-block;
    margin-bottom: 16px;
}

.home-slider h4 {
    font-size: 20px !important;
    font-weight: 400 !important;
    color: rgba(255,255,255,0.85) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    margin-bottom: 12px !important;
    font-family: var(--font-body) !important;
}

.home-slider .extra-huge-text {
    font-size: 56px !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    color: #fff !important;
    margin-bottom: 30px !important;
    letter-spacing: -0.03em !important;
}

.home-slider .btn {
    background: #fff !important;
    color: var(--primary-dark) !important;
    padding: 14px 36px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.15) !important;
}

.home-slider .btn:hover {
    background: var(--accent) !important;
    color: #fff !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.2) !important;
}

/* === SECTION HEADINGS === */
.heading {
    margin-bottom: 50px !important;
}

.heading h4 {
    font-size: 32px !important;
    font-weight: 800 !important;
    color: var(--text-dark) !important;
    letter-spacing: -0.02em !important;
    text-transform: capitalize !important;
    margin-bottom: 12px !important;
}

.heading span {
    font-family: var(--font-body) !important;
    font-size: 16px !important;
    color: var(--text-muted) !important;
    font-weight: 400 !important;
    width: 60% !important;
}

/* === PRODUCT CARDS === */
/* Override Owl Carousel block-slide to use CSS grid */
.papular-block.block-slide {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 20px !important;
}

.papular-block.block-slide .owl-wrapper-outer,
.papular-block.block-slide .owl-wrapper,
.papular-block.block-slide .owl-item {
    display: contents !important;
}

.papular-block .item {
    background: var(--bg-white);
    border-radius: var(--radius-md) !important;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
    margin-bottom: 0 !important;
    border: 1px solid var(--border);
    display: flex;
    flex-direction: column;
}

.papular-block .item:hover {
    transform: translateY(-6px) !important;
    box-shadow: var(--shadow-lg) !important;
    border-color: transparent;
}

.papular-block .item .item-img {
    border-radius: var(--radius-md) var(--radius-md) 0 0 !important;
    overflow: hidden;
    position: relative;
    height: 200px;
}

.papular-block .item .item-img img {
    transition: transform 0.5s ease !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.papular-block .item:hover .item-img img {
    transform: scale(1.05) !important;
}

.papular-block .item .item-name {
    padding: 10px 12px 6px !important;
    flex: 1;
}

.papular-block .item .item-name a {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--text-dark) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    line-height: 1.3 !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.papular-block .item .item-name a:hover {
    color: var(--primary) !important;
}

.product-action-section {
    padding: 8px 12px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    border-top: 1px solid var(--border);
    margin-top: auto;
}

.product-action-section .price {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--primary-dark) !important;
}

.product-action-section .price small {
    font-size: 12px !important;
}

.product-action-section .btn {
    padding: 6px 12px !important;
    font-size: 11px !important;
}

/* === TREATMENT CARDS === */
.treatment-booking-section {
    padding: 12px 16px 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    border-top: 1px solid var(--border);
}

.treatment-booking-section .price {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--primary-dark) !important;
}

/* === NEW ARRIVALS / TREATMENTS GRID === */
.new-arrival-list li article {
    border-radius: var(--radius-md) !important;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}

.new-arrival-list li article img {
    height: 280px;
    object-fit: cover;
    width: 100%;
}

.new-arrival-list li article .position-center-center {
    background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, transparent 100%);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 30px;
    transform: none;
}

.new-arrival-list li article h4 a {
    color: #fff !important;
    font-size: 18px !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* === SPECIAL OFFERS SECTION === */
.special-offers {
    background: linear-gradient(135deg, rgba(27,94,32,0.6) 0%, rgba(46,125,50,0.55) 100%), url('../site/images/special-bg.jpg') center center / cover no-repeat !important;
    padding: 80px 0 !important;
    margin: 0 !important;
    min-height: auto !important;
}

.special-offers h4 {
    color: var(--accent) !important;
    font-size: 16px !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
}

.special-offers .extra-huge-text {
    font-size: 48px !important;
    line-height: 1.2 !important;
    color: #fff !important;
    text-transform: capitalize !important;
    letter-spacing: -0.02em !important;
}

.special-offers .btn {
    background: #fff !important;
    color: var(--primary-dark) !important;
    padding: 14px 36px !important;
}

.special-offers .btn:hover {
    background: var(--accent) !important;
    color: #fff !important;
}

/* === ABOUT SECTION === */
.small-about {
    background: var(--bg-white) !important;
    padding: 80px 0 !important;
}

.small-about .heading h4 {
    text-transform: capitalize !important;
}

/* Hide social icons from about/middle sections on homepage */
.small-about .social-icons-wrapper,
.small-about .social_icons {
    display: none !important;
}

/* === TOP BAR SOCIAL ICONS - see sticky header section below === */

/* === SOCIAL ICONS (general) === */
.social_icons {
    display: flex !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 0 !important;
    margin-top: 24px !important;
}

.social_icons li {
    list-style: none !important;
}

.social_icons li a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.1) !important;
    color: rgba(255,255,255,0.8) !important;
    font-size: 16px !important;
    transition: var(--transition) !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
}

.social_icons li a:hover {
    background: var(--primary-light) !important;
    color: #fff !important;
    border-color: var(--primary-light) !important;
    transform: translateY(-2px);
}

/* Footer social icons override */
footer .footer-social {
    display: flex !important;
    gap: 10px !important;
    margin-top: 16px !important;
}

footer .footer-social a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.08) !important;
    color: rgba(255,255,255,0.7) !important;
    font-size: 14px !important;
    transition: var(--transition) !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
}

footer .footer-social a:hover {
    background: var(--primary-light) !important;
    color: #fff !important;
    border-color: var(--primary-light) !important;
}

/* === LIGHT BG FIX - Remove old background image === */
.light-bg {
    background: var(--bg-light) !important;
}

#content.light-bg {
    background: var(--bg-light) !important;
}

/* === SUB BANNER - see global page spacing section below === */

/* === FOOTER REDESIGN === */
footer {
    background: var(--text-dark) !important;
    padding: 60px 0 30px !important;
    color: rgba(255,255,255,0.8) !important;
}

footer h6 {
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    margin-bottom: 20px !important;
}

footer .link li {
    margin-bottom: 8px !important;
}

footer .link li a {
    color: rgba(255,255,255,0.7) !important;
    font-size: 14px !important;
    transition: var(--transition) !important;
}

footer .link li a:hover {
    color: var(--primary-light) !important;
    padding-left: 4px;
}

footer .about-footer p {
    color: rgba(255,255,255,0.7) !important;
    font-size: 14px !important;
    margin-bottom: 8px !important;
}

footer .about-footer img {
    margin-bottom: 20px !important;
    max-height: 40px !important;
    filter: brightness(0) invert(1);
    opacity: 0.9;
}

footer .rights {
    border-top: 1px solid rgba(255,255,255,0.1) !important;
    margin-top: 40px !important;
    padding-top: 20px !important;
}

footer .rights p {
    color: rgba(255,255,255,0.5) !important;
    font-size: 13px !important;
}

/* === CARDS (Booking, Checkout, etc.) === */
.card {
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-md) !important;
    box-shadow: var(--shadow-sm) !important;
    overflow: hidden;
}

.card-header {
    border-bottom: 1px solid var(--border) !important;
    padding: 16px 20px !important;
    font-weight: 600 !important;
}

.card-body {
    padding: 20px !important;
}

/* === FORMS === */
.form-control {
    border: 1.5px solid var(--border) !important;
    border-radius: var(--radius-sm) !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    transition: var(--transition) !important;
    background: var(--bg-white) !important;
}

.form-control:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(46, 125, 50, 0.1) !important;
    outline: none !important;
}

label {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--text-dark) !important;
    margin-bottom: 6px !important;
}

/* === ALERTS === */
.alert {
    border-radius: var(--radius-sm) !important;
    border: none !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
}

.alert-success {
    background: #e8f5e9 !important;
    color: var(--primary-dark) !important;
}

.alert-danger {
    background: #ffebee !important;
    color: #c62828 !important;
}

.alert-info {
    background: #e3f2fd !important;
    color: #1565c0 !important;
}

/* === TABLE === */
.table {
    border-radius: var(--radius-md) !important;
    overflow: hidden;
}

.table thead th {
    background: var(--bg-section) !important;
    border-bottom: 2px solid var(--border) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: var(--text-muted) !important;
    padding: 12px 16px !important;
}

.table td {
    padding: 14px 16px !important;
    vertical-align: middle !important;
    border-color: var(--border) !important;
}

/* === BOOKING PAGE === */
.booking-page .card {
    border: 1px solid var(--border) !important;
    transition: var(--transition);
}

.booking-page .card:hover {
    box-shadow: var(--shadow-md) !important;
    transform: translateY(-4px);
}

.booking-page .card-img-top {
    border-radius: var(--radius-md) var(--radius-md) 0 0 !important;
}

/* === PRODUCT DETAIL === */
.shop-detail {
    background: var(--bg-white);
    border-radius: var(--radius-lg);
    padding: 30px;
    box-shadow: var(--shadow-sm);
    margin-bottom: 40px;
}

.shop-detail .img-responsive {
    border-radius: var(--radius-md);
    max-height: 450px;
    object-fit: contain;
    width: 100%;
}

.shop-detail h3 {
    font-size: 24px !important;
    font-weight: 700 !important;
    margin-bottom: 16px !important;
}

.item-decribe {
    background: var(--bg-white);
    border-radius: var(--radius-lg);
    padding: 30px;
    box-shadow: var(--shadow-sm);
    margin-top: 30px;
}

.item-decribe .nav-tabs {
    border-bottom: 2px solid var(--border) !important;
}

.item-decribe .nav-tabs li a {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--text-muted) !important;
    border: none !important;
    padding: 12px 24px !important;
    border-radius: var(--radius-sm) var(--radius-sm) 0 0 !important;
}

.item-decribe .nav-tabs li.active a {
    color: var(--primary) !important;
    border-bottom: 3px solid var(--primary) !important;
    background: transparent !important;
}

/* === SHOP PAGE === */
.shop-page .col-md-3 {
    margin-bottom: 20px;
}

/* New product grid (used with filter sidebar layout) */
.papular-block.product-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
}

/* Legacy shop page grid (without sidebar) */
.shop-page .papular-block.row,
.shop-page .papular-block.row.teatmentrow {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.shop-page .papular-block.row .col-md-3,
.shop-page .papular-block.row.teatmentrow .col-md-3 {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    float: none !important;
    margin: 0 !important;
}

.shop-page .papular-block .item .item-img {
    height: 180px;
}

.shop-page .papular-block .item .item-name {
    padding: 8px 10px 4px !important;
}

.shop-page .papular-block .item .item-name a {
    font-size: 13px !important;
}

/* Results bar */
.shop-results-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding: 8px 0;
    border-bottom: 1px solid var(--border);
}

.shop-results-bar .results-count {
    font-size: 13px;
    color: var(--text-muted);
    font-weight: 500;
}

/* No results */
.no-results {
    text-align: center;
    padding: 60px 20px;
    grid-column: 1 / -1;
}

.no-results h5 {
    color: var(--text-dark);
    margin-bottom: 8px;
}

.no-results p {
    color: var(--text-muted);
    font-size: 14px;
}

/* === FILTER SIDEBAR === */
.filter-sidebar {
    background: var(--bg-white);
    border-radius: var(--radius-md);
    padding: 20px;
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    position: sticky;
    top: 100px;
}

.filter-section {
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border);
}

.filter-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.filter-title {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--text-dark) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 12px !important;
}

.filter-select {
    font-size: 13px !important;
    padding: 8px 12px !important;
    border-radius: 6px !important;
    border: 1px solid var(--border) !important;
    background: var(--bg-section) !important;
    cursor: pointer;
}

.filter-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.filter-checkbox {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    cursor: pointer;
    font-size: 13px !important;
    color: var(--text-body) !important;
    margin: 0 !important;
    padding: 4px 0 !important;
    font-weight: 400 !important;
}

.filter-checkbox input[type="checkbox"],
.filter-checkbox input[type="radio"] {
    width: 16px;
    height: 16px;
    accent-color: var(--primary);
    cursor: pointer;
    flex-shrink: 0;
}

.filter-label {
    flex: 1;
    font-size: 13px !important;
    color: var(--text-body) !important;
}

.filter-count {
    font-size: 11px;
    color: var(--text-muted);
}

/* Price range inputs */
.price-range-inputs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.price-input {
    width: 80px !important;
    padding: 6px 8px !important;
    font-size: 12px !important;
    text-align: center;
}

.price-separator {
    color: var(--text-muted);
    font-size: 12px;
}

.btn-apply-price {
    background: var(--bg-section) !important;
    color: var(--text-dark) !important;
    border: 1px solid var(--border) !important;
    font-size: 11px !important;
    padding: 5px 14px !important;
    width: 100%;
}

.btn-apply-price:hover {
    background: var(--primary) !important;
    color: #fff !important;
    border-color: var(--primary) !important;
}

.btn-clear-filters {
    background: transparent !important;
    color: #c62828 !important;
    border: 1px solid #ffcdd2 !important;
    font-size: 12px !important;
    padding: 6px 14px !important;
    width: 100%;
    text-align: center;
}

.btn-clear-filters:hover {
    background: #ffebee !important;
}

/* Rating filter stars */
.rating-filter .filter-label i {
    margin-right: 1px;
}

@media (min-width: 768px) and (max-width: 991px) {
    .shop-page .papular-block.row,
    .shop-page .papular-block.row.teatmentrow {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .papular-block.product-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 767px) {
    .shop-page .papular-block.row,
    .shop-page .papular-block.row.teatmentrow {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }

    .papular-block.product-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }

    .shop-page .papular-block .item .item-img {
        height: 140px;
    }

    .shop-page .papular-block .item .item-name a {
        font-size: 12px !important;
    }

    .product-action-section .price {
        font-size: 14px !important;
    }

    .product-action-section .btn {
        padding: 5px 10px !important;
        font-size: 10px !important;
    }

    /* Filter sidebar mobile */
    .filter-sidebar {
        position: static;
        margin-bottom: 20px;
    }
}

.product-short-desc,
.treatment-short-desc {
    font-size: 12px !important;
    color: var(--text-muted) !important;
    line-height: 1.4 !important;
    margin-top: 4px !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.btn-see-more {
    font-size: 11px !important;
    color: var(--primary) !important;
    font-weight: 600 !important;
}

/* === USER SIDEBAR === */
.user-sidebar .card {
    border-radius: var(--radius-md) !important;
    border: 1px solid var(--border) !important;
}

.user-sidebar .sidebar-title {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--text-dark) !important;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 12px;
}

.user-menu li a {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 10px 12px !important;
    border-radius: var(--radius-sm) !important;
    color: var(--text-body) !important;
    font-size: 14px !important;
    transition: var(--transition) !important;
}

.user-menu li a:hover,
.user-menu li.active a {
    background: var(--bg-section) !important;
    color: var(--primary) !important;
}

/* === MOBILE RESPONSIVE === */
@media (max-width: 767px) {
    .home-slider.simple-head {
        min-height: 350px !important;
        padding-top: 0 !important;
    }

    .home-slider .extra-huge-text {
        font-size: 32px !important;
        line-height: 1.2 !important;
    }

    .home-slider h4 {
        font-size: 16px !important;
    }

    .heading h4 {
        font-size: 24px !important;
    }

    .heading span {
        width: 90% !important;
        font-size: 14px !important;
    }

    .special-offers .extra-huge-text {
        font-size: 28px !important;
    }

    /* Product grid: 1 column on mobile */
    .papular-block.block-slide {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .papular-block .item {
        margin-bottom: 0 !important;
    }

    .papular-block .item .item-img {
        height: 180px;
    }

    .shop-detail {
        padding: 16px;
    }

    .sub-bnr {
        padding: 22px 0 18px !important;
    }

    .sub-bnr h4 {
        font-size: 18px !important;
    }

    .sub-bnr::after {
        width: 100px !important;
        height: 100px !important;
        right: -10px !important;
    }

    header .navbar li a {
        font-size: 14px !important;
        margin: 0 8px !important;
    }

    footer {
        padding: 40px 0 20px !important;
    }

    .new-arrival-list li article img {
        height: 200px;
    }

    .container {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    /* Shop page: 2 columns on mobile */
    .shop-page .papular-block.row {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }

    .shop-page .papular-block.row .col-md-3 {
        width: 100% !important;
        padding: 0 !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .home-slider .extra-huge-text {
        font-size: 42px !important;
    }

    .special-offers .extra-huge-text {
        font-size: 36px !important;
    }

    .heading h4 {
        font-size: 28px !important;
    }

    /* Product grid: 2 columns on tablet */
    .papular-block.block-slide {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }

    .papular-block .item .item-img {
        height: 180px;
    }
}

/* === DROPDOWN MENU === */
.dropdown-menu {
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-sm) !important;
    box-shadow: var(--shadow-md) !important;
    padding: 8px !important;
}

.dropdown-menu li a {
    border-radius: 6px !important;
    padding: 8px 14px !important;
    font-size: 13px !important;
    transition: var(--transition) !important;
}

.dropdown-menu li a:hover {
    background: var(--bg-section) !important;
    color: var(--primary) !important;
}

/* === BADGE === */
.badge {
    border-radius: 20px !important;
    padding: 4px 10px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

.badge-success {
    background: #e8f5e9 !important;
    color: var(--primary-dark) !important;
}

.badge-danger {
    background: #ffebee !important;
    color: #c62828 !important;
}

.badge-info {
    background: #e3f2fd !important;
    color: #1565c0 !important;
}

/* === PAGINATION === */
.pagination .page-link {
    border-radius: var(--radius-sm) !important;
    border: 1px solid var(--border) !important;
    color: var(--text-body) !important;
    margin: 0 3px !important;
    padding: 8px 14px !important;
    font-size: 14px !important;
}

.pagination .page-item.active .page-link {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

/* === OVERLAY FIX === */
.papular-block .item .overlay {
    background: rgba(46, 125, 50, 0.85) !important;
    border-radius: 0 !important;
}

.papular-block .item .overlay .btn {
    background: #fff !important;
    color: var(--primary-dark) !important;
}

/* === LOADER OVERRIDE === */
#loader {
    background: var(--bg-white) !important;
}

#loader .ldr {
    border-color: var(--border) !important;
    border-top-color: var(--primary) !important;
}

/* === SMOOTH SCROLL === */
html {
    scroll-behavior: smooth;
}

/* === SELECTION COLOR === */
::selection {
    background: rgba(46, 125, 50, 0.15);
    color: var(--primary-dark);
}

/* === CULTURE BLOCK FIX (About page) === */
.cultur-block {
    position: relative !important;
    overflow: hidden !important;
}

.cultur-block .position-center-center {
    z-index: 2 !important;
}

.cultur-block h4 {
    color: #fff !important;
    text-shadow: 0 2px 8px rgba(0,0,0,0.4) !important;
}

.cultur-block p {
    color: rgba(255,255,255,0.9) !important;
    text-shadow: 0 1px 4px rgba(0,0,0,0.3) !important;
}

.cultur-block::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(0,0,0,0.45) !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

.cultur-block ul {
    position: relative !important;
    z-index: 0 !important;
}

/* === ABOUT PAGE GRID FIX === */
.about-cards-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
    margin-top: 40px !important;
}

.about-card {
    background: var(--bg-white);
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border);
    transition: var(--transition);
}

.about-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-lg);
}

.about-card-img {
    position: relative;
    height: 220px;
    overflow: hidden;
}

.about-card-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.4s ease;
}

.about-card:hover .about-card-img img {
    transform: scale(1.05);
}

.about-card-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(46, 125, 50, 0.88);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.about-card:hover .about-card-overlay {
    opacity: 1;
}

.about-card-overlay p {
    color: rgba(255,255,255,0.9) !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    text-align: center;
    margin-bottom: 14px !important;
}

.btn-read-more {
    display: inline-block !important;
    background: #fff !important;
    color: var(--primary-dark) !important;
    padding: 10px 28px !important;
    border-radius: 25px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: var(--transition) !important;
    letter-spacing: 0.3px;
}

.btn-read-more:hover {
    background: var(--accent) !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

.about-card-title {
    padding: 12px 16px !important;
    text-align: center;
}

.about-card-title a {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--text-dark) !important;
    text-transform: capitalize !important;
    text-decoration: none !important;
}

.about-card-title a:hover {
    color: var(--primary) !important;
}

/* History block spacing */
.history-block {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}

.history-block h4 {
    margin-bottom: 16px !important;
    margin-top: 0 !important;
}

.history-block .vision-text {
    margin-top: 40px !important;
    margin-bottom: 0 !important;
}

.history-block .vision-text h5 {
    margin-bottom: 10px !important;
    text-transform: capitalize !important;
}

.history-block .vision-text h2 {
    text-transform: capitalize !important;
    line-height: 1.3 !important;
}

/* Legacy about page grid (fallback) */
.history-block .papular-block.row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.history-block .papular-block.row .col-md-4 {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    float: none !important;
    margin: 0 !important;
}

.history-block .papular-block .item {
    height: 100%;
}

.history-block .papular-block .item .item-img {
    height: 220px !important;
}

@media (max-width: 767px) {
    .about-cards-grid {
        grid-template-columns: 1fr !important;
    }

    .history-block .papular-block.row {
        grid-template-columns: 1fr !important;
    }
    
    .cultur-block li {
        width: 50% !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .about-cards-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .history-block .papular-block.row {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* === WHITE TEXT SECTIONS (override global dark text for overlay sections) === */
.sub-bnr h4,
.home-slider h4,
.home-slider h1,
.special-offers h1,
.new-arrival-list li article h4,
.new-arrival-list li article h4 a {
    color: #fff !important;
}

/* === STICKY HEADER === */
header {
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
    width: 100% !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

header .sticky {
    position: relative !important;
}

/* Remove gap between header and slider/content */
header + main,
header + section,
#wrap > main,
.home-slider.simple-head {
    margin-top: 0 !important;
}

#wrap {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* === GLOBAL PAGE SPACING FIX === */
/* Modern sub-banner with reduced height, texture & leaf decoration */
.sub-bnr {
    background: linear-gradient(135deg, #1a3a2a 0%, #2e5a3e 50%, #1b5e20 100%) !important;
    padding: 30px 0 24px !important;
    min-height: auto !important;
    margin-top: 0 !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Subtle texture overlay */
.sub-bnr::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: 
        radial-gradient(ellipse at 80% 20%, rgba(76, 175, 80, 0.15) 0%, transparent 50%),
        radial-gradient(ellipse at 20% 80%, rgba(139, 195, 74, 0.1) 0%, transparent 50%),
        url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

/* Decorative leaf SVG - right side */
.sub-bnr::after {
    content: '' !important;
    position: absolute !important;
    right: -20px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 180px !important;
    height: 180px !important;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' fill='none'%3E%3Cpath d='M100 20c-30 20-60 50-70 90 10-20 30-40 50-50-10 30-5 60 10 80 5-25 15-45 30-60-5 25 0 50 15 70 10-20 20-45 20-70 15 15 25 35 30 55 0-30-5-60-20-85 20 10 35 25 45 45-5-30-20-55-40-75 15 5 30 15 40 30-10-25-30-45-55-55 10 0 25 5 35 15-15-20-35-30-60-35-5 0-15 5-30 10z' fill='rgba(255,255,255,0.04)'/%3E%3C/svg%3E") no-repeat center / contain !important;
    z-index: 0 !important;
    pointer-events: none !important;
    opacity: 0.8 !important;
}

.sub-bnr .position-center-center {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    z-index: 1 !important;
}

.sub-bnr .container {
    position: relative !important;
    z-index: 1 !important;
}

.sub-bnr h4 {
    color: #fff !important;
    font-size: 22px !important;
    text-transform: none !important;
    letter-spacing: -0.01em !important;
    margin-bottom: 4px !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.2) !important;
}

.sub-bnr p {
    color: rgba(255,255,255,0.75) !important;
    margin-bottom: 2px !important;
    font-size: 14px !important;
}

.sub-bnr .breadcrumb {
    background: none !important;
    padding: 0 !important;
    margin-top: 6px !important;
    margin-bottom: 0 !important;
}

.sub-bnr .breadcrumb li,
.sub-bnr .breadcrumb li a {
    color: rgba(255,255,255,0.6) !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

.sub-bnr .breadcrumb li a:hover {
    color: rgba(255,255,255,0.9) !important;
}

.sub-bnr .breadcrumb li.active {
    color: rgba(255,255,255,0.85) !important;
}

.sub-bnr .breadcrumb > li + li::before {
    color: rgba(255,255,255,0.4) !important;
}

/* Reduce spacing between sub-banner and content */
.sub-bnr + #content,
#content.light-bg {
    padding-top: 0 !important;
}
.shop-page.padding-top-100 {
    padding-top: 40px !important;
}

section.padding-top-100 {
    padding-top: 50px !important;
}

section.padding-bottom-100 {
    padding-bottom: 50px !important;
}

/* === PRODUCT PAGE GRID FIX === */
/* Fix empty item-display div causing offset */
.shop-page .item-display {
    display: none !important;
}

/* Ensure product grid fills full width with no offset */
.shop-page .papular-block.row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* === FOOTER SOCIAL ICON PERFECT CENTERING === */
footer .footer-social a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.08) !important;
    color: rgba(255,255,255,0.7) !important;
    font-size: 14px !important;
    transition: var(--transition) !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    line-height: 1 !important;
    padding: 0 !important;
    text-decoration: none !important;
}

footer .footer-social a i {
    display: block !important;
    line-height: 1 !important;
    font-size: 14px !important;
}

footer .footer-social a:hover {
    background: var(--primary-light) !important;
    color: #fff !important;
    border-color: var(--primary-light) !important;
    transform: translateY(-2px);
}

/* Top bar icon perfect centering */
.header_top .pull-right ul li a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    border: 1px solid rgba(255,255,255,0.5) !important;
    border-radius: 50% !important;
    padding: 0 !important;
    line-height: 1 !important;
    text-align: center !important;
}

.header_top .pull-right ul li a i {
    display: block !important;
    font-size: 11px !important;
    line-height: 1 !important;
}

/* ========================================
   ADMIN PANEL IMPROVEMENTS
   ======================================== */
.admin-page {
    font-family: var(--font-body) !important;
}

.admin-page .sidebar {
    background: #1a2332 !important;
    border-right: none !important;
}

.admin-page .sidebar-brand {
    padding: 20px !important;
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

.admin-page .sidebar-menu > li > a {
    padding: 11px 20px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: rgba(255,255,255,0.7) !important;
    border-radius: 8px !important;
    margin: 2px 10px !important;
    transition: var(--transition) !important;
}

.admin-page .sidebar-menu > li > a:hover,
.admin-page .sidebar-menu > li > a.active {
    background: rgba(46, 125, 50, 0.15) !important;
    color: #4caf50 !important;
}

.admin-page .sidebar-menu .submenu li a {
    padding: 8px 20px 8px 48px !important;
    font-size: 12px !important;
    color: rgba(255,255,255,0.6) !important;
}

.admin-page .sidebar-menu .submenu li a:hover,
.admin-page .sidebar-menu .submenu li a.active {
    color: #4caf50 !important;
}

.admin-page .header {
    background: #fff !important;
    border-bottom: 1px solid #e8ecf0 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
    padding: 12px 24px !important;
}

.admin-page .header h1 {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #1a2332 !important;
}

.admin-page .content-wrapper {
    background: #f5f7fa !important;
    padding: 24px !important;
}

.admin-page .card {
    border: 1px solid #e8ecf0 !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}

.admin-page .btn-primary {
    background: #2e7d32 !important;
}

.admin-page .btn-primary:hover {
    background: #1b5e20 !important;
}
