/*
  Constantin Chiriță - Responsive Adapter
  Safe global layer for phones, tablets, 16:9 monitors and ultrawide screens.
*/

:root{
  --cc-vh:1vh;
  --cc-page-pad:clamp(14px, 3vw, 40px);
  --cc-max-content:clamp(1120px, 86vw, 1480px);
  --cc-card-radius:clamp(18px, 2.4vw, 36px);
}

html{
  width:100%;
  max-width:100%;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}

*, *::before, *::after{
  min-width:0;
}

img, picture, svg, video, canvas{
  max-width:100%;
  height:auto;
}

iframe{
  max-width:100%;
}

input, select, textarea, button{
  max-width:100%;
}

table{
  max-width:100%;
}

.cc-table-scroll{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

/* generic containers */
.container,
.site-container,
.page-container,
.main-container,
.content-container{
  max-width:var(--cc-max-content);
}

/* prevent oversized utility blocks from creating horizontal scroll */
.glass,
.glass-soft,
.card,
.product-card,
.order-item,
.account-card,
.summary-card,
.checkout-card,
.details,
.gallery,
.sidebar,
.map-card,
.details-card,
.company-card,
.bank-card,
.support-form-card,
.contact-bar{
  max-width:100%;
}

/* Ultrawide: keep the site centered and premium instead of stretched */
@media (min-width:1600px){
  :root{
    --cc-max-content:1500px;
  }

  .container,
  .site-container,
  .page-container,
  .main-container,
  .content-container{
    width:min(calc(100% - 80px), var(--cc-max-content)) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .product-layout,
  .checkout-layout,
  .checkout-grid,
  .account-layout,
  .contact-layout{
    gap:clamp(22px, 2vw, 36px) !important;
  }
}

@media (min-width:2200px){
  :root{
    --cc-max-content:1640px;
  }

  body{
    background-size:cover;
  }
}

/* Desktop/laptop scaling */
@media (max-width:1280px){
  :root{
    --cc-page-pad:clamp(14px, 2.6vw, 28px);
  }

  .container,
  .site-container,
  .page-container,
  .main-container,
  .content-container{
    width:min(calc(100% - 32px), var(--cc-max-content)) !important;
  }
}

/* Tablet */
@media (max-width:1024px){
  .product-layout,
  .checkout-layout,
  .checkout-grid,
  .account-layout,
  .contact-layout,
  .support-bank-layout,
  .hero-contact,
  .account-hero,
  .footer-grid,
  .site-footer-grid,
  .cc-final-footer__grid{
    grid-template-columns:1fr !important;
  }

  .sidebar{
    position:relative !important;
    top:auto !important;
  }

  .summary-card{
    position:relative !important;
    top:auto !important;
  }

  .nav-wrap,
  .nav{
    gap:12px !important;
  }
}

/* Phones */
@media (max-width:760px){
  :root{
    --cc-page-pad:14px;
    --cc-card-radius:22px;
  }

  .container,
  .site-container,
  .page-container,
  .main-container,
  .content-container{
    width:min(calc(100% - 20px), var(--cc-max-content)) !important;
  }

  .section{
    padding-top:22px !important;
    padding-bottom:46px !important;
  }

  .nav-wrap,
  .nav{
    border-radius:24px !important;
    padding:10px 12px !important;
  }

  nav{
    max-width:100%;
  }

  .brand-copy small{
    letter-spacing:.14em !important;
  }

  .brand-copy strong{
    white-space:normal !important;
  }

  .hero,
  .hero-contact,
  .account-hero,
  .product-layout,
  .checkout-layout,
  .checkout-grid,
  .contact-layout,
  .support-bank-layout,
  .account-layout,
  .profile-grid,
  .security-grid,
  .coupon-list,
  .contact-grid,
  .contact-bar,
  .footer-grid,
  .site-footer-grid,
  .cc-final-footer__grid{
    grid-template-columns:1fr !important;
  }

  .glass,
  .glass-soft,
  .card,
  .product-card,
  .order-item,
  .account-card,
  .summary-card,
  .checkout-card,
  .details,
  .gallery,
  .sidebar,
  .map-card,
  .details-card,
  .company-card,
  .bank-card,
  .support-form-card{
    border-radius:var(--cc-card-radius) !important;
  }

  h1{
    font-size:clamp(32px, 10vw, 46px) !important;
    line-height:.98 !important;
  }

  h2{
    font-size:clamp(26px, 8vw, 36px) !important;
  }

  .product-title,
  #productTitle{
    font-size:clamp(30px, 9vw, 42px) !important;
  }

  .product-card,
  .order-item,
  .coupon-card,
  .address-card,
  .notification-card{
    width:100% !important;
  }

  .product-thumb,
  .main-image{
    max-width:100% !important;
  }

  .main-image img,
  #mainProductImage{
    max-height:min(68vh, 560px) !important;
    object-fit:contain !important;
  }

  .qty-cart,
  .save-row,
  .order-actions,
  .actions,
  .button-row{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
  }

  .btn,
  .ghost-btn,
  .cart-btn,
  .add-cart-btn,
  .support-submit,
  .submit-btn,
  .small-btn{
    width:100%;
    justify-content:center;
  }

  .order-product,
  .order-top,
  .cart-row,
  .checkout-row,
  .iban-row{
    flex-direction:column !important;
    align-items:flex-start !important;
  }

  .order-price,
  .price,
  .cc-search-price{
    white-space:normal !important;
  }

  .cc-search-results{
    grid-template-columns:1fr !important;
  }

  .cc-search-result{
    grid-template-columns:72px 1fr !important;
  }

  .cc-floating-search{
    max-width:calc(100vw - 28px);
  }

  table{
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
}

/* Very small phones */
@media (max-width:390px){
  .container,
  .site-container,
  .page-container,
  .main-container,
  .content-container{
    width:min(calc(100% - 14px), var(--cc-max-content)) !important;
  }

  .brand-logo{
    width:42px !important;
    height:42px !important;
  }

  .icon-btn,
  .menu-toggle{
    width:38px !important;
    height:38px !important;
  }

  .cart-btn{
    padding:10px 11px !important;
    font-size:12px !important;
  }

  .support-perks,
  .hero-pills,
  .helper-row{
    display:grid !important;
    grid-template-columns:1fr !important;
  }
}

/* Landscape phone and short screens */
@media (max-height:520px) and (orientation:landscape){
  header{
    position:relative !important;
  }

  .section,
  .page{
    padding-top:16px !important;
    padding-bottom:28px !important;
  }

  .main-image img,
  #mainProductImage{
    max-height:75vh !important;
  }
}

