/*! Vivello Mobile Override v1 (only additive; no structure changes) */
/* Last updated: 2025-10-23 */

/* ===== GLOBAL ===== */
@media (max-width: 768px){
  html, body{overflow-x:hidden}
  body{word-break:break-word}
  img, video, iframe{max-width:100%;height:auto}
  .container, .container-v{padding-left:16px!important;padding-right:16px!important}
  .row.g-4 > [class^="col-"], .row.g-4 > [class*=" col-"]{margin-top:0}
  /* Buttons & inputs full width by default on mobile */
  .btn, .btn-v, .btn-add, .checkout, button[type="submit"], input[type="submit"]{width:100%}
  .form-select, .form-control{min-height:44px}
}

/* ===== HEADER (non-intrusive) ===== */
@media (max-width: 768px){
  header, .header{position:relative; z-index:1000}
  nav, .nav, .menu, .top-nav{
    display:flex; gap:10px; overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:nowrap;
    scrollbar-width:none;
  }
  nav::-webkit-scrollbar, .nav::-webkit-scrollbar, .menu::-webkit-scrollbar, .top-nav::-webkit-scrollbar{display:none}
}

/* ===== PRODUCT LIST (urunler-list) ===== */
@media (max-width: 992px){
  .main{flex-direction:column!important; gap:16px!important; padding:20px 16px!important}
  .sidebar{position:relative!important; top:auto!important; width:100%!important; max-width:100%!important}
}
@media (max-width: 560px){
  .products{grid-template-columns:repeat(1, minmax(0, 1fr))!important; justify-content:stretch!important}
  .card-v img{height:160px!important}
  .qty-input{min-width:100%!important}
}

/* ===== PRODUCT DETAIL (urun-detayi) ===== */
@media (max-width: 768px){
  .gallery-wrap{padding:10px!important}
  .gallery-main{aspect-ratio:1/1!important}
  .gallery-thumb{width:60px!important;height:60px!important}
  .buy-inline{flex-direction:column!important}
  .buy-inline select, .buy-inline input[type="number"]{max-width:100%!important;width:100%!important}
  .v-tabs .nav-link{padding:10px 12px!important; font-size:14px!important}
}

/* ===== RECOMMENDATIONS (& cards) ===== */
@media (max-width: 560px){
  .recs{grid-template-columns:repeat(1, minmax(0,1fr))!important; justify-content:stretch!important}
  .rec-card img{height:130px!important}
}

/* ===== CART FAB + PANEL (shared) ===== */
@media (max-width: 480px){
  .fab-cart{width:56px!important;height:56px!important; right:12px!important; bottom:12px!important}
  .cart, .cart-panel{width:96vw!important; right:2vw!important; bottom:80px!important}
  .cart-b{padding:12px!important}
  .row-item img{width:48px!important;height:48px!important}
}

/* ===== POPUPS / SHEETS (müşteri bilgileri, KVKK, sözleşme) ===== */
@media (max-width: 780px){
  .v-modal{width:96vw!important}
  .v-body{max-height:70vh!important}
  .v-row{grid-template-columns:1fr!important}
  .v-sheet{width:96vw!important; max-height:78vh!important}
  .v-sheet-body{max-height:calc(78vh - 56px)!important}
  .v-ok-card{width:96vw!important}
}

/* ===== FOOTER & MISC ===== */
@media (max-width: 768px){
  footer, .footer{padding:16px!important}
  .table-responsive{width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch}
  table{min-width:600px} /* if any wide tables exist */
}

/* ===== Typography fine-tuning ===== */
@media (max-width: 400px){
  h1, .h1{font-size:22px!important}
  h2, .h2{font-size:20px!important}
  h3, .h3{font-size:18px!important}
}