/* Shop sayfa stilleri — index, detail, cart, profile */

.shop-layout { display:grid; grid-template-columns:280px 1fr; gap:2.5rem; padding:2rem 0 6rem; }
.filters-sidebar { position:sticky; top:var(--header-height); max-height:calc(100vh - var(--header-height)); overflow-y:auto; padding-right:.5rem; }
.filter-group { margin-bottom:1.25rem; padding-bottom:1.25rem; border-bottom:1px solid var(--border); }
.filter-group h3 { font-size:.95rem; font-weight:700; margin-bottom:.75rem; color:var(--primary); }
.all-products-link { display:flex; align-items:center; gap:.6rem; padding:.6rem .875rem; border-radius:var(--radius); font-size:.9rem; font-weight:600; color:var(--text); transition:var(--tf); text-decoration:none; margin-bottom:.25rem; }
.all-products-link:hover, .all-products-link.active { background:rgba(37,99,235,.08); color:var(--accent); }
.all-products-link svg { flex-shrink:0; opacity:.6; }
.category-item { margin-bottom:2px; }
.category-toggle-wrapper { display:flex; align-items:stretch; border-radius:var(--radius); overflow:hidden; transition:background var(--tf); }
.category-toggle-wrapper:hover { background:var(--bg-alt); }
.category-toggle-wrapper.active { background:rgba(37,99,235,.08); }
.category-label { display:flex; align-items:center; gap:.6rem; flex:1; padding:.6rem .75rem .6rem .875rem; background:none; border:none; cursor:pointer; font-size:.88rem; font-weight:600; color:var(--text); text-align:left; font-family:inherit; transition:color var(--tf); min-width:0; text-decoration:none; }
.category-toggle-wrapper:hover .category-label,
.category-toggle-wrapper.active .category-label { color:var(--accent); }
.category-icon { display:flex; align-items:center; flex-shrink:0; opacity:.65; }
.category-toggle-wrapper.active .category-icon { opacity:1; }
.category-name { flex:1; min-width:0; line-height:1.3; }
.category-chevron-btn { display:flex; align-items:center; justify-content:center; flex-shrink:0; width:34px; background:none; border:none; border-left:1px solid var(--border); cursor:pointer; color:var(--text-muted); transition:var(--tf); padding:0; }
.category-chevron-btn:hover { background:rgba(37,99,235,.08); color:var(--accent); }
.category-chevron-btn .chevron { transition:transform .25s ease; }
.category-item.expanded .category-chevron-btn .chevron { transform:rotate(180deg); }
.category-item.expanded .category-toggle-wrapper { background:rgba(37,99,235,.08); }
.category-item.expanded .category-label { color:var(--accent); }
.category-item.expanded .category-icon { opacity:1; }
.subcategory-list { list-style:none; padding:2px 0 4px 0; margin:0; display:none; }
.category-item.expanded .subcategory-list { display:block; }
.subcategory-link { display:block; padding:.4rem .875rem .4rem 2.6rem; font-size:.82rem; color:var(--text-muted); text-decoration:none; border-radius:var(--radius); transition:var(--tf); font-weight:500; }
.subcategory-link:hover, .subcategory-link.active { color:var(--accent); background:var(--bg-alt); font-weight:700; }
.brand-item { display:flex; align-items:center; gap:.6rem; padding:.3rem .875rem .3rem 2.6rem; font-size:.875rem; color:var(--text-muted); cursor:pointer; text-decoration:none; transition:var(--tf); border-radius:var(--radius); }
.brand-item input { accent-color:var(--accent); width:1rem; height:1rem; cursor:pointer; pointer-events:none; flex-shrink:0; }
.brand-item:hover { color:var(--accent); background:var(--bg-alt); }
.brand-item.active { color:var(--accent); font-weight:600; }
.products-container { display:flex; flex-direction:column; gap:1.25rem; min-width:0; }

