/* ============================================================
   ROY CRAFT ORGANICS — Mobile-First Responsive CSS
   Breakpoints: xs<576, sm<768, md<992, lg<1200
   ============================================================ */

/* ─── MOBILE BASE ─────────────────────────────────────────── */
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body.rco-body { font-size: 15px; overflow-x: hidden; }

/* ─── HEADER MOBILE ────────────────────────────────────────── */
@media (max-width: 767.98px) {

  /* Top bar — hide on mobile */
  .rco-topbar { display: none !important; }

  /* Header padding */
  .rco-header .navbar { padding: 8px 0 4px; }
  .rco-header .container-fluid { padding-left: 12px !important; padding-right: 12px !important; }

  /* Logo compact */
  .rco-logo { gap: 5px; }
  .logo-leaf { font-size: 1.3rem; }
  .logo-main { font-size: .95rem; }
  .logo-sub  { font-size: .55rem; letter-spacing: 1.5px; }

  /* Header icons */
  .rco-header-icons { gap: 10px !important; }
  .rco-icon-btn { font-size: .88rem; }
  .rco-icon-btn span { display: none !important; }
  .rco-badge { width: 16px; height: 16px; font-size: .58rem; top: -5px; right: -6px; }

  /* Mobile search bar */
  .rco-search-group .rco-search-cat { display: none; }
  .rco-search-input { font-size: .85rem; padding: .4rem .75rem; }
  .rco-search-btn   { padding: 0 12px; }

  /* Category bar — horizontal scroll */
  .rco-catbar { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .rco-catbar-list { flex-wrap: nowrap; white-space: nowrap; padding: 0 8px; }
  .rco-catbar-list li a { padding: 7px 12px; font-size: .78rem; }

  /* Mobile nav menu */
  #mobileMenu .navbar-nav { padding: 8px 0; }
  #mobileMenu .nav-link { padding: 10px 16px; font-size: .9rem; border-bottom: 1px solid rgba(255,255,255,.1); }

  /* User dropdown */
  .rco-user-dropdown { min-width: 190px; }
}

/* ─── HERO BANNER MOBILE ───────────────────────────────────── */
@media (max-width: 767.98px) {
  .rco-hero-slide { min-height: 220px; }
  .rco-hero h1 { font-size: 1.5rem !important; }
  .rco-hero p  { font-size: .85rem; }
  .rco-hero .btn { padding: .5rem 1.2rem; font-size: .85rem; }
  .carousel-control-prev, .carousel-control-next { width: 32px; }
  .carousel-indicators { bottom: 4px; }
  .carousel-indicators [data-bs-target] { width: 8px; height: 8px; }
}

/* ─── PRODUCT CARD MOBILE ──────────────────────────────────── */
@media (max-width: 575.98px) {
  .rco-product-card { border-radius: 10px; }
  .rco-product-body { padding: 8px 10px; }
  .rco-product-name { font-size: .82rem; }
  .rco-price-current { font-size: 1rem; }
  .rco-price-mrp     { font-size: .72rem; }
  .rco-price-save    { font-size: .68rem; }
  .rco-product-seller { font-size: .67rem; }
  .rco-product-rating { margin-bottom: 4px; }
  .rco-stars { font-size: .72rem; }
  .rco-rating-count { font-size: .68rem; }

  /* Product action buttons — stack */
  .rco-product-actions {
    grid-template-columns: 1fr 1fr;
    gap: 5px;
  }
  .rco-btn-cart, .rco-btn-buynow {
    font-size: .72rem;
    padding: 7px 3px;
    border-radius: 6px;
  }
  .rco-wishlist-btn { width: 30px; height: 30px; font-size: .8rem; top: 7px; right: 7px; }
  .rco-badge-discount, .rco-badge-organic, .rco-badge-new { font-size: .62rem; padding: 2px 6px; }
}

/* ─── PRODUCT DETAIL MOBILE ────────────────────────────────── */
@media (max-width: 767.98px) {
  /* Images stack on top */
  .rco-thumb { width: 52px !important; height: 52px !important; }

  /* Price section */
  .rco-form-card .d-flex.align-items-baseline { flex-wrap: wrap; gap: 6px !important; }

  /* Qty wrap */
  .rco-qty-wrap { width: 110px; }
  .rco-qty-btn  { width: 28px; height: 30px; }
  .rco-qty-input{ width: 38px; height: 30px; font-size: .85rem; }

  /* Action buttons */
  .rco-form-card .d-flex.gap-3.mb-3.flex-wrap .btn {
    flex: 1 1 calc(50% - 6px);
    min-width: 0;
    font-size: .82rem;
    padding: .6rem .5rem;
  }

  /* Product tabs */
  #pdpTabs .nav-link { font-size: .82rem; padding: .4rem .7rem; }
}

/* ─── CART PAGE MOBILE ─────────────────────────────────────── */
@media (max-width: 767.98px) {
  .rco-cart-img { width: 60px !important; height: 60px !important; }

  /* Cart row layout */
  .rco-cart-row .row { --bs-gutter-x: 0.5rem; }
  .rco-cart-row .fw-bold.small { font-size: .82rem; }

  /* Qty + remove inline */
  .rco-cart-row .rco-qty-wrap { margin: 4px 0; }

  /* Cart summary sticky */
  .rco-form-card.position-sticky { position: relative !important; }
}

/* ─── CHECKOUT MOBILE ──────────────────────────────────────── */
@media (max-width: 767.98px) {
  /* Address cards — full width */
  .rco-addr-radio { padding: 10px; }
  .rco-addr-radio .d-flex { gap: 8px; }

  /* Payment options */
  .rco-payment-opt { padding: 10px; font-size: .85rem; }
  .rco-payment-opt i { font-size: 1rem !important; }

  /* Step numbers */
  .rco-step-number { width: 22px; height: 22px; font-size: .72rem; }

  /* Summary card */
  .col-lg-4 .rco-form-card.position-sticky { position: relative !important; top: auto; }

  /* Place order button */
  #placeOrderBtn { font-size: .9rem; padding: .7rem; }
}

/* ─── ORDER TRACKING MOBILE ────────────────────────────────── */
@media (max-width: 575.98px) {
  /* Horizontal timeline → vertical on small screens */
  .rco-timeline { flex-direction: column; padding: 0; gap: 0; }
  .rco-timeline-step { display: flex; flex-direction: row; align-items: flex-start; gap: 12px; min-width: auto; text-align: left; padding-bottom: 16px; position: relative; }
  .rco-timeline-step .step-icon { margin: 0; flex-shrink: 0; width: 34px; height: 34px; font-size: .82rem; }
  .rco-timeline-step .step-label { font-size: .82rem; padding-top: 6px; }
  .rco-timeline-step::before { left: 17px; top: 34px; right: auto; bottom: 0; width: 2px; height: calc(100% - 34px); }
  .rco-timeline-step:last-child::before { display: none; }
}

/* ─── ACCOUNT PAGES MOBILE ─────────────────────────────────── */
@media (max-width: 767.98px) {
  /* Account sidebar — horizontal tabs on mobile */
  .rco-form-card .p-3.text-center[style*="background:var(--rco-green)"] { padding: 12px !important; }

  /* Address cards — full width */
  .col-md-6 .rco-form-card { margin-bottom: 12px; }

  /* Form fields */
  .rco-form-control { font-size: .9rem; padding: .45rem .8rem; }
  .rco-form-label   { font-size: .8rem; }
}

/* ─── MY ORDERS MOBILE ─────────────────────────────────────── */
@media (max-width: 575.98px) {
  .rco-form-card .d-flex.justify-content-between { flex-direction: column; gap: 8px; }
  .rco-form-card .d-flex.gap-2.flex-wrap .btn { font-size: .78rem; padding: .35rem .7rem; }

  /* Order status badge */
  .rco-status { font-size: .66rem; padding: 2px 8px; }
}

/* ─── OTP INPUT MOBILE ─────────────────────────────────────── */
@media (max-width: 399.98px) {
  .rco-otp-box { width: 38px !important; height: 44px !important; font-size: 1.1rem !important; }
}

/* ─── HOME PAGE MOBILE ─────────────────────────────────────── */
@media (max-width: 767.98px) {
  /* Section headings */
  .rco-section-head h2 { font-size: 1.25rem; }

  /* Category cards grid */
  .col-4.col-md-3.col-lg-2 .rco-cat-card { border-radius: 8px; }
  .rco-cat-card .rco-cat-label { font-size: .75rem; padding: 14px 8px 7px; }

  /* Trust badges row */
  .d-flex.align-items-center.gap-2.justify-content-center .fw-bold.small { font-size: .78rem; }

  /* Why choose us grid */
  .col-md-4.col-lg-2 .p-3 { padding: 10px 8px !important; }
  .col-md-4.col-lg-2 h6 { font-size: .82rem; }
}

/* ─── FORMS MOBILE ─────────────────────────────────────────── */
@media (max-width: 575.98px) {
  .rco-form-card { padding: 1.25rem 1rem; border-radius: 12px; }

  /* Login/Register page */
  .container.py-5 { padding-top: 2rem !important; padding-bottom: 2rem !important; }
  .col-md-5.col-lg-4 { padding: 0 8px; }
}

/* ─── WISHLIST MOBILE ──────────────────────────────────────── */
@media (max-width: 575.98px) {
  #wishlistGrid .col-md-4.col-6 { padding: 5px; }
}

/* ─── FOOTER MOBILE ────────────────────────────────────────── */
@media (max-width: 767.98px) {
  .rco-footer-top { padding: 2rem 0 1.5rem; }
  .rco-footer-top .container-fluid { padding: 0 16px; }
  .rco-footer-brand { margin-bottom: 8px; }
  .rco-footer-heading { font-size: .82rem; margin-bottom: 6px; }
  .rco-footer-links li a { font-size: .8rem; padding: 2px 0; }
  .rco-social-icons a { width: 32px; height: 32px; font-size: .85rem; }
  .rco-newsletter-group { max-width: 100%; }
  .rco-footer-bottom { font-size: .72rem; }
}

/* ─── ADMIN/SELLER PANEL MOBILE ────────────────────────────── */
@media (max-width: 991.98px) {
  /* Sidebar hidden by default */
  .rco-admin-sidebar { transform: translateX(-100%); box-shadow: none; }
  .rco-admin-sidebar.open { transform: translateX(0); box-shadow: 4px 0 20px rgba(0,0,0,.3); z-index: 1050; }
  .rco-admin-main { margin-left: 0 !important; }

  /* Topnav */
  .rco-admin-topnav { height: 52px; }
  .rco-admin-topnav .text-white-50.small { display: none; }

  /* Overlay when sidebar open */
  .sidebar-overlay {
    display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,.5); z-index: 1040;
  }
  .sidebar-overlay.active { display: block; }
}

