/* ============================================================
   DARK CYAN TECH THEME - Mobile Override v5
   For style_en.css / Bootstrap based mobile templates
   Accent: Cyan #22d3ee | Background: #000212
   Uses CSS variables from dark-blue-theme.css :root

   v5 Changes:
   - GPU-accelerated animations & rendering hints
   - Unified premium design system (8px grid, consistent radii)
   - Glassmorphism header & drawer
   - Enhanced button press effects & touch feedback
   - Fixed bottom buy bar on product pages
   - Better typography hierarchy
   - Smoother micro-interactions
   ============================================================ */

/* === BASE PERFORMANCE & RESET === */
html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  -webkit-tap-highlight-color:transparent;
}
html,body{
  background:var(--rk-bg-deep) !important;
  color:var(--rk-text) !important;
  font-family:'Inter','Helvetica Neue',Arial,sans-serif !important;
  overflow-x:hidden !important;
  overscroll-behavior-x:none !important;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
a{color:var(--rk-cyan)}
a:hover{color:var(--rk-cyan-light);text-decoration:none}
::selection{background:var(--rk-cyan-deep);color:#fff}

/* === MOBILE HEADER — Glassmorphism === */
.logo-box{background:var(--rk-bg-deep) !important}
#header,.head_top{background:var(--rk-bg-deep) !important;border-bottom:1px solid rgba(34,211,238,.08)}
.loginbar a,.loginbar span,.loginbar i{color:var(--rk-text-secondary) !important}
.loginbar a:hover{color:var(--rk-cyan) !important}
.cart-bar,.cart-bar a,.cart-bar li{color:var(--rk-text-secondary) !important}
.cart-bar a:hover{color:var(--rk-cyan) !important}
.head_bot{background:var(--rk-bg-deep) !important}
#search,.input-group{background:transparent !important}
#search .form-control{
  background:var(--rk-surface) !important;
  border:1.5px solid rgba(34,211,238,.15) !important;
  color:var(--rk-text) !important;
  border-radius:999px !important;
  height:42px;
  font-size:14px;
  transition:border-color .2s,box-shadow .2s;
}
#search .form-control:focus{
  border-color:rgba(34,211,238,.4) !important;
  box-shadow:0 0 0 3px rgba(34,211,238,.08) !important;
}
#search .form-control::placeholder{color:var(--rk-text-muted) !important}
#search .btn-header-search{
  background:linear-gradient(135deg,var(--rk-cyan-deep),var(--rk-cyan)) !important;
  color:var(--rk-bg-deep) !important;
  border:none !important;
  border-radius:0 999px 999px 0 !important;
  font-weight:700;
  box-shadow:0 2px 10px rgba(34,211,238,.15);
}
#search .img-search-btn{color:var(--rk-text-secondary) !important;background:transparent !important;border:none !important}
.mnav-home a,.Teams a{color:var(--rk-text-secondary) !important}
.mnav-home a:hover,.Teams a:hover{color:var(--rk-cyan) !important}
.fa-home,.fa-bars{color:var(--rk-cyan) !important}

/* === DRAWER NAVIGATION — Premium slide panel === */
.drawer,.drawer-nav{
  background:rgba(3,9,24,.97) !important;
  backdrop-filter:blur(20px) !important;
  -webkit-backdrop-filter:blur(20px) !important;
}
.drawer-menu,.drawer-menu a{color:var(--rk-text) !important}
.drawer-menu a:hover{color:var(--rk-cyan) !important;background:rgba(34,211,238,.06) !important}
.drawer-dropdown{background:var(--rk-bg) !important;border-color:var(--rk-border) !important}
.left-user-icon a,.left-user-box a{color:var(--rk-text-secondary) !important}
.left-user-icon a:hover,.left-user-box a:hover{color:var(--rk-cyan) !important}
.drawer-hamburger-icons img{filter:brightness(0) invert(1)}

/* === GENERAL CONTENT === */
.container,.container-fluid,.row{background:transparent !important}