/* JS-set viewport modes */
html[data-cc-viewport="phone"] .desktop-only{
  display:none !important;
}

html[data-cc-viewport="ultrawide"] .container,
html[data-cc-viewport="ultrawide"] .site-container,
html[data-cc-viewport="ultrawide"] .page-container{
  max-width:var(--cc-max-content);
}


/* Product page premium polish */
@media (min-width: 721px){
  .product-layout{align-items:stretch !important;}
}

.product-layout .gallery,
.product-layout .details,
.info-card,
.related-wrap{
  border:1px solid rgba(255,255,255,.86) !important;
  box-shadow:0 28px 80px rgba(150,25,45,.13) !important;
}

.product-layout .gallery{position:relative;overflow:hidden;}
.product-layout .gallery::before{
  content:"Selecție premium";
  position:absolute;
  top:18px;
  left:18px;
  z-index:3;
  padding:9px 13px;
  border-radius:999px;
  background:linear-gradient(135deg, var(--red, #b9152b), var(--red-2, #d63a4f));
  color:#fff;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  box-shadow:0 12px 28px rgba(185,21,43,.22);
}

.product-layout .main-image,
.product-layout .product-thumb{
  background:radial-gradient(circle at top, rgba(185,21,43,.08), rgba(255,255,255,.74) 58%) !important;
}

.product-layout .details h1{
  letter-spacing:-.045em;
}

.product-layout .subline,
.product-layout .desc{
  line-height:1.75 !important;
}

.product-layout .price-row{
  padding:16px !important;
  border-radius:24px !important;
  background:linear-gradient(135deg, rgba(185,21,43,.08), rgba(255,255,255,.72)) !important;
  border:1px solid rgba(185,21,43,.10) !important;
}

.product-layout .stock{
  border-radius:999px !important;
  padding:10px 13px !important;
}

.product-layout .add-cart-btn{
  border-radius:999px !important;
  min-height:58px !important;
  box-shadow:0 18px 38px rgba(185,21,43,.22) !important;
}

.product-layout .spec{
  border-radius:18px !important;
  background:rgba(255,255,255,.70) !important;
}

.product-layout .details::after{
  content:"Livrare rapidă · Ambalare atentă · Suport pentru comenzi";
  display:block;
  margin-top:18px;
  padding:14px 16px;
  border-radius:20px;
  background:rgba(255,255,255,.64);
  border:1px solid rgba(185,21,43,.10);
  color:var(--muted, #6e6e78);
  line-height:1.55;
}

@media (max-width: 720px){
  .product-layout .gallery::before{top:12px;left:12px;font-size:10px;padding:7px 10px;}
  .product-layout .details::after{font-size:13px;}
}


/* Final resolution/layout safety pass */
html{overflow-x:hidden !important;}
body{overflow-x:hidden !important;}

:where(.container,.cc-final-footer,.nav,.nav-wrap,main,.page,.section,.hero,.card,.panel,.checkout-shell,.account-shell,.product-layout){
  max-width:100%;
}

:where(.container){
  width:min(calc(100% - clamp(20px,4vw,48px)), var(--container, 1280px)) !important;
}

@media (min-width: 1500px){
  :root{--container:1320px;}
  body{background-size:cover;}
  :where(main,.container){margin-left:auto !important;margin-right:auto !important;}
  :where(.product-layout,.checkout-shell,.account-grid,.hero-grid){gap:clamp(24px,2vw,44px) !important;}
}

@media (min-width: 1900px){
  :root{--container:1440px;}
  :where(.container){width:min(1440px, calc(100% - 96px)) !important;}
}

@media (max-width: 1180px){
  :where(.product-layout,.checkout-shell,.account-grid,.hero-grid,.dashboard-grid){
    grid-template-columns:1fr !important;
  }
  :where(.sidebar,.summary,.order-summary,.sticky-card){position:static !important;top:auto !important;}
}

@media (max-width: 760px){
  :where(.container){width:min(calc(100% - 20px), var(--container, 1280px)) !important;}
  :where(main,.section,.page){padding-left:0 !important;padding-right:0 !important;}
  :where(.card,.panel,.glass,.glass-soft,.details,.gallery,.info-card,.related-wrap){
    border-radius:22px !important;
  }
  :where(input,select,textarea,button,.btn,.primary,.secondary,.add-cart-btn){
    max-width:100% !important;
  }
}

/* Avoid huge empty vertical gaps on success/utility pages */
body:has(.page) .page{
  min-height:auto !important;
  padding:min(8vh,70px) 0 !important;
  display:block !important;
}

@supports not selector(:has(*)){
  .page{min-height:auto !important;padding:min(8vh,70px) 0 !important;}
}

/* Tables/forms safety */
:where(table){max-width:100%;}
:where(.table-wrap,.admin-table-wrap){overflow-x:auto;}
:where(img,video,iframe){max-width:100%;height:auto;}