/* Admin stat cards */
@media (max-width: 575.98px) {
  .rco-stat-card { padding: .9rem; gap: .75rem; }
  .rco-stat-icon { width: 44px; height: 44px; font-size: 1.1rem; }
  .rco-stat-val  { font-size: 1.2rem; }
  .rco-stat-lbl  { font-size: .7rem; }
}

/* Admin tables — horizontal scroll */
@media (max-width: 767.98px) {
  .rco-admin-card .table-responsive { -webkit-overflow-scrolling: touch; }
  .rco-table th, .rco-table td { padding: 8px 10px; font-size: .8rem; white-space: nowrap; }
  .rco-admin-content { padding: 12px !important; }
}

/* Category modal */
@media (max-width: 575.98px) {
  .modal-dialog { margin: 8px; }
  .modal-content { border-radius: 12px; }
  .modal-body { padding: 1rem; }
}

/* ─── STICKY BOTTOM BAR — Mobile Cart/Checkout ─────────────── */
@media (max-width: 767.98px) {
  /* Show sticky bottom action bar on product detail */
  .rco-sticky-bottom-bar {
    position: fixed; bottom: 0; left: 0; right: 0;
    background: #fff; padding: 10px 16px;
    box-shadow: 0 -3px 20px rgba(0,0,0,.12);
    z-index: 1000; display: flex; gap: 10px;
    border-top: 1px solid var(--rco-border);
  }
  .rco-sticky-bottom-bar .btn { flex: 1; padding: .65rem; font-size: .88rem; font-weight: 700; }
  /* Add padding so content not hidden behind bar */
  .rco-pdp-action-desktop { display: none !important; }
  .rco-pdp-bottom-space   { padding-bottom: 80px; }
}