/* === PRODUCT CARDS — Unified card system === */
.products_name{color:var(--rk-text) !important}
.products_price{color:#fff !important;font-weight:700 !important}
.products-grid .product-title{height:auto !important;margin-bottom:6px !important}
.market_price{color:var(--rk-text-muted) !important}
.normal_price{color:#fff !important}

/* Mobile homepage product grid */
.web-divbox-gird,.fan-divbox-gird{background:transparent !important}
.web-gird-item-box,.fan-gird-item-box{
  background:var(--rk-surface) !important;
  border:1px solid var(--rk-border) !important;
  border-radius:14px !important;
  overflow:hidden;
  transition:transform .2s ease,box-shadow .2s ease;
}
.web-gird-item-box:active,.fan-gird-item-box:active{
  transform:scale(.98);
}
.web-gird-item-text,.fan-gird-item-text{
  background:var(--rk-surface) !important;
  padding:10px 12px !important;
}
.web-gird-item-text .products_name a,.fan-gird-item-text .products_name a{
  color:var(--rk-text) !important;
  font-family:'Inter',sans-serif !important;
  font-size:13px;
  line-height:1.4;
}
.web-gird-item-text .products_price,.fan-gird-item-text .products_price{color:#fff !important;font-weight:700 !important}
.web-gird-item-text .market_price,.fan-gird-item-text .market_price{color:var(--rk-text-muted) !important}

/* === CATEGORY PAGE (mobile) === */
.article-hero{
  background:linear-gradient(135deg,var(--rk-bg) 0%,#081626 100%) !important;
  border:none !important;
}
.article-hero .testh2{color:var(--rk-text) !important}
.filter-option{
  background:var(--rk-surface) !important;
  color:var(--rk-text-secondary) !important;
  border:1px solid var(--rk-border-light) !important;
  border-radius:999px !important;
  font-family:'Inter',sans-serif !important;
  font-weight:600 !important;
  transition:all .2s !important;
}
.filter-option.active{
  background:linear-gradient(135deg,var(--rk-cyan-deep),var(--rk-cyan)) !important;
  color:var(--rk-bg-deep) !important;
  border-color:transparent !important;
  font-weight:700 !important;
  box-shadow:0 2px 10px rgba(34,211,238,.2) !important;
}
.filter-option:active{transform:scale(.95)}
.filter-option::before{display:none !important}

/* === SORT BAR (mobile) === */
.sort-bar{
  background:var(--rk-bg-deep) !important;
  border-bottom:none !important;
  box-shadow:0 8px 16px -4px rgba(0,0,0,.6) !important;
}
.sort-bar .sort-label{color:var(--rk-text-muted) !important}
.sort-bar .sort-tab{
  border:1px solid var(--rk-border-light) !important;
  color:var(--rk-text-secondary) !important;
  border-radius:999px !important;
  font-family:'Inter',sans-serif !important;
  font-weight:600 !important;
  transition:all .2s !important;
}
.sort-bar .sort-tab.active{
  background:linear-gradient(135deg,var(--rk-cyan-deep),var(--rk-cyan)) !important;
  color:var(--rk-bg-deep) !important;
  border-color:transparent !important;
  font-weight:700 !important;
  box-shadow:0 2px 10px rgba(34,211,238,.2) !important;
}
.sort-bar .sort-tab:active{transform:scale(.95)}
.sort-bar .filter-toggle-btn{
  border:1px solid rgba(34,211,238,.3) !important;
  background:rgba(34,211,238,.06) !important;
  color:var(--rk-cyan-light) !important;
  border-radius:999px !important;
  font-weight:600 !important;
}
.sort-bar .filter-toggle-btn:active{background:rgba(34,211,238,.12) !important}

/* === PRODUCT CARDS (mobile category) === */
.products-grid .product-card{
  background:var(--rk-surface) !important;
  border:1px solid var(--rk-border) !important;
  border-radius:14px !important;
  contain:layout style;
  transition:transform .2s ease,box-shadow .2s ease;
}
.products-grid .product-card:active{
  transform:scale(.97);
}
.products-grid .product-info{background:var(--rk-surface) !important}
.products-grid .product-title{color:var(--rk-text) !important;font-family:'Inter',sans-serif !important}
.products-grid .product-stats .price,.product-stats .price{color:#fff !important;font-weight:700 !important}
.products-grid .product-stats del{color:var(--rk-text-muted) !important}
.products-grid .product-image{
  background:var(--rk-border) !important;
  contain:layout;
}

/* === ACTION BUTTONS — Premium touch feedback === */
.action-btn{
  border:1.5px solid var(--rk-border-light) !important;
  color:var(--rk-text-secondary) !important;
  background:transparent !important;
  border-radius:12px !important;
  font-family:'Inter',sans-serif !important;
  font-weight:600 !important;
  font-size:13px !important;
  padding:10px 18px !important;
  transition:all .15s ease !important;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  min-height:44px;
  display:inline-flex !important;align-items:center;justify-content:center;gap:6px;
}
.action-btn:active{
  background:rgba(34,211,238,.06) !important;
  transform:scale(.96) !important;
  border-color:var(--rk-cyan-deep) !important;
}

/* Primary CTA buttons */
.buyNowBtn,.pro_buyNowBtn{
  background:linear-gradient(135deg,var(--rk-cyan-deep),var(--rk-cyan)) !important;
  color:var(--rk-bg-deep) !important;
  border-color:transparent !important;
  font-weight:700 !important;
  font-size:14px !important;
  padding:12px 24px !important;
  min-height:48px;
  box-shadow:0 4px 18px rgba(34,211,238,.25) !important;
  letter-spacing:.03em;
  border-radius:12px !important;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.buyNowBtn:active,.pro_buyNowBtn:active{
  transform:scale(.96) !important;
  filter:brightness(.92) !important;
  box-shadow:0 2px 8px rgba(34,211,238,.15) !important;
}

.prolistli a,.prolistli .action-btn{
  background:var(--rk-surface) !important;
  color:var(--rk-cyan-light) !important;
  border:1.5px solid var(--rk-border-light) !important;
  font-weight:600 !important;
  font-size:13px !important;
  border-radius:12px !important;
}
.prolistli a:active,.prolistli .action-btn:active{
  background:rgba(34,211,238,.1) !important;
  color:var(--rk-cyan) !important;
  transform:scale(.96);
}

/* === FILTER SIDEBAR (mobile drawer) === */
.filter-sidebar{
  background:rgba(3,9,24,.97) !important;
  backdrop-filter:blur(20px) !important;
  -webkit-backdrop-filter:blur(20px) !important;
  box-shadow:-4px 0 24px rgba(0,0,0,.6) !important;
}
.filter-close-btn{color:#ccc !important}
.filter-overlay{background:rgba(0,2,18,.6) !important}
.filter-title{color:var(--rk-text) !important;border-bottom:1px solid var(--rk-border) !important}
.filter-title i{color:var(--rk-cyan) !important}
.filter-check{color:var(--rk-text) !important}
.brand-search{
  background:var(--rk-surface) !important;
  border:1.5px solid var(--rk-border) !important;
  color:var(--rk-text) !important;
}
.brand-search::placeholder{color:rgba(34,211,238,.3) !important}
.brand-apply-btn,.price-apply-btn{
  background:rgba(34,211,238,.06) !important;
  color:var(--rk-cyan-light) !important;
  border:1.5px solid rgba(34,211,238,.4) !important;
}
.price-input{
  background:var(--rk-surface) !important;
  border:1.5px solid var(--rk-border) !important;
  color:var(--rk-text) !important;
}
.pill-btn{color:#ddd !important;border:1.5px solid var(--rk-border-light) !important}
.pill-btn.active{
  background:linear-gradient(135deg,var(--rk-cyan-deep),var(--rk-cyan)) !important;
  color:var(--rk-bg-deep) !important;
  border-color:transparent !important;
}
.filter-mobile-results button{
  background:linear-gradient(135deg,var(--rk-cyan-deep),var(--rk-cyan)) !important;
  color:var(--rk-bg-deep) !important;
  font-weight:700 !important;
  border-radius:12px !important;
  min-height:48px;
}

/* === PAGINATION (mobile) === */
.pagination-list-container{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:center !important;
  gap:8px !important;
}
.pagination-list-container a,.pagination-list-container li a{
  background:var(--rk-surface) !important;
  color:var(--rk-text-secondary) !important;
  border:1px solid var(--rk-border) !important;
  border-radius:12px !important;
  padding:8px 14px !important;
  min-width:40px;
  min-height:40px;
  text-align:center;
  font-weight:600 !important;
  transition:all .15s !important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.pagination-list-container a:active,.pagination-list-container li a:active{
  transform:scale(.94);
  background:rgba(34,211,238,.06) !important;
}
.pagination-list-container .selected a,.pagination-list-container li.selected a{
  background:linear-gradient(135deg,var(--rk-cyan-deep),var(--rk-cyan)) !important;
  color:var(--rk-bg-deep) !important;
  border-color:transparent !important;
  font-weight:700 !important;
  box-shadow:0 4px 14px rgba(34,211,238,.2) !important;
}
.pagination-list-container .disabled a{color:var(--rk-text-muted) !important;opacity:.4 !important}
.simple-list div{
  background:var(--rk-surface) !important;
  color:var(--rk-cyan-light) !important;
  border:1.5px solid var(--rk-cyan-deep) !important;
  border-radius:8px !important;
}

/* === PRODUCT DETAIL (mobile) === */
.breadcrumbs-container{
  color:var(--rk-text-secondary) !important;
  border-bottom:1px solid var(--rk-border) !important;
}
.breadcrumbs-container a{color:var(--rk-cyan) !important}
.product-title h1,.product-title-container h1{
  color:var(--rk-text) !important;
  font-family:'Inter',sans-serif !important;
}
.pdp-price .price-card .superscript .price,.pdp-price .price-card .price{
  color:var(--rk-cyan) !important;
  font-weight:700 !important;
}
.pdp-price .price-card .superscript del{color:var(--rk-text-muted) !important}
.pdp-price .price-card{color:var(--rk-text) !important}
.in-stock-message,.stock-availability{color:var(--rk-text-secondary) !important}
.web-goods-images-box,.pc-gallery-top{
  background:var(--rk-surface) !important;
  border-radius:14px !important;
  overflow:hidden;
}
.stickprcol-js,.tt-product-vertical-layout,.pdp-style-overwrapper{background:transparent !important}

/* Share dropdown */
.share-dropdown{
  background:var(--rk-bg) !important;
  border:1px solid var(--rk-border) !important;
  color:var(--rk-text) !important;
  border-radius:16px !important;
}
.share-overlay{background:rgba(0,2,18,.65) !important}
.share-header{border-bottom:1px solid var(--rk-border) !important}
.share-header h3{color:var(--rk-text) !important}
.share-item{
  background:var(--rk-surface) !important;
  border:1px solid var(--rk-border) !important;
  border-radius:12px !important;
  color:var(--rk-text) !important;
  transition:all .15s !important;
}
.share-item:active{
  border-color:var(--rk-cyan-deep) !important;
  background:rgba(34,211,238,.06) !important;
  transform:scale(.96);
}

/* Size/options */
.labelname{color:var(--rk-text) !important}
.styleimg{max-width:100% !important;overflow:hidden !important}
.styleimg li{
  border:1px solid var(--rk-border) !important;
  border-radius:10px !important;
  background:var(--rk-surface) !important;
  max-width:100% !important;
  overflow:hidden !important;
  transition:border-color .15s,box-shadow .15s;
}
.styleimg li.active{
  border-color:var(--rk-cyan-deep) !important;
  box-shadow:0 0 0 2px rgba(34,211,238,.15) !important;
}
.styleimg .showname{color:var(--rk-text-secondary) !important}
.styleimg span{
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  word-break:break-all !important;
  box-sizing:border-box !important;
}
.fg-options select{
  background:var(--rk-surface) !important;
  border:1px solid var(--rk-border) !important;
  color:var(--rk-text) !important;
}
.fg-options table{width:100% !important;table-layout:fixed !important;max-width:100% !important}
.fg-options table td{word-break:break-all !important;overflow:hidden !important}
.detail-options-panel{overflow:hidden !important;max-width:100% !important;box-sizing:border-box !important}
.plr_20{max-width:100vw !important;overflow-x:hidden !important;box-sizing:border-box !important}
#bcpo{max-width:100% !important;overflow:hidden !important;box-sizing:border-box !important}

/* Modal/popup — inherits premium styles from dark-blue-theme.css */

/* Collapse content */
.tt-collapse-title{
  background:var(--rk-surface) !important;
  color:var(--rk-text) !important;
  border:1px solid var(--rk-border) !important;
  border-radius:12px !important;
  min-height:48px;
  display:flex;
  align-items:center;
}
.tt-collapse-content{
  background:var(--rk-bg) !important;
  color:#cbd5e1 !important;
  border-radius:0 0 12px 12px !important;
}

/* === MOBILE FOOTER === */
.footer-help-box,.footer-muen,.footer-logo-banner{background:var(--rk-bg-deep) !important}
.footer-muen h2{color:var(--rk-text) !important}
.navlist4 a{color:var(--rk-text-secondary) !important}
.navlist4 a:hover{color:var(--rk-cyan) !important}
.subscribe-box{background:var(--rk-bg-deep) !important}
.subscribe-box input[type="text"]{
  background:var(--rk-surface) !important;
  border:1px solid var(--rk-border) !important;
  color:var(--rk-text) !important;
  border-radius:10px !important;
}
.subscribe-box input[type="submit"]{
  background:linear-gradient(135deg,var(--rk-cyan-deep),var(--rk-cyan)) !important;
  color:var(--rk-bg-deep) !important;
  border:none !important;
  border-radius:10px !important;
  font-weight:700 !important;
}

/* === FORMS === */
.form-control{
  background:var(--rk-surface) !important;
  border:1px solid var(--rk-border) !important;
  color:var(--rk-text) !important;
  border-radius:10px !important;
  min-height:44px;
}
.form-control:focus{
  border-color:var(--rk-cyan-deep) !important;
  box-shadow:0 0 0 3px rgba(34,211,238,.08) !important;
}
input::placeholder,textarea::placeholder{color:var(--rk-text-muted) !important}
.btn,.btn-default,.btn-primary{
  background:linear-gradient(135deg,var(--rk-cyan-deep),var(--rk-cyan)) !important;
  color:var(--rk-bg-deep) !important;
  border:none !important;
  border-radius:12px !important;
  font-weight:700 !important;
  box-shadow:0 4px 14px rgba(34,211,238,.18) !important;
  letter-spacing:.02em;
  min-height:44px;
  touch-action:manipulation;
}
.btn:active,.btn-default:active,.btn-primary:active{
  transform:scale(.96) !important;
  filter:brightness(.9) !important;
  box-shadow:0 2px 8px rgba(34,211,238,.1) !important;
}
.btn-lg{border-radius:14px !important;padding:14px 24px !important}

/* === TABLES === */
table{color:var(--rk-text) !important}
table th{background:var(--rk-surface) !important;color:var(--rk-text-secondary) !important;border-color:var(--rk-border) !important}
table td{border-color:var(--rk-border) !important}

/* === MISC === */
hr{border-color:var(--rk-border) !important}
.fan-clm{border-color:var(--rk-border) !important}
.acl{background:transparent !important}

/* === FLOATING SOCIAL BUTTONS === */
.floating-buttons{position:fixed;right:8px;bottom:60px;z-index:999}
.floating-btn{
  background:rgba(3,9,24,.92) !important;
  border:1px solid rgba(34,211,238,.1) !important;
  border-radius:14px !important;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  transition:all .15s !important;
  box-shadow:0 4px 12px rgba(0,0,0,.4) !important;
}
.floating-btn:active{
  background:rgba(34,211,238,.1) !important;
  border-color:rgba(6,182,212,.5) !important;
  transform:scale(.92);
}
.floating-btn img{filter:brightness(0) invert(1) !important;opacity:.65 !important;transition:opacity .2s}
.floating-btn:active img{opacity:1 !important}

/* === SHOPPING CART (mobile) === */
.web-cart-table{background:var(--rk-bg) !important;color:var(--rk-text) !important}
.web-cart-table tr{border-bottom:1px solid var(--rk-border) !important}
.web-th-title{background:var(--rk-surface) !important}
.web-th-title th{color:var(--rk-text-secondary) !important;border-bottom:2px solid var(--rk-border) !important}
.cart-products-name a{color:var(--rk-text) !important}
.cart-products-qty input{
  background:var(--rk-surface) !important;
  border:1px solid var(--rk-border) !important;
  color:var(--rk-text) !important;
  border-radius:8px !important;
}
.home-title{color:var(--rk-text) !important;border-bottom:2px solid var(--rk-cyan-deep) !important}
.home-title span{color:var(--rk-text) !important}

/* =================================================================
   MOBILE FLOATING BOTTOM BUY BAR
   Fixed bar on product detail page for instant purchase access
   ================================================================= */
.rk-mobile-buy-bar{
  display:none;
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  z-index:998;
  padding:10px 16px;
  padding-bottom:max(10px,env(safe-area-inset-bottom));
  background:rgba(3,9,24,.95);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border-top:1px solid rgba(34,211,238,.12);
  box-shadow:0 -8px 32px rgba(0,0,0,.5);
  transform:translateY(100%);
  transition:transform .3s cubic-bezier(.4,0,.2,1);
}
.rk-mobile-buy-bar.is-visible{
  transform:translateY(0);
}
.rk-mobile-buy-bar__inner{
  display:flex;
  align-items:center;
  gap:10px;
  max-width:100%;
}
.rk-mobile-buy-bar__price{
  flex-shrink:0;
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.rk-mobile-buy-bar__price .m-price{
  color:var(--rk-cyan);
  font-size:18px;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.rk-mobile-buy-bar__price .m-old{
  color:var(--rk-text-muted);
  font-size:11px;
  text-decoration:line-through;
}
.rk-mobile-buy-bar__actions{
  flex:1;
  display:flex;
  gap:8px;
  justify-content:flex-end;
}
.rk-mobile-buy-bar__btn{
  flex:1;
  max-width:200px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0 18px;
  min-height:44px;
  border:none;
  border-radius:12px;
  background:linear-gradient(135deg,var(--rk-cyan-deep),var(--rk-cyan));
  color:#000212;
  font-size:14px;
  font-weight:700;
  letter-spacing:.02em;
  box-shadow:0 4px 16px rgba(34,211,238,.25);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  transition:all .15s;
}
.rk-mobile-buy-bar__btn:active{
  transform:scale(.96);
  filter:brightness(.9);
}
.rk-mobile-buy-bar__share{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  flex-shrink:0;
  border:1px solid var(--rk-border-light);
  border-radius:12px;
  background:transparent;
  color:var(--rk-text-secondary);
  font-size:16px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:all .15s;
}
.rk-mobile-buy-bar__share:active{
  background:rgba(34,211,238,.06);
  border-color:var(--rk-cyan-deep);
  transform:scale(.92);
}

/* =================================================================
   MOBILE-SPECIFIC ENHANCEMENTS (max-width: 768px)
   ================================================================= */
@media (max-width:768px){
  /* Header */
  .tt-mobile-header .container-fluid-search{
    padding:8px 12px !important;
    gap:10px;
    min-height:56px;
  }
  .tt-mobile-header .logo img{
    height:30px !important;
    max-width:150px !important;
  }

  /* Mobile nav panel */
  .panel-menu{
    width:85vw !important;
    max-width:340px;
  }
  .panel-menu .mmpanel{
    padding:20px 16px !important;
  }
  .moblinav .item-categories a,
  .mm-next-level{
    padding:14px 0 !important;
    font-size:15px !important;
    font-weight:500 !important;
    letter-spacing:.01em;
    min-height:48px;
    display:flex;
    align-items:center;
  }

  /* Product cards: mobile grid */
  .products-grid{
    grid-template-columns:repeat(2,1fr) !important;
    gap:10px !important;
  }
  .products-grid .product-card{
    border-radius:14px !important;
  }
  .products-grid .product-info{
    padding:10px 12px !important;
  }
  .products-grid .product-title{
    font-size:12px !important;
    line-height:1.4 !important;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .products-grid .product-stats .price{
    font-size:15px !important;
    font-weight:800 !important;
  }

  .buyNowBtn,.pro_buyNowBtn{
    padding:12px 16px !important;
    font-size:14px !important;
    border-radius:12px !important;
    letter-spacing:.03em !important;
    min-height:48px !important;
  }

  /* Filter pills: horizontal scroll */
  .filter-options{
    display:flex !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    gap:8px !important;
    padding:8px 0 !important;
  }
  .filter-options::-webkit-scrollbar{display:none}
  .filter-option{
    flex-shrink:0 !important;
    font-size:12px !important;
    padding:8px 16px !important;
    min-height:36px;
  }

  /* Sort bar: horizontal scroll */
  .sort-bar{
    overflow-x:auto !important;
    flex-wrap:nowrap !important;
    gap:6px !important;
    padding:8px 0 !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .sort-bar::-webkit-scrollbar{display:none}
  .sort-bar .sort-tab{
    flex-shrink:0 !important;
    font-size:12px !important;
    padding:0 14px !important;
    min-height:36px !important;
  }

  /* Mobile product detail */
  .plr_20{max-width:100% !important;overflow:visible !important;padding:0 12px !important}
  .detail-info-panel{
    margin:8px !important;
    padding:16px !important;
    border-radius:18px !important;
    background:var(--rk-bg) !important;
    border:1px solid rgba(34,211,238,.08) !important;
    box-shadow:0 12px 40px rgba(0,2,18,.4) !important;
    overflow:visible !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }
  .detail-kicker-row{display:flex !important;flex-wrap:wrap !important;gap:8px !important}
  .detail-kicker{
    display:inline-flex !important;
    align-items:center !important;
    gap:5px !important;
    padding:6px 10px !important;
    border-radius:999px !important;
    background:rgba(0,2,18,.72) !important;
    border:1px solid rgba(34,211,238,.12) !important;
    color:#cbd5e1 !important;
    font-size:10px !important;
    font-weight:700 !important;
    letter-spacing:.1em !important;
    text-transform:uppercase !important;
  }
  .detail-kicker i{color:var(--rk-cyan) !important;font-size:10px !important}
  .detail-section-label{
    color:var(--rk-cyan) !important;
    font-size:10px !important;
    font-weight:700 !important;
    letter-spacing:.12em !important;
    text-transform:uppercase !important;
    margin-bottom:8px !important;
  }
  .detail-info-panel .price-card{
    padding:14px !important;
    border-radius:16px !important;
    background:linear-gradient(180deg,rgba(12,20,37,.95),rgba(0,2,18,.95)) !important;
    border:1px solid rgba(34,211,238,.08) !important;
  }
  .detail-price-row{flex-wrap:wrap !important;gap:8px !important}
  .product-title-container h1{
    font-size:18px !important;
    line-height:1.4 !important;
    word-wrap:break-word !important;
    overflow-wrap:break-word !important;
  }
  .in-stock-message,.stock-availability{
    font-size:12px !important;
    word-wrap:break-word !important;
  }

  /* Gallery: lock overflow on mobile */
  .productSwiper-viewport,.List-Mobile-swiper{
    overflow:hidden !important;
    max-width:100vw !important;
    touch-action:pan-y !important;
  }
  .gallery-thumbs,.gallery-top{overflow:hidden !important}
  .gallery-thumbs{touch-action:pan-y !important}
  .gallery-thumbs .swiper-slide{
    border:2px solid transparent !important;
    border-radius:10px !important;
    overflow:hidden;
    background:var(--rk-surface) !important;
    opacity:.5;
    transition:all .2s;
  }
  .gallery-thumbs .swiper-slide-thumb-active{
    border-color:var(--rk-cyan-deep) !important;
    opacity:1;
  }

  .detail-actions{
    margin-top:0 !important;
    padding:14px !important;
    border-radius:16px !important;
    background:var(--rk-surface) !important;
    border:1px solid rgba(34,211,238,.08) !important;
  }
  .detail-actions .prolistli{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
  .detail-actions .pro_buyNowBtn{
    padding:14px 16px !important;
    font-size:15px !important;
    border-radius:14px !important;
  }

  /* Show floating buy bar on mobile */
  .rk-mobile-buy-bar{
    display:block;
  }

  /* Add bottom padding for floating bar */
  .rk-footer{
    padding-bottom:80px !important;
  }
  footer.rk-footer{
    padding-bottom:80px !important;
  }

  /* Mobile footer */
  .rk-footer__inner{
    flex-direction:column !important;
    padding:0 16px !important;
    gap:16px !important;
  }
  .rk-footer__links{
    justify-content:flex-start !important;
    gap:8px 12px !important;
  }
  .rk-footer__links li a{
    display:inline-flex;
    align-items:center;
    padding:8px 14px;
    border-radius:10px;
    font-size:13px;
    border:1px solid var(--rk-border);
    background:var(--rk-surface);
    min-height:38px;
  }
  .rk-footer__links li a:active{
    background:rgba(34,211,238,.06);
    border-color:var(--rk-cyan-deep);
  }

  /* Floating buttons: smaller on mobile */
  .floating-buttons{
    right:8px !important;
    bottom:80px !important;
    gap:6px !important;
    transition:bottom .3s ease;
  }
  body.rk-buybar-active .floating-buttons{
    bottom:90px !important;
  }
  .floating-btn{
    width:38px !important;
    height:38px !important;
  }
  .floating-btn img{
    width:18px !important;
    height:18px !important;
  }

  /* Smooth touch interactions — remove all tap highlights */
  .products-grid .product-card,
  .action-btn,
  .buyNowBtn,
  .pro_buyNowBtn,
  .filter-option,
  .sort-bar .sort-tab,
  .share-item,
  .prolistli a,
  .pingtaibox li a,
  .rp-rk-buy,
  .rp-card,
  .rk-ranking-item{
    -webkit-tap-highlight-color:transparent;
  }

  /* Platform modal: mobile overrides (base in dark-blue-theme.css) */
  .pro-modal .modal-content{
    max-width:92vw !important;
    padding:20px !important;
  }

  /* Back to top button */
  .rk-backtop{
    right:10px !important;
    bottom:80px !important;
    width:40px !important;
    height:40px !important;
    border-radius:12px !important;
    background:rgba(3,9,24,.92) !important;
    border:1px solid rgba(34,211,238,.1) !important;
    backdrop-filter:blur(12px) !important;
  }
  .rk-backtop img{
    width:16px !important;
    height:16px !important;
  }

  /* Homepage ranking cards - press effect */
  .rp-card:active{
    transform:scale(.97);
  }
  .rp-rk-buy:active{
    transform:scale(.94);
    filter:brightness(.88);
  }
  .rp-rk-item{
    transition:background .15s;
  }
  .rp-rk-item:active{
    background:rgba(34,211,238,.04);
  }

  /* Ranking item mobile: better touch targets */
  .rp-rk-buy{
    min-height:36px;
    min-width:60px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  /* Improved image loading: skeleton state */
  .product-image img,
  .rp-card .c-img,
  .rp-rk-img{
    background:linear-gradient(90deg,var(--rk-surface) 25%,var(--rk-border) 50%,var(--rk-surface) 75%);
    background-size:200% 100%;
  }

  /* Size popup mobile */
  .size-popup-kk{
    width:92vw !important;
    height:auto !important;
    max-height:80vh !important;
    border-radius:16px !important;
    overflow:auto !important;
  }
  .size-close{
    position:fixed !important;
    bottom:auto !important;
    top:12px !important;
    right:12px !important;
    left:auto !important;
    width:40px !important;
    height:40px !important;
    display:flex !important;
    align-items:center;
    justify-content:center;
    background:rgba(0,2,18,.8) !important;
    border-radius:50% !important;
    font-size:24px !important;
    z-index:2001 !important;
  }
}

/* === EXTRA SMALL SCREENS (max-width: 400px) === */
@media (max-width:400px){
  .products-grid{
    gap:6px !important;
  }
  .products-grid .product-info{
    padding:8px 10px !important;
  }
  .products-grid .product-title{
    font-size:11px !important;
  }
  .products-grid .product-stats .price{
    font-size:13px !important;
  }
  .buyNowBtn,.pro_buyNowBtn{
    padding:10px 14px !important;
    font-size:13px !important;
  }
  .rk-mobile-buy-bar__btn{
    font-size:13px;
    padding:0 14px;
  }
  .rk-mobile-buy-bar__price .m-price{
    font-size:16px;
  }

  /* Ranking items: more compact */
  .rp-rk-item{
    padding:8px 10px;
  }
  .rp-rk-img{
    width:40px;
    height:40px;
  }
  .rp-rk-name{
    font-size:10px;
  }
  .rp-rk-price{
    font-size:12px;
  }
}

/* === HOT SEARCH MOBILE FIX === */
@media (max-width:768px){
  .hot-search-dropdown{
    max-height:60vh !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }
  .hot-search-dropdown[data-mode="hot"]{
    max-height:65vh !important;
  }
  .hot-search-tags{
    gap:8px 6px !important;
    padding:12px 14px !important;
  }
  .hot-search-dropdown a.hot-search-tag{
    padding:7px 12px !important;
    font-size:13px !important;
    gap:6px !important;
  }
  .hot-search-rank{
    width:20px !important;height:20px !important;
    font-size:11px !important;
    border-radius:6px !important;
  }
  .hot-search-header{
    padding:10px 14px 8px !important;
    font-size:13px !important;
  }
  /* Suggest dropdown: scrollable */
  .hot-search-dropdown[data-mode="suggest"]{
    max-height:50vh !important;
    overflow-y:auto !important;
  }
}

/* === MOBILE BOTTOM TABBAR === */
.rk-mobile-tabbar{
  display:none;
}
@media (max-width:768px){
  body{
    padding-bottom:calc(84px + env(safe-area-inset-bottom,0px)) !important;
  }
  .rk-mobile-tabbar{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    height:calc(62px + env(safe-area-inset-bottom,0px));
    display:flex;
    align-items:center;
    justify-content:space-around;
    gap:2px;
    padding:7px 10px calc(7px + env(safe-area-inset-bottom,0px));
    box-sizing:border-box;
    z-index:99989;
    border-radius:20px 20px 0 0;
    overflow:hidden;
    background:
      radial-gradient(circle at 50% -34%, rgba(34,211,238,.28), rgba(14,165,233,.12) 35%, transparent 64%),
      linear-gradient(180deg, rgba(3,9,24,.16) 0%, rgba(15,23,42,.46) 42%, rgba(0,2,18,.94) 100%);
    -webkit-backdrop-filter:blur(22px) saturate(180%);
    backdrop-filter:blur(22px) saturate(180%);
    border-top:1px solid rgba(34,211,238,.16);
    box-shadow:0 -12px 32px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.08);
    transform:translateY(0);
    transition:opacity .22s ease, transform .22s ease, visibility .22s ease;
  }
  .rk-mobile-tabbar::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(180deg, rgba(255,255,255,.16) 0%, transparent 38%);
    opacity:.42;
  }
  .rk-mobile-tab-item{
    position:relative;
    z-index:1;
    flex:1 1 0;
    min-width:0;
    height:48px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    border:0;
    background:transparent;
    color:#fff !important;
    text-decoration:none !important;
    font-family:inherit;
    font-size:10px;
    font-weight:700;
    line-height:1;
    padding:0 2px;
    border-radius:16px;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
    transition:background .16s ease, color .16s ease, transform .16s ease;
  }
  .rk-mobile-tab-item i{
    font-size:20px;
    line-height:1;
    color:inherit;
  }
  .rk-mobile-tab-item span{
    display:block;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .rk-mobile-tab-item .rk-tab-badge{
    position:absolute;
    top:3px;
    right:18px;
    min-width:16px;
    height:16px;
    padding:0 4px;
    border-radius:999px;
    background:linear-gradient(135deg, #22d3ee, #2563eb);
    color:#fff;
    font-size:10px;
    font-weight:800;
    line-height:16px;
    text-align:center;
    box-shadow:0 0 10px rgba(34,211,238,.55), 0 2px 6px rgba(0,0,0,.32);
    border:1px solid rgba(255,255,255,.28);
    z-index:2;
    pointer-events:none;
  }
  .rk-mobile-tab-item:active,
  .rk-mobile-tab-item:focus{
    outline:none;
    transform:translateY(-1px);
    background:rgba(34,211,238,.10);
  }
  .rk-mobile-tabbar .rk-mobile-tab-item.is-active{
    background:linear-gradient(135deg, rgba(34,211,238,.26), rgba(37,99,235,.24));
    color:#fff !important;
  }
  body.rk-tabbar-hidden .rk-mobile-tabbar,
  body.mm-open .rk-mobile-tabbar,
  body.rk-buybar-active .rk-mobile-tabbar,
  body.rk-has-bottom-box .rk-mobile-tabbar{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(calc(100% + 18px));
  }
  .floating-buttons{
    display:none !important;
  }
}

/* === LANDSCAPE ORIENTATION FIX === */
@media (max-width:768px) and (orientation:landscape){
  .rk-mobile-buy-bar{
    padding:6px 16px;
  }
  .rk-mobile-buy-bar__btn{
    min-height:38px;
  }
}