.offers-section {
  padding:.625rem 1rem .875rem;
  border-radius:18px;
  background:rgba(248,250,252,.75);
  border:1px solid rgba(148,163,184,.4);
  box-shadow:0 12px 30px rgba(15,23,42,.08);
  backdrop-filter:blur(12px);
}
.offers-header { margin-bottom:.5rem; }
.offers-title { font-size:1.15rem; font-weight:700; color:var(--primary); }
.offers-slider-wrapper { position:relative; display:flex; align-items:center; }
.offers-nav {
  flex-shrink:0; width:30px; height:30px; border-radius:50%;
  background:#fff; border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; font-size:.85rem; color:var(--text-muted);
  transition:var(--tf); z-index:2; line-height:1;
}
.offers-nav:hover { background:var(--accent); color:#fff; border-color:var(--accent); }
.offers-nav-prev { margin-right:4px; }
.offers-nav-next { margin-left:4px; }
.offers-slider {
  flex:1; display:flex; gap:.75rem; overflow-x:auto;
  scroll-behavior:smooth; scroll-snap-type:x mandatory;
  padding:.5rem .15rem .9rem; scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
.offers-slider::-webkit-scrollbar { display:none; }
.offer-card {
  min-width:155px; max-width:170px; flex:0 0 auto;
  background:var(--card-bg,#fff); border-radius:var(--radius);
  border:1px solid var(--border); box-shadow:var(--shadow-sm);
  overflow:hidden; scroll-snap-align:start;
  display:flex; flex-direction:column;
  transition:transform .3s cubic-bezier(.4,0,.2,1),box-shadow .3s,border-color .2s;
}
.offer-card:hover { transform:translateY(-2px); box-shadow:var(--shadow); border-color:var(--accent); }
.offer-card-image { position:relative; aspect-ratio:1/1; overflow:hidden; background:var(--bg-alt); }
.offer-card-image a { display:block; width:100%; height:100%; }
.offer-card-image img { width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.offer-card:hover .offer-card-image img { transform:scale(1.05); }
.offer-card-placeholder {
  width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  background:#e2e8f0; color:#64748b; font-weight:700; font-size:1.5rem;
}
.image-badge-sale {
  position:absolute; bottom:7px; right:7px; z-index:5;
  background:#dc2626; color:#fff;
  font-size:.62rem; font-weight:800; padding:.2rem .45rem;
  border-radius:5px; line-height:1.2;
  box-shadow:0 2px 6px rgba(220,38,38,.35);
}
.offer-card-body { padding:.65rem .8rem .8rem; flex:1; display:flex; flex-direction:column; gap:.3rem; }
.offer-card-header-row { display:flex; align-items:center; justify-content:space-between; gap:.35rem; }
.offer-brand { font-size:.62rem; font-weight:700; color:var(--accent); text-transform:uppercase; letter-spacing:.05em; }
.offer-badge {
  font-size:.58rem; font-weight:700; padding:.15rem .45rem;
  background:rgba(220,38,38,.1); color:#dc2626;
  border:1px solid rgba(220,38,38,.2); border-radius:4px;
  white-space:nowrap; flex-shrink:0;
}
.offer-card-title-link { text-decoration:none; color:inherit; }
.offer-card-title {
  font-size:.75rem; font-weight:600; line-height:1.35; color:var(--text);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  margin-bottom:.1rem;
}
.offer-card .ordering-box {
  margin-top:auto; display:flex; flex-direction:column; gap:.25rem;
  padding-top:.45rem; border-top:1px solid var(--border);
}
.offer-card .price-label { font-size:.57rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:#059669; }
.offer-card .price-value { display:flex; align-items:baseline; gap:.25rem; flex-wrap:wrap; }
.offer-card .old-price-inline { font-size:.65rem; color:var(--text-muted); text-decoration:line-through; }
.offer-card .current-price-inline.is-sale { font-size:.88rem; font-weight:800; color:#dc2626; }
.offer-card .price-value small { font-size:.62rem; color:var(--text-muted); }
.offer-card .order-controls { display:flex; gap:.2rem; align-items:flex-end; }
.offer-card .qty-control, .offer-card .unit-control { display:flex; flex-direction:column; gap:1px; }
.offer-card .qty-control { flex:0 0 auto; }
.offer-card .unit-control { flex:1; min-width:0; }
.offer-card .qty-control label,
.offer-card .unit-control label { font-size:.55rem; font-weight:600; color:var(--text-muted); text-transform:uppercase; letter-spacing:.04em; }
.offer-card .order-controls .qty-input,
.offer-card .order-controls .unit-select {
  height:26px;
  min-height:26px;
  max-height:26px;
  padding:0 .3rem;
  border:1px solid var(--border);
  border-radius:4px;
  font-size:.75rem;
  font-weight:600;
  font-family:inherit;
  line-height:24px;
  box-sizing:border-box;
  color:var(--text);
}
.offer-card .order-controls .qty-input {
  width:40px;
  text-align:center;
  -moz-appearance:textfield;
  appearance:textfield;
}
.offer-card .order-controls .qty-input::-webkit-outer-spin-button,
.offer-card .order-controls .qty-input::-webkit-inner-spin-button {
  -webkit-appearance:none;
  margin:0;
}
.offer-card .order-controls .unit-select {
  padding-right:1rem;
  cursor:pointer;
  appearance:none;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23475569'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") no-repeat right .25rem center;
  background-size:.6rem;
}
.offer-card .price-preview { font-size:.65rem; color:var(--text-muted); min-height:.85rem; }
.offer-card .preview-value { font-weight:700; color:var(--text); }
.offer-add-to-cart {
  width:100%; padding:.35rem .5rem; border:none;
  background:var(--primary); color:#fff; border-radius:4px;
  font-size:.7rem; font-weight:600; cursor:pointer; font-family:inherit;
  transition:var(--tf); display:inline-flex; align-items:center; justify-content:center; gap:3px;
  margin-top:.1rem;
}
.offer-add-to-cart:hover { background:var(--accent); }
.offers-footer { text-align:right; margin-top:.5rem; }
.offers-all-btn {
  display:inline-block; padding:.32rem 1rem; border:1.5px solid var(--border);
  border-radius:var(--radius); font-size:.78rem; font-weight:600;
  background:#fff; color:var(--text); cursor:pointer; font-family:inherit; transition:var(--tf);
  text-decoration:none;
}
.offers-all-btn:hover { border-color:var(--accent); color:var(--accent); }

.products-header { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.products-toolbar { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; margin-bottom:.25rem; }
.products-toolbar-left { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.products-toolbar-right { display:flex; align-items:center; gap:.5rem; margin-left:auto; }
.sort-label { font-size:.82rem; color:var(--text-muted); white-space:nowrap; }
.per-page-wrap { display:flex; align-items:center; gap:.4rem; }
.per-page-wrap .filter-dropdown { min-width:72px; }
.toolbar-sep { width:1px; height:20px; background:var(--border); margin:0 .25rem; flex-shrink:0; }
.view-btns { display:flex; gap:3px; background:var(--bg-alt); border:1px solid var(--border); border-radius:var(--radius); padding:3px; }
.view-btn { background:none; border:none; color:var(--text-muted); cursor:pointer; padding:5px 8px; border-radius:5px; display:flex; align-items:center; transition:var(--tf); }
.view-btn.active { background:#fff; color:var(--primary); box-shadow:var(--shadow-sm); }
.view-btn:hover:not(.active) { color:var(--accent); }
.product-grid.list-view { grid-template-columns:1fr !important; gap:.5rem; }
.product-grid.list-view .product-card { flex-direction:row; height:auto; }
.product-grid.list-view .product-image-container { width:130px; flex-shrink:0; aspect-ratio:1/1; }
.product-grid.list-view .product-info { flex-direction:row; align-items:center; gap:1rem; padding:.75rem 1rem; }
.product-grid.list-view .product-info > *:not(.ordering-box):not(.price-locked) { flex:1; }
.product-grid.list-view .ordering-box { border-top:none; border-left:1px solid var(--border); padding-top:0; padding-left:1rem; min-width:180px; }
.product-grid.list-view .price-locked { border-top:none; border-left:1px solid var(--border); margin-top:0; padding-left:1rem; min-width:180px; }
@media (max-width:767px) {
  .products-toolbar-left { display:none; }
}
@media (max-width:600px) {
  .product-grid.list-view .product-card { flex-direction:column; }
  .product-grid.list-view .product-image-container { width:100%; }
  .product-grid.list-view .product-info { flex-direction:column; }
  .product-grid.list-view .ordering-box,
  .product-grid.list-view .price-locked { border-left:none; border-top:1px solid var(--border); padding-left:0; padding-top:.6rem; min-width:auto; }
}
.products-title { font-size:1.1rem; font-weight:700; }
.count-number { font-size:.8rem; font-weight:700; color:var(--accent); background:rgba(37,99,235,.08); padding:.1rem .4rem; border-radius:999px; }
.product-grid { display:grid; grid-template-columns:repeat(5,1fr); column-gap:1rem; row-gap:1.25rem; }
.product-card { background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; transition:transform .3s,box-shadow .3s,border-color .2s; display:flex; flex-direction:column; height:100%; }
.product-card:hover { border-color:var(--accent); box-shadow:0 4px 16px rgba(0,0,0,.08); transform:translateY(-2px); }
.product-image-container { position:relative; width:100%; aspect-ratio:1/1; background:#f0f0f0; overflow:hidden; }
.product-image-container .image-badge-sale { position:absolute; bottom:7px; right:7px; z-index:5; }
.product-image-container img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.product-card:hover .product-image-container img { transform:scale(1.05); }
.product-info { padding:.6rem .75rem .75rem; flex:1; display:flex; flex-direction:column; background:#fff; border-top:1px solid var(--border); }
.product-meta { display:flex; justify-content:space-between; align-items:center; margin-bottom:.25rem; gap:.25rem; }
.product-brand { font-size:.62rem; font-weight:700; color:var(--accent); text-transform:uppercase; }
.product-sku { font-size:.6rem; color:var(--text-muted); font-family:monospace; background:#f1f5f9; padding:2px 4px; border-radius:4px; }
.product-title { font-size:.85rem; font-weight:600; line-height:1.3; margin-bottom:.2rem; color:var(--text); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.6em; }
.ordering-box { margin-top:auto; display:flex; flex-direction:column; gap:.28rem; padding-top:.55rem; border-top:1px solid var(--border); }
.price-label { font-size:.58rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:#059669; }
.current-price-inline { font-size:.92rem; font-weight:800; color:var(--accent); }
.current-price-inline.is-sale { color:#dc2626; }
.old-price-inline { font-size:.72rem; color:var(--text-muted); text-decoration:line-through; margin-right:.25rem; }
.price-locked { font-size:.85rem; color:var(--text-muted); background:var(--bg-alt); padding:.6rem .75rem; border-radius:4px; text-align:center; margin-top:auto; }
.price-locked button { background:none; border:none; color:var(--accent); font-weight:600; text-decoration:underline; cursor:pointer; font-family:inherit; }
.order-controls { display:flex; gap:.25rem; align-items:flex-end; }
.qty-control, .unit-control { display:flex; flex-direction:column; gap:2px; }
.order-controls .qty-input,
.order-controls .unit-select {
  height:30px;
  min-height:30px;
  max-height:30px;
  padding:0 .35rem;
  border:1px solid var(--border);
  border-radius:5px;
  font-size:.8rem;
  font-weight:600;
  font-family:inherit;
  line-height:28px;
  box-sizing:border-box;
  color:var(--text);
}
.order-controls .qty-input {
  width:48px;
  text-align:center;
  -moz-appearance:textfield;
  appearance:textfield;
}
.order-controls .qty-input::-webkit-outer-spin-button,
.order-controls .qty-input::-webkit-inner-spin-button {
  -webkit-appearance:none;
  margin:0;
}
.order-controls .unit-select {
  flex:1;
  min-width:0;
  padding-right:1.1rem;
  cursor:pointer;
  appearance:none;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23475569'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") no-repeat right .3rem center;
  background-size:.65rem;
}
.add-to-cart { width:100%; background:var(--primary); color:#fff; border:none; padding:.42rem .5rem; border-radius:4px; font-size:.75rem; font-weight:600; cursor:pointer; font-family:inherit; margin-top:.1rem; }
.add-to-cart:hover { background:var(--accent); }
.pagination-bar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.75rem; padding:.75rem 0; border-top:1px solid var(--border); }
.pg-btn { min-width:34px; height:34px; padding:0 .5rem; border:1px solid var(--border); border-radius:var(--radius); background:#fff; color:var(--text); font-size:.82rem; font-weight:600; cursor:pointer; font-family:inherit; display:inline-flex; align-items:center; justify-content:center; }
.pg-btn.active { background:var(--accent); border-color:var(--accent); color:#fff; }
.pg-btn:disabled { opacity:.35; cursor:not-allowed; }
.alert-flash { max-width:var(--container); margin:1rem auto 0; padding:.75rem 1rem; border-radius:var(--radius); font-size:.875rem; }
.alert-flash.success { background:#dcfce7; color:#166534; border:1px solid #bbf7d0; }
.alert-flash.error { background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }

/* Product detail */
.product-detail-page { padding-bottom:5rem; }
.product-detail-layout { display:grid; grid-template-columns:minmax(280px,2fr) minmax(320px,3fr); gap:2rem; padding:2rem 0 3rem; align-items:start; }
.product-detail-left { position:sticky; top:calc(var(--header-height) + 1rem); display:flex; flex-direction:column; gap:.75rem; }
.detail-gallery-main { background:#fff; border-radius:1rem; padding:.25rem; border:1px solid var(--border); box-shadow:var(--shadow-sm); aspect-ratio:1/1; max-height:min(60vh,520px); overflow:hidden; position:relative; display:flex; align-items:center; justify-content:center; cursor:zoom-in; }
.detail-gallery-main .image-badge-sale { position:absolute; bottom:12px; right:12px; z-index:5; }
.detail-gallery-main img { width:100%; height:100%; object-fit:contain; border-radius:.5rem; transition:transform .4s ease; }
.detail-gallery-main:hover img { transform:scale(1.04); }
.detail-gallery-placeholder { font-size:.875rem; color:var(--text-muted); padding:1rem; text-align:center; }
.detail-gallery-thumbs { display:flex; gap:.5rem; flex-wrap:wrap; }
.detail-gallery-thumb { width:52px; height:52px; border-radius:8px; overflow:hidden; border:2px solid transparent; background:var(--bg-alt); cursor:pointer; transition:border-color .2s,box-shadow .2s; flex-shrink:0; padding:0; }
.detail-gallery-thumb:hover { border-color:var(--border); }
.detail-gallery-thumb.active { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
.detail-gallery-thumb img { width:100%; height:100%; object-fit:contain; }
.product-detail-right { min-width:0; }
.detail-meta { display:flex; justify-content:space-between; align-items:center; margin-bottom:.5rem; gap:1rem; }
.detail-brand { font-size:.95rem; font-weight:800; color:var(--accent); text-transform:uppercase; letter-spacing:1px; }
.detail-ean { font-size:.82rem; color:var(--text-muted); letter-spacing:.5px; }
.detail-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin:.25rem 0 1rem; }
.detail-title { font-size:clamp(1.3rem,3.5vw,2.2rem); font-weight:800; line-height:1.1; flex:1; min-width:0; margin:0; }
.detail-price-block { background:linear-gradient(135deg,rgba(248,250,252,.9),rgba(241,245,249,.7)); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.25rem 1.5rem; margin-bottom:1.5rem; backdrop-filter:blur(8px); }
.detail-price-block .price-label { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:#059669; display:block; margin-bottom:.35rem; }
.detail-price-block .price-value { font-size:2rem; font-weight:800; color:var(--text); line-height:1; }
.detail-price-block .price-value.is-sale { color:#dc2626; }
.detail-price-block .price-value .old-price-inline { font-size:1rem; color:var(--text-muted); text-decoration:line-through; margin-right:.35rem; }
.detail-price-block .price-value small { font-size:.9rem; font-weight:500; color:var(--text-muted); }
.price-locked-detail { font-size:.95rem; color:var(--text-muted); text-align:center; padding:.5rem; }
.price-locked-detail button { background:none; border:none; color:var(--accent); font-weight:600; text-decoration:underline; cursor:pointer; font-family:inherit; }
.detail-description { margin:1.5rem 0; }
.detail-description h3 { font-size:1.1rem; font-weight:700; margin-bottom:.6rem; color:var(--text); }
.detail-description p { color:var(--text-muted); line-height:1.7; font-size:.95rem; margin:0; }
.detail-ordering-box { background:rgba(255,255,255,.7); backdrop-filter:blur(12px); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.5rem; margin-top:1.5rem; }
.detail-ordering-box h3 { font-size:1rem; font-weight:700; margin-bottom:1rem; color:var(--text); }
.detail-ordering-login { text-align:center; padding:1.5rem; }
.detail-ordering-login p { color:var(--text-muted); margin-bottom:1rem; }
.order-row { display:flex; gap:.875rem; align-items:flex-end; margin-bottom:.875rem; flex-wrap:wrap; }
.order-field { display:flex; flex-direction:column; gap:.35rem; }
.order-field-grow { flex:1; min-width:160px; }
.order-field label { font-size:.72rem; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:.06em; }
.qty-input-lg { width:90px; height:42px; padding:.5rem .75rem; border:1.5px solid var(--border); border-radius:var(--radius); text-align:center; font-size:1rem; font-weight:700; color:var(--text); font-family:inherit; transition:border-color .2s; }
.qty-input-lg:focus { border-color:var(--accent); outline:none; }
.unit-select-lg { height:42px; padding:0 2rem 0 .75rem; min-width:160px; border:1.5px solid var(--border); border-radius:var(--radius); font-size:.9rem; font-weight:600; color:var(--text); background:#fff; font-family:inherit; cursor:pointer; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23475569'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .75rem center; background-size:.875rem; transition:border-color .2s; }
.unit-select-lg:focus { border-color:var(--accent); outline:none; }
.detail-price-preview { background:rgba(37,99,235,.05); border:1px solid rgba(37,99,235,.15); border-radius:var(--radius); padding:.75rem 1rem; margin-bottom:1rem; display:flex; justify-content:space-between; align-items:center; }
.detail-price-preview span { font-size:.85rem; color:var(--text-muted); }
.detail-price-preview strong { font-size:1.25rem; font-weight:800; color:var(--accent); }
.btn-add-to-cart-lg { width:100%; background:var(--primary); color:#fff; border:none; padding:.875rem 1.5rem; border-radius:var(--radius); font-size:1rem; font-weight:700; cursor:pointer; font-family:inherit; transition:var(--tf); display:flex; align-items:center; justify-content:center; gap:.5rem; }
.btn-add-to-cart-lg:hover { background:var(--accent); }
.btn-add-to-cart-lg svg { width:20px; height:20px; }
.pack-info { margin-top:1.25rem; display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; }
.pack-item { background:var(--bg-alt); border:1px solid var(--border); border-radius:var(--radius); padding:.75rem; text-align:center; }
.pack-item-val { font-size:1.25rem; font-weight:800; color:var(--primary); }
.pack-item-label { font-size:.7rem; color:var(--text-muted); font-weight:500; margin-top:.15rem; }
.technical-section { margin-top:2rem; }
.technical-section h3 { font-size:1.1rem; font-weight:700; margin-bottom:1rem; padding-bottom:.6rem; border-bottom:2px solid var(--border); color:var(--text); }
.technical-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.5rem 1.5rem; }
.tech-item { display:flex; justify-content:space-between; align-items:baseline; padding:.4rem 0; border-bottom:1px solid var(--bg-alt); font-size:.875rem; gap:.5rem; }
.tech-item strong { color:var(--text-muted); font-weight:500; flex-shrink:0; }
.tech-item span { font-weight:600; color:var(--text); text-align:right; }
.tech-stock-ok { color:#059669; }
.tech-stock-low { color:#dc2626; }
.related-section { margin-top:3rem; }
.related-section h2 { font-size:1.3rem; font-weight:700; margin-bottom:1.25rem; color:var(--text); }
.related-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; }
.related-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; transition:var(--tf); text-decoration:none; color:inherit; display:block; }
.related-card:hover { border-color:var(--accent); box-shadow:var(--shadow); transform:translateY(-2px); }
.related-card-img { aspect-ratio:1/1; overflow:hidden; background:var(--bg-alt); }
.related-card-img img { width:100%; height:100%; object-fit:contain; padding:5px; transition:transform .3s; }
.related-card:hover .related-card-img img { transform:scale(1.05); }
.related-card-body { padding:.75rem; }
.related-card-brand { font-size:.6rem; font-weight:700; color:var(--accent); text-transform:uppercase; margin-bottom:.25rem; }
.related-card-title { font-size:.78rem; font-weight:600; color:var(--text); line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.related-card-price { font-size:.88rem; font-weight:800; color:var(--accent); margin-top:.4rem; }
.lightbox-overlay { position:fixed; inset:0; background:rgba(0,0,0,.88); z-index:9999; display:none; align-items:center; justify-content:center; padding:1.5rem; }
.lightbox-overlay.open { display:flex; }
.lightbox-content { position:relative; max-width:min(90vw,800px); max-height:90vh; display:flex; align-items:center; justify-content:center; }
.lightbox-content img { max-width:100%; max-height:90vh; object-fit:contain; border-radius:.75rem; box-shadow:0 20px 60px rgba(0,0,0,.5); }
.lightbox-close { position:absolute; top:-2.5rem; right:0; background:rgba(255,255,255,.15); border:none; color:#fff; width:38px; height:38px; border-radius:50%; cursor:pointer; font-size:1.4rem; display:flex; align-items:center; justify-content:center; transition:var(--tf); }
.lightbox-close:hover { background:rgba(255,255,255,.25); }
.lightbox-prev, .lightbox-next { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.15); border:none; color:#fff; width:44px; height:44px; border-radius:50%; cursor:pointer; font-size:1.4rem; display:flex; align-items:center; justify-content:center; transition:var(--tf); }
.lightbox-prev:hover, .lightbox-next:hover { background:rgba(255,255,255,.25); }
.lightbox-prev { left:-3.5rem; }
.lightbox-next { right:-3.5rem; }
@media (max-width:900px) {
  .product-detail-layout { grid-template-columns:1fr; }
  .product-detail-left { position:static; }
  .related-grid { grid-template-columns:repeat(3,1fr); }
  .technical-grid { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .related-grid { grid-template-columns:repeat(2,1fr); }
  .lightbox-prev { left:-2rem; }
  .lightbox-next { right:-2rem; }
}

/* Cart */
.cart-page { padding:2rem 0 6rem; }
.checkout-stepper {
  display:flex; align-items:center; justify-content:center;
  gap:0; margin-bottom:2.5rem; overflow-x:auto; scrollbar-width:none;
}
.checkout-stepper::-webkit-scrollbar { display:none; }
.step { display:flex; flex-direction:column; align-items:center; gap:.4rem; position:relative; flex-shrink:0; }
.step-num {
  width:36px; height:36px; border-radius:50%; border:2px solid var(--border); background:#fff;
  display:flex; align-items:center; justify-content:center; font-size:.82rem; font-weight:800;
  color:var(--text-muted); position:relative; z-index:1; transition:all .2s;
}
.step.active .step-num, .step.done .step-num { background:var(--accent); border-color:var(--accent); color:#fff; }
.step-label { font-size:.72rem; font-weight:600; color:var(--text-muted); white-space:nowrap; }
.step.active .step-label, .step.done .step-label { color:var(--accent); }
.step-line { flex:1; height:2px; background:var(--border); min-width:40px; max-width:80px; margin:0 .25rem; margin-bottom:1.4rem; flex-shrink:0; }
.step-line.done { background:var(--accent); }
.cart-header { margin-bottom:1.5rem; }
.cart-back-link { margin-bottom:.75rem; }
.cart-title-row { display:flex; align-items:center; gap:.75rem; margin-bottom:.25rem; }
.cart-title { font-size:1.5rem; font-weight:800; letter-spacing:-.02em; margin:0; }
.cart-count-badge {
  font-size:.82rem; font-weight:700; color:var(--text-muted); background:var(--bg-alt);
  border:1px solid var(--border); padding:.15rem .65rem; border-radius:999px;
}
.cart-layout { display:grid; grid-template-columns:1fr 340px; gap:1.5rem; align-items:start; }
.cart-items-list { display:flex; flex-direction:column; gap:1rem; }
.cart-item-row {
  background:#fff; border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.25rem;
  display:grid; grid-template-columns:110px 1fr; gap:1.25rem; position:relative;
  box-shadow:0 1px 4px rgba(0,0,0,.04); transition:box-shadow .2s, border-color .2s;
  animation:cartSlideUp .3s ease-out both; animation-delay:calc(var(--i,0)*.05s);
}
@keyframes cartSlideUp { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }
.cart-item-row:hover { box-shadow:0 6px 20px rgba(0,0,0,.08); border-color:var(--accent); }
.cart-item-img-wrap { width:110px; height:110px; border-radius:var(--radius); overflow:hidden; background:var(--bg-alt); }
.cart-item-img-wrap a { display:block; width:100%; height:100%; }
.cart-item-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.cart-item-row:hover .cart-item-img-wrap img { transform:scale(1.04); }
.cart-remove-form { position:absolute; top:-10px; right:-10px; margin:0; z-index:10; }
.btn-remove-item {
  background:#ef4444; border:3px solid #fff; width:30px; height:30px; border-radius:50%; color:#fff;
  display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all .2s; padding:0;
  box-shadow:0 3px 8px rgba(239,68,68,.3);
}
.btn-remove-item:hover { background:#dc2626; transform:scale(1.1) rotate(90deg); }
.btn-remove-item svg { width:13px; height:13px; pointer-events:none; }
.cart-item-info { display:flex; flex-direction:column; justify-content:space-between; min-width:0; }
.cart-item-info-top { margin-bottom:.6rem; }
.cart-item-brand { font-size:.72rem; font-weight:700; color:var(--accent); text-transform:uppercase; letter-spacing:.05em; margin-bottom:.25rem; }
.cart-item-title { font-size:1rem; font-weight:700; color:var(--text); line-height:1.3; margin:0 0 .2rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.cart-item-title a { color:inherit; text-decoration:none; }
.cart-item-title a:hover { color:var(--accent); }
.cart-item-sku { font-size:.72rem; color:var(--text-muted); font-family:monospace; }
.item-total-row { display:flex; justify-content:space-between; align-items:center; padding-top:.6rem; border-top:1px solid var(--border); flex-wrap:wrap; gap:.5rem; }
.item-total-label { font-size:.8rem; color:var(--text-muted); }
.item-total-price { font-size:1.2rem; font-weight:900; color:var(--text); }
.cart-empty { text-align:center; padding:5rem 1rem; background:#fff; border:1px solid var(--border); border-radius:var(--radius-lg); }
.cart-empty-icon { font-size:3.5rem; margin-bottom:1rem; opacity:.5; }
.cart-empty h2 { font-size:1.3rem; font-weight:800; margin-bottom:.5rem; }
.cart-empty p { font-size:.9rem; color:var(--text-muted); margin-bottom:1.5rem; }
.btn-shop { background:var(--accent); color:#fff; border:none; padding:.75rem 2rem; border-radius:var(--radius); font-size:.9rem; font-weight:700; cursor:pointer; font-family:inherit; transition:all .2s; text-decoration:none; display:inline-block; }
.btn-shop:hover { background:var(--accent-hover); transform:translateY(-1px); color:#fff; }
.summary-card-sticky {
  position:sticky; top:calc(var(--header-height) + 1rem); background:#fff; border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:1.5rem; box-shadow:0 2px 8px rgba(0,0,0,.05);
}
.summary-card-sticky h3 { font-size:1.1rem; font-weight:800; text-align:center; margin:0 0 1.25rem; }
.summary-details { display:flex; flex-direction:column; gap:.75rem; }
.summary-line { display:flex; justify-content:space-between; align-items:center; font-size:.9rem; }
.summary-line.muted, .summary-shipping-hint { color:var(--text-muted); font-size:.85rem; }
.summary-shipping-hint { font-size:.75rem; }
.summary-divider { height:1px; background:var(--border); margin:.25rem 0; }
.summary-total-row { display:flex; justify-content:space-between; align-items:baseline; padding-top:.5rem; border-top:2px solid var(--border); margin-top:.25rem; }
.summary-total-label { font-size:.9rem; font-weight:700; }
.summary-total-val { font-size:1.75rem; font-weight:900; color:var(--text); }
.summary-vat { font-size:.75rem; color:var(--text-muted); text-align:right; margin-top:.2rem; }
.text-success-bold { color:#059669; font-weight:700; }
.cart-note-block { margin-top:1.25rem; padding:.875rem; border:1px solid var(--border); border-radius:var(--radius); background:var(--bg-alt); }
.cart-note-label { display:block; font-size:.75rem; font-weight:700; color:var(--text); margin-bottom:.4rem; }
.cart-note-input {
  width:100%; min-height:80px; resize:vertical; border:1px solid var(--border); border-radius:var(--radius-sm);
  padding:.5rem .75rem; font-size:.85rem; font-family:inherit; color:var(--text); background:#fff; line-height:1.5;
}
.cart-note-input:focus { outline:none; border-color:var(--accent); }
.cart-note-input::placeholder { color:var(--text-muted); }
.cart-note-counter { font-size:.7rem; color:var(--text-muted); text-align:right; margin-top:.3rem; }
.checkout-form { margin:0; }
.summary-actions { display:flex; flex-direction:column; gap:.75rem; margin-top:1.5rem; }
.btn-checkout-primary {
  width:100%; background:var(--accent); color:#fff; border:none; padding:.875rem 1.5rem; border-radius:var(--radius);
  font-size:.95rem; font-weight:700; display:flex; align-items:center; justify-content:center; gap:.5rem;
  cursor:pointer; font-family:inherit; box-shadow:0 4px 12px rgba(37,99,235,.2); transition:all .2s;
}
.btn-checkout-primary:hover { background:var(--accent-hover); transform:translateY(-1px); box-shadow:0 6px 18px rgba(37,99,235,.3); }
.btn-checkout-primary svg { width:18px; height:18px; flex-shrink:0; }
.btn-continue-shopping { text-align:center; color:var(--text-muted); font-size:.875rem; font-weight:600; text-decoration:none; display:block; transition:color .2s; }
.btn-continue-shopping:hover { color:var(--accent); }
.trust-badges { margin-top:1.5rem; padding-top:1.25rem; border-top:1px solid var(--border); display:flex; flex-direction:column; gap:.6rem; }
.trust-item { display:flex; align-items:center; gap:.6rem; font-size:.78rem; color:var(--text-muted); }
.trust-item svg { width:16px; height:16px; color:var(--accent); flex-shrink:0; }
.cart-success-banner { margin-bottom:1.5rem; }
@media (max-width:900px) {
  .cart-layout { grid-template-columns:1fr; }
  .summary-card-sticky { position:static; order:-1; }
}
@media (max-width:600px) {
  .cart-item-row { grid-template-columns:80px 1fr; gap:.875rem; padding:1rem; }
  .cart-item-img-wrap { width:80px; height:80px; }
  .cart-title { font-size:1.25rem; }
}

/* Profile */
.profile-page { max-width:1100px; margin:0 auto; padding:2rem clamp(.75rem,3vw,1.5rem) 5rem; }
.profile-back-link { margin-bottom:1.5rem; display:inline-flex; align-items:center; gap:.5rem; }
.profile-grid { display:grid; grid-template-columns:260px 1fr; gap:1.5rem; align-items:start; }
.profile-sidebar { position:sticky; top:calc(var(--header-height) + 1rem); display:flex; flex-direction:column; gap:.75rem; }
.profile-card { background:var(--surface,#fff); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.5rem; text-align:center; }
.profile-avatar-lg { width:72px; height:72px; border-radius:50%; background:linear-gradient(135deg,var(--accent),#3b82f6); color:#fff; font-size:1.75rem; font-weight:800; display:flex; align-items:center; justify-content:center; margin:0 auto 1rem; }
.profile-name { font-size:1.1rem; font-weight:800; color:var(--text); margin-bottom:.25rem; }
.profile-email { font-size:.82rem; color:var(--text-muted); margin-bottom:1rem; }
.profile-badge { display:inline-flex; align-items:center; gap:.35rem; font-size:.72rem; font-weight:700; padding:.25rem .75rem; background:#dcfce7; color:#166534; border:1px solid #bbf7d0; border-radius:999px; }
.profile-badge-dot { width:6px; height:6px; border-radius:50%; background:#16a34a; }
.profile-nav { background:var(--surface,#fff); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; }
.profile-nav-item { display:flex; align-items:center; gap:.75rem; padding:.875rem 1.25rem; font-size:.9rem; font-weight:500; color:var(--text2,#565959); cursor:pointer; transition:all var(--tf); border:none; background:none; width:100%; text-align:left; font-family:inherit; border-bottom:1px solid var(--border); }
.profile-nav-item:last-child { border-bottom:none; }
.profile-nav-item:hover { background:var(--bg-alt); color:var(--accent); }
.profile-nav-item.active { background:rgba(37,99,235,.06); color:var(--accent); font-weight:700; border-left:3px solid var(--accent); }
.profile-nav-item svg { width:17px; height:17px; flex-shrink:0; opacity:.7; }
.profile-nav-item.active svg { opacity:1; }
.profile-logout-form { margin:0; }
.btn-logout { width:100%; padding:.75rem; border:1.5px solid #fee2e2; border-radius:var(--radius); background:#fff5f5; color:#dc2626; font-size:.875rem; font-weight:600; cursor:pointer; font-family:inherit; display:flex; align-items:center; justify-content:center; gap:.5rem; transition:all var(--tf); }
.btn-logout:hover { background:#fef2f2; border-color:#fca5a5; }
.profile-panel { display:none; }
.profile-panel.active { display:block; }
.panel-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.5rem; padding-bottom:1rem; border-bottom:1px solid var(--border); }
.btn-export-excel { display:inline-flex; align-items:center; gap:.45rem; padding:.5rem .875rem; border:1.5px solid #bbf7d0; border-radius:var(--radius); background:#f0fdf4; color:#15803d; font-size:.82rem; font-weight:700; text-decoration:none; transition:all var(--tf); flex-shrink:0; }
.btn-export-excel:hover { background:#dcfce7; border-color:#86efac; color:#166534; }
.btn-export-excel svg { width:18px; height:18px; }
.panel-title { font-size:1.25rem; font-weight:800; color:var(--text); letter-spacing:-.02em; }
.panel-sub { font-size:.82rem; color:var(--text-muted); margin-top:.2rem; }
.info-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1.5rem; }
.profile-security-grid { grid-template-columns:1fr; }
.info-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.25rem; }
.info-card-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem; }
.info-card-title { font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); }
.info-row { display:flex; flex-direction:column; gap:.1rem; margin-bottom:.875rem; }
.info-row:last-child { margin-bottom:0; }
.info-label { font-size:.72rem; color:var(--text-muted); font-weight:500; }
.info-value { font-size:.9rem; color:var(--text); font-weight:600; }
.info-value.empty { color:var(--text-muted); font-style:italic; font-weight:400; }
.address-default-badge { background:#dbeafe; color:#1e40af; font-size:.65rem; padding:2px 7px; border-radius:999px; margin-left:.35rem; }
.stats-row { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:1.5rem; }
.stat-card { background:var(--surface,#fff); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.25rem; text-align:center; }
.stat-val { font-size:1.75rem; font-weight:800; color:var(--primary); line-height:1; margin-bottom:.3rem; }
.stat-val.accent { color:var(--accent); }
.stat-label { font-size:.72rem; color:var(--text-muted); font-weight:500; }
.orders-wrap { background:var(--surface,#fff); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; margin-bottom:1rem; }
.orders-table { width:100%; border-collapse:collapse; font-size:.875rem; }
.orders-table th { padding:.875rem 1.25rem; text-align:left; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); background:var(--bg-alt); border-bottom:1px solid var(--border); }
.orders-table td { padding:.875rem 1.25rem; border-bottom:1px solid var(--border); vertical-align:middle; }
.orders-table tr:last-child td { border-bottom:none; }
.orders-table tr:hover td { background:rgba(37,99,235,.02); }
.order-id { font-weight:700; color:var(--accent); font-family:monospace; font-size:.82rem; }
.order-date { color:var(--text-muted); font-size:.82rem; }
.order-items { font-size:.82rem; color:var(--text-muted); }
.order-total { font-weight:800; color:var(--text); }
.order-status { display:inline-flex; align-items:center; gap:.35rem; padding:.25rem .75rem; border-radius:999px; font-size:.72rem; font-weight:700; white-space:nowrap; }
.status-delivered { background:#dcfce7; color:#166534; }
.status-processing { background:#dbeafe; color:#1e40af; }
.status-shipped { background:#fef9c3; color:#854d0e; }
.status-cancelled { background:#fee2e2; color:#991b1b; }
.profile-status-inline { font-size:.72rem; padding:.15rem .6rem; }
.btn-order-detail { font-size:.75rem; font-weight:600; color:var(--accent); background:none; border:1px solid var(--border); cursor:pointer; font-family:inherit; padding:4px 8px; border-radius:var(--radius-sm); transition:all var(--tf); }
.btn-order-detail:hover { border-color:var(--accent); background:var(--bg-alt); }
.order-detail-overlay { position:fixed; inset:0; background:rgba(0,0,0,.45); backdrop-filter:blur(4px); z-index:600; display:none; align-items:center; justify-content:center; padding:1rem; }
.order-detail-overlay.open { display:flex; }
.order-detail-box { background:#fff; border-radius:var(--radius-lg); width:100%; max-width:600px; max-height:90vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,.2); position:relative; }
.order-detail-head { padding:1.5rem; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:flex-start; position:sticky; top:0; background:#fff; z-index:1; }
.order-detail-head h3 { font-size:1.1rem; font-weight:800; margin-bottom:.2rem; }
.order-detail-head p { font-size:.82rem; color:var(--text-muted); }
.order-detail-close { background:var(--bg-alt); border:none; color:var(--text-muted); width:30px; height:30px; border-radius:50%; cursor:pointer; font-size:1.2rem; display:flex; align-items:center; justify-content:center; transition:var(--tf); flex-shrink:0; }
.order-detail-close:hover { background:var(--border); }
.order-detail-body { padding:1.5rem; }
.order-items-list { display:flex; flex-direction:column; gap:.75rem; margin-bottom:1.5rem; }
.order-item-row { display:grid; grid-template-columns:48px 1fr auto; gap:.75rem; align-items:center; padding:.75rem; background:var(--bg-alt); border-radius:var(--radius); }
.order-item-img { width:48px; height:48px; object-fit:cover; border-radius:var(--radius-sm); border:1px solid var(--border); }
.order-item-info { min-width:0; }
.order-item-name { font-size:.85rem; font-weight:700; color:var(--text); margin-bottom:.15rem; line-height:1.3; }
.order-item-meta { font-size:.72rem; color:var(--text-muted); }
.order-item-price { font-size:.88rem; font-weight:800; color:var(--text); white-space:nowrap; }
.order-summary { border-top:1px solid var(--border); padding-top:1rem; }
.order-sum-row { display:flex; justify-content:space-between; font-size:.875rem; margin-bottom:.5rem; color:var(--text-muted); }
.order-sum-row.total { color:var(--text); font-weight:800; font-size:1rem; margin-top:.5rem; padding-top:.5rem; border-top:1px solid var(--border); }
.empty-state { text-align:center; padding:4rem 1rem; }
.empty-state-icon { font-size:3rem; margin-bottom:1rem; opacity:.5; }
.empty-state h3 { font-size:1.1rem; font-weight:700; margin-bottom:.5rem; }
.empty-state p { font-size:.875rem; color:var(--text-muted); margin-bottom:1.5rem; }
.profile-shop-link { padding:.75rem 2rem; display:inline-block; text-decoration:none; }
.profile-note { font-size:.875rem; color:var(--text-muted); margin:0; }

@media (max-width:900px) {
  .profile-grid { grid-template-columns:1fr; }
  .profile-sidebar { position:static; }
  .stats-row { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:600px) {
  .orders-table { font-size:.8rem; }
  .orders-table th, .orders-table td { padding:.625rem .875rem; }
}

@media (max-width:1024px) {
  .shop-layout, .product-detail-layout, .cart-layout, .profile-grid { grid-template-columns:1fr; }
  .filters-sidebar { position:static; max-height:none; }
  .product-grid { grid-template-columns:repeat(4,1fr); }
  .profile-sidebar { position:static; }
}
@media (max-width:767px) { .product-grid { grid-template-columns:repeat(3,1fr); } .info-grid { grid-template-columns:1fr; } }
@media (max-width:479px) { .product-grid { grid-template-columns:repeat(2,1fr); } }