@media (min-width: 768px) {
  .rco-sticky-bottom-bar { display: none !important; }
  .rco-pdp-action-desktop { display: flex !important; }
}

/* ─── MOBILE SEARCH SUGGESTIONS ────────────────────────────── */
@media (max-width: 767.98px) {
  .rco-search-dropdown { border-radius: 0 0 8px 8px; max-height: 280px; }
  .rco-search-item { padding: 8px 12px; gap: 8px; }
  .rco-search-item img { width: 36px; height: 36px; }
  .rco-search-item .name { font-size: .82rem; }
  .rco-search-item .price { font-size: .78rem; }
}

/* ─── FILTER SIDEBAR MOBILE ────────────────────────────────── */
@media (max-width: 767.98px) {
  .rco-filter-card {
    position: fixed; bottom: 0; left: 0; right: 0;
    border-radius: 16px 16px 0 0; max-height: 80vh;
    overflow-y: auto; transform: translateY(100%);
    transition: transform .3s ease; z-index: 1060;
    padding: 1.5rem 1rem 2rem;
  }
  .rco-filter-card.open { transform: translateY(0); }
  .rco-filter-overlay {
    display: none; position: fixed; top:0; left:0; right:0; bottom:0;
    background: rgba(0,0,0,.5); z-index: 1055;
  }
  .rco-filter-overlay.active { display: block; }
  .rco-filter-toggle-btn {
    position: fixed; bottom: 16px; left: 50%; transform: translateX(-50%);
    z-index: 1050; border-radius: 25px; padding: .55rem 1.8rem;
    font-size: .88rem; font-weight: 700; background: var(--rco-green);
    color: #fff; border: none; box-shadow: 0 4px 16px rgba(45,106,79,.4);
    display: flex; align-items: center; gap: 8px;
  }
}

