/* ===== Base ===== */
*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body.tdc{
  font:14px/1.5 'Open Sans', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  margin:0; color:#111; background:#fff;
  -webkit-text-size-adjust: 100%;
}
a{color:#0b57d0; text-decoration:none;}
a:hover{text-decoration:underline;}
.container{max-width:1200px; margin:0 auto; padding:0 16px;}
.page-title{font-size:20px; margin:16px 0;}
.muted{color:#6b7280;}

/* ===== Header & Footer ===== */
.tdc-header{background:#fff; border-bottom:1px solid #eee; position:sticky; top:0; z-index:50;}
.tdc-header .container{display:flex; align-items:center; gap:12px; padding:10px 16px;}
.tdc-header .logo{font-weight:700; font-size:18px; margin-right:16px; color:#111;}
.tdc-header .nav{display:flex; align-items:center; gap:12px; flex:1; flex-wrap:nowrap;}
.tdc-header .nav a{color:#333; white-space:nowrap;}
.tdc-footer{border-top:1px solid #eee; margin-top:24px; padding:16px 0; color:#6b7280;}

/* Header mobile: pune search sub logo */
@media (max-width:640px){
  .tdc-header .container{flex-direction:column; align-items:stretch;}
  .tdc-header .nav{flex-direction:column; align-items:stretch; gap:8px;}
}

/* ===== Search form & suggestions (header) — REVAMP DROP-IN ===== */
form.search{
  position:relative; display:flex; align-items:center; gap:8px; flex:1; min-width:0;
}

/* INPUT — anti-zoom iOS + icon + shimmer clar la focus */
form.search input[type="search"]{
  flex:1; min-width:0;
  height:44px; line-height:44px;
  padding:0 12px 0 40px; /* loc pentru iconul de căutare */
  border:1px solid #e5e7eb; border-radius:10px;
  background:#fff;
  font-size:16px !important; /* PREVINE zoom pe iOS */
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;

  /* icon lupă (SVG) + fundal pentru shimmer */
  background-image:
    url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='11' cy='11' r='7' stroke='%2367738b' stroke-width='2'/%3E%3Cpath d='M20 20L16.65 16.65' stroke='%2367738b' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"),
    linear-gradient(90deg,#fff 0%, #f7fbff 50%, #fff 100%);
  background-repeat:no-repeat, no-repeat;
  background-size:20px 20px, 200% 100%;
  background-position:12px center, 0% 50%;
}

@keyframes searchShimmer {
  0% { background-position: 12px center, 0% 50%; }
  100% { background-position: 12px center, 200% 50%; }
}

form.search input[type="search"]:focus{
  border-color:#b8d3ff;
  background-color:#fbfdff;
  box-shadow:0 6px 18px rgba(11,87,208,.16), 0 0 0 4px rgba(11,87,208,.10);
  animation: searchShimmer 2.2s linear infinite;
}

/* halo vizibil când form are focus în interior */
form.search:focus-within{
  filter: drop-shadow(0 8px 22px rgba(11,87,208,.18));
}

/* Placeholder mai vizibil + pulse subtil */
form.search input[type="search"]::placeholder{
  color:#8a93a2; opacity:1; transition:opacity .2s ease;
}
@keyframes phPulse { 0%{opacity:.8} 50%{opacity:1} 100%{opacity:.8} }
form.search:focus-within input[type="search"]::placeholder{
  animation: phPulse 1.8s ease-in-out infinite;
}

/* Buton — înălțime aliniată cu input-ul + relief */
form.search .search-btn{
  height:44px; padding:0 14px;
  border:1px solid #0b57d0; background:#0b57d0; color:#fff;
  border-radius:10px; font-weight:700; cursor:pointer;
  box-shadow:0 6px 16px rgba(11,87,208,.22);
  transition:transform .06s ease, filter .2s ease, box-shadow .2s ease;
  white-space:nowrap;
}
form.search .search-btn:hover{ filter:brightness(.97); }
form.search .search-btn:active{ transform:translateY(1px); }

/* Sugestii — z-index mare ca să apară peste glow/shadow */
.sug{
  position:absolute; top:100%; left:0; right:0; background:#fff;
  border:1px solid #e5e7eb; border-top:none; border-radius:0 0 10px 10px;
  box-shadow:0 8px 20px rgba(0,0,0,.06); max-height:320px; overflow:auto;
  z-index:50;
}
.sug[hidden]{display:none;}
.sug-item{display:block; padding:10px 12px; border-top:1px solid #f3f4f6; color:#111;}
.sug-item:hover{background:#f9fafb; text-decoration:none;}

/* iOS safety net: păstrează 16px pe toate controalele form */
@supports (-webkit-touch-callout: none) {
  input, select, textarea, button { font-size:16px !important; }
}

/* ===== Product cards grid ===== */
.grid-products{display:grid; gap:16px; grid-template-columns: repeat(2,1fr);}
@media (min-width:640px){ .grid-products{ grid-template-columns: repeat(3,1fr);} }
@media (min-width:900px){ .grid-products{ grid-template-columns: repeat(4,1fr);} }
@media (min-width:1200px){ .grid-products{ grid-template-columns: repeat(5,1fr);} }

.card{
  background:#fff; border:1px solid #eee; border-radius:12px; overflow:hidden;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.card .thumb{display:block; background:#f7f7f7; aspect-ratio:3/4; position:relative;}
.card .thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:contain;}
.card .card-body{padding:10px;}
.card .card-title{display:block; font-weight:600; color:#111;}
.one-line{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

.card-price.centered{display:flex; justify-content:center; margin:8px 0;}
.price-pill{
  display:inline-block; padding:6px 10px; border-radius:999px;
  background:#f0f7ff; color:#0b57d0; font-weight:700;
}

.btn.cta{
  display:block; text-align:center; padding:10px 12px; border-radius:10px;
  background:#0b57d0; color:#fff; font-weight:600; margin-top:8px;
}
.btn.cta:hover{filter:brightness(0.95); text-decoration:none;}
.btn[disabled]{opacity:.6; cursor:not-allowed;}

.card-vendor{margin-top:6px; font-size:12px; color:#6b7280;}
.card-vendor strong{color:#374151; font-weight:600;}

/* ===== Product page ===== */
.product-grid{display:grid; gap:24px; grid-template-columns: 1fr;}
@media (min-width:900px){ .product-grid{ grid-template-columns: 1fr 1.2fr; } }

.product-img{
  width:100%; max-width:520px; aspect-ratio:3/4; object-fit:contain;
  background:#f7f7f7; border:1px solid #eee; border-radius:12px;
}
.product-title{font-size:22px; margin:0 0 8px 0;}
.product-meta{margin-bottom:12px; color:#374151;}
.product-meta .meta-row{margin:4px 0;}

.product-desc{margin-top:16px;}
.product-desc p{margin:0 0 12px 0;}
.product-desc ul, .product-desc ol{padding-left:20px;}
.product-desc b, .product-desc strong{font-weight:600;}

/* ===== Buybar (50/50 pe desktop, FĂRĂ sticky) ===== */
.buybar{
  display:flex; align-items:center; gap:12px; padding:10px 0;
  border-top:1px solid #eee; 
  position:static; left:auto; right:auto; bottom:auto; top:auto; /* not sticky on desktop */
  background:#fff;
}
.buybar .buybar-price{
  flex:1 1 50%;
  display:flex; align-items:center; justify-content:flex-start; /* schimbă în center dacă vrei centrat */
}
.buybar .btn.cta{
  flex:1 1 50%;
  width:100%; max-width:none; margin-top:0;
}

/* ===== Mobile: STICKY jos, 50/50, preț mai mare ===== */
@media (max-width:768px){
  .buybar{
    position:fixed; left:0; right:0; bottom:0; top:auto;
    padding:10px 16px; border-top:1px solid #e5e7eb; box-shadow:0 -4px 16px rgba(0,0,0,.06);
    justify-content:space-between; background:#fff; z-index:5;
  }
  .buybar .buybar-price{flex:1 1 50%; justify-content:flex-start;}
  .buybar .price-pill{font-size:18px; padding:8px 12px;}
  .buybar .btn.cta{flex:1 1 50%; min-width:0; width:100%; margin-top:0;}
  .product-right .product-title{margin-bottom:8px;}
  body{padding-bottom:70px;} /* spațiu pentru buybar fix pe mobil */
}

/* ===== Pagination ===== */
.pagination{display:flex; justify-content:center; gap:8px; margin:16px 0;}
.pagination a, .pagination span{
  display:inline-block; padding:8px 12px; border:1px solid #eee; border-radius:8px; color:#111; background:#fff;
}
.pagination .active{background:#0b57d0; color:#fff; border-color:#0b57d0;}
.pagination a:hover{text-decoration:none; background:#f9fafb;}