/* ─── SCROLLBAR ─────────────────────────────────────────────── */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: #f0f0f0; }
::-webkit-scrollbar-thumb { background: var(--rco-green-light); border-radius: 4px; }

/* ─── TOUCH TARGETS ─────────────────────────────────────────── */
@media (max-width: 767.98px) {
  /* Minimum 44px touch targets */
  .btn, .nav-link, .dropdown-item { min-height: 40px; }
  .form-check-input { width: 18px; height: 18px; }
  .form-check-label { padding-left: 4px; }

  /* Prevent zoom on input focus (iOS) */
  input, select, textarea { font-size: 16px !important; }
  .rco-otp-box { font-size: 1.4rem !important; }
}

/* ─── INVOICE PRINT ─────────────────────────────────────────── */
@media (max-width: 767.98px) {
  #invoicePrint .table-responsive { font-size: .78rem; }
  #invoicePrint .row.justify-content-end .col-md-4 { width: 100%; }
}

/* ─── UTILITY CLASSES ───────────────────────────────────────── */
.mobile-only  { display: none; }
.desktop-only { display: block; }

@media (max-width: 767.98px) {
  .mobile-only  { display: block; }
  .desktop-only { display: none; }
  .mobile-flex  { display: flex !important; }
  .mobile-full  { width: 100% !important; }
  .mobile-p0    { padding: 0 !important; }
  .mobile-mt2   { margin-top: .5rem !important; }
  .mobile-text-sm { font-size: .82rem !important; }
}

/* ─── CUSTOMER BOTTOM NAV ───────────────────────────────── */
.rco-bottom-nav {
  position: fixed; bottom: 0; left: 0; right: 0;
  background: #fff; z-index: 1030;
  display: flex; align-items: center;
  box-shadow: 0 -2px 16px rgba(0,0,0,.10);
  border-top: 1px solid var(--rco-border);
  padding: 0; height: 58px;
}
.rco-bottom-nav-item {
  flex: 1; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 2px; padding: 6px 4px;
  color: var(--rco-muted); text-decoration: none;
  font-size: .58rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: .3px; transition: color .15s;
  position: relative;
}
.rco-bottom-nav-item i { font-size: 1.15rem; line-height: 1; }
.rco-bottom-nav-item.active,
.rco-bottom-nav-item:hover { color: var(--rco-green); }
.rco-bottom-nav-item.active i { color: var(--rco-green); }
.rco-bottom-badge {
  position: absolute; top: 4px; left: 50%; transform: translateX(4px);
  background: var(--rco-red); color: #fff; font-size: .55rem;
  font-weight: 800; min-width: 16px; height: 16px; border-radius: 8px;
  display: none; align-items: center; justify-content: center;
  padding: 0 3px; line-height: 1;
}
.rco-bottom-badge.visible { display: flex; }

/* Add bottom padding to main content on mobile so bottom nav doesn't cover */
@media (max-width: 767.98px) {
  .rco-main { padding-bottom: 66px; }
  .rco-footer { margin-bottom: 58px; }
}

/* ─── MOBILE HEADER IMPROVEMENTS ───────────────────────── */
@media (max-width: 767.98px) {
  /* Category bar pill style */
  .rco-catbar { padding: 0 !important; }
  .rco-catbar-list { padding: 4px 8px; gap: 4px; }
  .rco-catbar-list li a {
    padding: 5px 12px; border-radius: 20px;
    background: rgba(255,255,255,.12);
    font-size: .73rem;
  }
  .rco-catbar-list li a:hover { background: rgba(255,255,255,.25); }

  /* Tighter header on scroll */
  .rco-header.scrolled .rco-catbar { display: none; }
}

/* ─── MOBILE PRODUCT GRID ───────────────────────────────── */
@media (max-width: 399.98px) {
  /* Extra small phones — 2 column grid tighter */
  .col-6 { padding-left: 5px; padding-right: 5px; }
  .row.g-3 { --bs-gutter-x: 10px; --bs-gutter-y: 10px; }
}

/* ─── MOBILE CART PAGE ──────────────────────────────────── */
@media (max-width: 575.98px) {
  .rco-cart-img { width: 56px !important; height: 56px !important; border-radius: 8px !important; }
  .rco-cart-row .col-9.col-md-10 { padding-left: 8px; }
  .rco-cart-row .fw-bold.small { font-size: .8rem; }
  /* Summary card */
  .col-lg-4 .rco-form-card { margin-top: 0; border-radius: 12px; }
}

/* ─── MOBILE CHECKOUT ───────────────────────────────────── */
@media (max-width: 575.98px) {
  /* Address radio cards */
  .rco-addr-radio { padding: 10px 8px; border-radius: 8px; }
  .rco-addr-radio .d-flex { gap: 6px; }
  /* Payment options */
  .col-md-6 .rco-payment-opt { padding: 9px 10px; border-radius: 8px; }
  .rco-payment-opt div.d-inline-block .fw-bold.small { font-size: .78rem; }
  .rco-payment-opt div.d-inline-block div[style*="font-size:.72rem"] { display: none; }
  /* Order items in checkout */
  .checkout-item-img { width: 44px !important; height: 44px !important; }
}

/* ─── MOBILE ORDER CONFIRMATION ─────────────────────────── */
@media (max-width: 575.98px) {
  .col-lg-7 .rco-form-card { padding: 1.2rem !important; }
  .display-1.fw-bold { font-size: 3rem !important; }
  /* Timeline horizontal → smaller */
  .rco-timeline { overflow-x: auto; padding-bottom: 8px; }
  .rco-timeline-step { min-width: 72px; }
  .rco-timeline-step .step-icon { width: 32px; height: 32px; font-size: .72rem; }
  .rco-timeline-step .step-label { font-size: .62rem; }
}

/* ─── MOBILE MY ORDERS ──────────────────────────────────── */
@media (max-width: 575.98px) {
  /* Order status tabs — horizontal scroll */
  .nav.nav-pills.mb-3 { overflow-x: auto; flex-wrap: nowrap !important; padding-bottom: 4px; -webkit-overflow-scrolling: touch; }
  .nav.nav-pills .nav-link { white-space: nowrap; padding: .3rem .75rem; font-size: .78rem; border-radius: 20px; }
  /* Order cards */
  .rco-form-card.mb-3 .d-flex.gap-3 img { width: 52px !important; height: 52px !important; }
}

/* ─── MOBILE ACCOUNT SIDEBAR → HORIZONTAL TABS ──────────── */
@media (max-width: 767.98px) {
  /* Hide sidebar, show horizontal scroll tabs */
  .col-md-3 .rco-form-card.p-0 { display: none !important; }
  .rco-account-tabs-mobile {
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    display: flex; gap: 8px; padding: 0 0 10px;
    scrollbar-width: none; flex-wrap: nowrap;
  }
  .rco-account-tabs-mobile::-webkit-scrollbar { display: none; }
  .rco-account-tabs-mobile a {
    white-space: nowrap; padding: 7px 16px; border-radius: 20px;
    background: #fff; border: 1.5px solid var(--rco-border);
    font-size: .8rem; font-weight: 600; color: var(--rco-text);
    text-decoration: none; flex-shrink: 0; transition: all .15s;
  }
  .rco-account-tabs-mobile a.active,
  .rco-account-tabs-mobile a:hover {
    background: var(--rco-green); color: #fff; border-color: var(--rco-green);
  }
  .col-md-9 { width: 100% !important; }
}

/* ─── MOBILE WISHLIST ───────────────────────────────────── */
@media (max-width: 575.98px) {
  #wishlistGrid .rco-product-card { border-radius: 10px; }
}

/* ─── MOBILE HERO TRUST BADGES ──────────────────────────── */
@media (max-width: 575.98px) {
  .rco-trust-badges .col-6 { padding: 4px; }
  .rco-trust-badges .fw-bold.small { font-size: .72rem; }
  .rco-trust-badges .fa-lg { font-size: 1rem !important; }
}

/* ─── FORM STEP NUMBERS ─────────────────────────────────── */
@media (max-width: 575.98px) {
  .rco-step-number { width: 20px; height: 20px; font-size: .68rem; margin-right: 5px; }
}

/* ─── OTP PAGE ──────────────────────────────────────────── */
@media (max-width: 399.98px) {
  .rco-otp-box { width: 36px !important; height: 42px !important; font-size: 1.2rem !important; border-radius: 8px !important; }
  .d-flex.justify-content-center.gap-2 { gap: 4px !important; }
}

/* ─── SELLER/ADMIN FORMS MOBILE ─────────────────────────── */
@media (max-width: 575.98px) {
  .rco-admin-card.p-3 .row.g-3 .col-md-3,
  .rco-admin-card.p-3 .row.g-3 .col-md-4,
  .rco-admin-card.p-3 .row.g-3 .col-md-6 { width: 100%; }
}

/* ─── ABOUT/CONTACT PAGES ───────────────────────────────── */
@media (max-width: 767.98px) {
  .display-5 { font-size: 1.6rem !important; }
  .lead { font-size: 1rem; }
}

/* ─── INVOICE PRINT ─────────────────────────────────────── */
@media print {
  .rco-bottom-nav,
  .rco-admin-bottom-nav,
  .rco-seller-bottom-nav,
  .rco-header, .rco-footer,
  .rco-topbar, nav.navbar,
  .btn, #stickyBottomBar { display: none !important; }
  .rco-main { padding-bottom: 0 !important; }
}

/* ─── SMOOTH TRANSITIONS ────────────────────────────────── */
.rco-product-card,
.rco-form-card,
.rco-admin-card { transition: box-shadow .2s ease; }