/* =============================
   Product Detail Media (pd-media2)
   ============================= */

.pd-media2{
  display:grid;
  grid-template-columns:72px minmax(0,1fr);
  gap:16px;
  align-items:start;
}

.pd-media2__thumbs{
  display:flex;
  flex-direction:column;
  gap:10px;
  max-height:720px;
  overflow:auto;
  padding-right:4px;
  scrollbar-width:thin;
}
main {
    margin-bottom: 40px;
}
.pd-media2__thumb{
  width:72px;
  height:72px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:10px;
  background:#fff;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  cursor:pointer;
}
.pd-media2__thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.pd-media2__thumb.is-active{
  border-color:rgba(0,0,0,.55);
}

.pd-media2__thumb--video{
  position:relative;
  background:#f3f4f6;
}
.pd-media2__play{
  width:38px;
  height:38px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.75);
  color:#fff;
  font-size:14px;
}

.pd-media2__stage{ min-width:0; }

.pd-media2__main{
  position:relative;
  border-radius:14px;
  overflow:hidden;
  background:#f6f7f9;
  border:1px solid rgba(0,0,0,.08);
}
.pd-media2__main img{
  width:100%;
  height:auto;
  display:block;
  max-height:760px;
  object-fit:contain;
}

.pd-media2__soldout{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  letter-spacing:.3px;
  background:rgba(255,255,255,.78);
  backdrop-filter:saturate(1.2) blur(2px);
}

.pd-media2__counter{
  position:absolute;
  left:12px;
  bottom:12px;
  padding:6px 10px;
  font-size:12px;
  border-radius:999px;
  background:rgba(0,0,0,.65);
  color:#fff;
}

.pd-media2__nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:40px;
  height:40px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.12);
  background:rgba(255,255,255,.9);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
  line-height:1;
}
.pd-media2__prev{ left:12px; }
.pd-media2__next{ right:12px; }

.pd-media2__tools{
  position:absolute;
  right:12px;
  top:12px;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.pd-media2__tool{
  width:40px;
  height:40px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.12);
  background:rgba(255,255,255,.92);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
}

.pd-media2__video{
  margin-bottom:14px;
  border-radius:14px;
  overflow:hidden;
  background:#000;
  border:1px solid rgba(0,0,0,.08);
}
.pd-media2__video video,
.pd-media2__video iframe{
  width:100%;
  height:520px;
  display:block;
}
.pd-media2__frame{ position:relative; padding-top:56.25%; }
.pd-media2__frame iframe{ position:absolute; inset:0; width:100%; height:100%; }
.pd-media2__video.is-hidden{ display:none; }

/* Lightbox */
.pd-lightbox{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.86);
  display:none;
  z-index:9999;
}
.pd-lightbox.is-open{ display:block; }
.pd-lightbox__stage{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px;
}
.pd-lightbox__stage img{
  max-width:92vw;
  max-height:92vh;
  object-fit:contain;
}
.pd-lightbox__close{
  position:absolute;
  top:14px;
  right:14px;
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:26px;
  cursor:pointer;
}
.pd-lightbox__nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:52px;
  height:52px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:28px;
  cursor:pointer;
}
.pd-lightbox__prev{ left:14px; }
.pd-lightbox__next{ right:14px; }

/* Responsive */
@media (max-width: 768px){
  .pd-media2{
    grid-template-columns:1fr;
    gap:12px;
  }
  .pd-media2__thumbs{
    flex-direction:row;
    max-height:none;
    overflow:auto;
    padding-right:0;
  }
  .pd-media2__thumb{
    width:64px;
    height:64px;
    border-radius:12px;
    flex:0 0 auto;
  }
  .pd-media2__video video,
  .pd-media2__video iframe{ height:240px; }
}


/* Free Shipping Bar (plugin) */
.fsbar{max-width:1180px;margin:10px auto 0;padding:10px 14px;border:1px solid rgba(17,24,39,.12);border-radius:14px;background:rgba(255,255,255,.85);backdrop-filter:saturate(180%) blur(10px)}
.fsbar__text{font-size:14px;line-height:1.35;color:#111827}
.fsbar__track{margin-top:8px;height:8px;border-radius:999px;background:rgba(17,24,39,.10);overflow:hidden}
.fsbar__fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#111827,#2563eb)}
@media (max-width: 600px){.fsbar{margin:8px 12px 0}}
/* =========================
   BASE
========================= */
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;
  margin:0;
  background:#f6f7fb;
  color:#111;
}

html {
  overflow-y: scroll;
  overflow-x: hidden;
  scrollbar-gutter: stable;
}

* {
  scrollbar-width: thin;
  scrollbar-color: rgba(0,0,0,.35) transparent;
}

::-webkit-scrollbar {
  width: 5px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,.35);
  border-radius: 6px;
}
/* Variant Modal Styles */
#js-variant-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.variant-modal-content {
    background: white;
    border-radius: 16px;
    max-width: 800px;
    width: 100%;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.variant-modal-header {
    padding: 24px;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.variant-modal-title {
    font-size: 20px;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.variant-modal-subtitle {
    font-size: 14px;
    color: #6b7280;
    margin-top: 4px;
}

.variant-modal-close {
    background: none;
    border: none;
    font-size: 24px;
    color: #9ca3af;
    cursor: pointer;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.2s;
}

.variant-modal-close:hover {
    background: #f3f4f6;
    color: #374151;
}

.variant-modal-body {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
    display: flex;
    gap: 24px;
}

.variant-media {
    flex: 0 0 200px;
}

.variant-media-placeholder {
    width: 200px;
    height: 200px;
    background: #f9fafb;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #9ca3af;
}

.variant-media-placeholder svg {
    width: 64px;
    height: 64px;
    fill: #d1d5db;
}

.variant-product-image {
    width: 100%;
    height: 200px;
    object-fit: contain;
    border-radius: 12px;
    background: #f9fafb;
}

.variant-options-container {
    flex: 1;
}

.variant-attribute-group {
    margin-bottom: 24px;
}

.variant-attribute-group:last-child {
    margin-bottom: 0;
}

.variant-attribute-label {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.variant-required {
    color: #ef4444;
    font-size: 16px;
}

.variant-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.variant-option {
    border: 2px solid #e5e7eb;
    background: white;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    cursor: pointer;
    transition: all 0.2s;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.variant-option:hover:not(.selected) {
    border-color: #9ca3af;
    background: #f9fafb;
}

.variant-option.selected {
    border-color: #3b82f6;
    background: #eff6ff;
    color: #1e40af;
    font-weight: 600;
}

.variant-option.selected::after {
    content: "✓";
    position: absolute;
    top: 4px;
    right: 4px;
    background: #3b82f6;
    color: white;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    font-size: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Color options */
.variant-options--color .variant-option {
    padding: 0;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 2px solid transparent;
    position: relative;
}

.variant-options--color .variant-option .color-swatch {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 1px solid #e5e7eb;
}

.variant-options--color .variant-option .color-label {
    display: none;
}

.variant-options--color .variant-option.selected {
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

/* Size options */
.variant-options--size .variant-option {
    min-width: 44px;
    border-radius: 6px;
}

.variant-options--size .variant-option.selected {
    border-color: #3b82f6;
    background: #3b82f6;
    color: white;
}

.variant-no-options-msg {
    font-size: 13px;
    color: #9ca3af;
    font-style: italic;
    margin-top: 8px;
}

/* Loading & Error states */
.variant-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    color: #6b7280;
    gap: 12px;
}

.variant-loading .spinner {
    width: 20px;
    height: 20px;
    border: 2px solid #e5e7eb;
    border-top-color: #3b82f6;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.variant-error, .variant-no-options {
    padding: 40px;
    text-align: center;
    color: #6b7280;
}

.variant-modal-footer {
    padding: 24px;
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.variant-price-info {
    display: flex;
    align-items: center;
    gap: 12px;
}

.variant-price-current {
    font-size: 24px;
    font-weight: 600;
    color: #111827;
}

.variant-price-old {
    font-size: 16px;
    color: #9ca3af;
    text-decoration: line-through;
}

.variant-discount {
    background: #10b981;
    color: white;
    font-size: 12px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 12px;
}

.variant-stock {
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.variant-stock.in-stock {
    color: #10b981;
}

.variant-stock.out-of-stock {
    color: #ef4444;
}

.variant-qty-controls {
    display: flex;
    align-items: center;
    gap: 16px;
}

.variant-qty-selector {
    display: flex;
    align-items: center;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    overflow: hidden;
    background: white;
}

.variant-qty-btn {
    background: none;
    border: none;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #374151;
    cursor: pointer;
    font-size: 18px;
    transition: background 0.2s;
}

.variant-qty-btn:hover:not(:disabled) {
    background: #f3f4f6;
}

.variant-qty-btn:disabled {
    color: #9ca3af;
    cursor: not-allowed;
}

.variant-qty-input {
    width: 50px;
    height: 40px;
    border: none;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    color: #111827;
    background: transparent;
}

.variant-qty-input:focus {
    outline: none;
}

.variant-add-btn {
    background: #3b82f6;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 0 32px;
    height: 48px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    min-width: 160px;
}

.variant-add-btn:hover:not(:disabled) {
    background: #2563eb;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

.variant-add-btn:disabled {
    background: #9ca3af;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* Responsive */
@media (max-width: 768px) {
    .variant-modal-body {
        flex-direction: column;
        padding: 16px;
    }
    
    .variant-media {
        flex: 0 0 auto;
        width: 100%;
        text-align: center;
    }
    
    .variant-product-image,
    .variant-media-placeholder {
        width: 100%;
        max-width: 300px;
        margin: 0 auto;
    }
    
    .variant-modal-footer {
        flex-direction: column;
        gap: 16px;
    }
    
    .variant-price-info {
        width: 100%;
        justify-content: space-between;
    }
    
    .variant-qty-controls {
        width: 100%;
        justify-content: space-between;
    }
    
    .variant-add-btn {
        width: 100%;
    }
}

a{ color:inherit; text-decoration:none; }

.muted{ color:#666; font-size:13px; }

.row{ display:flex; gap:10px; align-items:center; }
.right{ margin-left:auto; position:relative; }

/* =========================
   CONTAINERS
========================= */
.row {
  margin-right: -15px;
  margin-left: -15px;
}
.row > * {
  padding-left: 15px;
  padding-right: 15px;
}
.pt_0 {
  padding-top: 0px !important;
}

.pt_20 {
  padding-top: 20px;
}

.pb_0 {
  padding-bottom: 0px !important;
}

.pr_0 {
  padding-right: 0px !important;
}

.py_8 {
  padding: 8px 0 !important;
}

.py_15 {
  padding: 15px 0;
}

.py_20 {
  padding: 20px 0;
}

.py_23 {
  padding: 23px 0 !important;
}

.pb_8 {
  padding-bottom: 8px;
}

.pb_15 {
  padding-bottom: 15px;
}

.pb_20 {
  padding-bottom: 20px;
}

.my_20 {
  margin: 20px 0px;
}

.mt_5 {
  margin-top: 5px;
}

.mt_3 {
  margin-top: 3px;
}

.mt_4 {
  margin-top: 4px;
}

.mt_8 {
  margin-top: 8px;
}

.mt_20 {
  margin-top: 20px;
}

.mt_37 {
  margin-top: 37px;
}

.mt_140 {
  margin-top: 140px;
}

.mb_4 {
  margin-bottom: 4px;
}

.mb_8 {
  margin-bottom: 8px;
}

.mb_6 {
  margin-bottom: 6px;
}

.mb_10 {
  margin-bottom: 10px;
}

.mb_12 {
  margin-bottom: 12px;
}

.mb_15 {
  margin-bottom: 15px;
}

.mb_16 {
  margin-bottom: 16px;
}

.mb_18 {
  margin-bottom: 18px;
}

.mb_20 {
  margin-bottom: 20px;
}

.mb_24 {
  margin-bottom: 24px !important;
}

.mb_30 {
  margin-bottom: 30px;
}

.mb_40 {
  margin-bottom: 40px;
}

.mb_32 {
  margin-bottom: 32px;
}

.mb_36 {
  margin-bottom: 36px;
}

.mb_60 {
  margin-bottom: 60px;
}

.mb_200 {
  margin-bottom: 200px;
}
ul,
li {
  list-style-type: none;
  margin-bottom: 0;
  padding-left: 0;
  list-style: none;
}

.container {
  max-width: 1320px;
}



.container {
  padding-left: 15px;
  padding-right: 15px;
}

.container-full4,
.container-full3,
.container-full2,
.container-full {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  padding: 0px 15px;
}

.container-full3 {
  padding: 0px 14px;
}

.container-full4 {
  padding: 0px 20px;
}


/* =========================
   BUTTONS / FORMS
========================= */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#111;
  color:#fff;
  border:0;
  border-radius:10px;
  padding:10px 12px;
  cursor:pointer;
}

.btn-outline{
  background:#fff;
  border:1px solid #c5c5c5;
color: #111 !important;
  color:#1f2937;
  font-weight:300;
}

input,select,textarea{
  padding:10px;
  border:1px solid #d9d9e3;
  border-radius:10px;
}

table{ width:100%; border-collapse:collapse; }
th,td{ padding:8px; border-bottom:1px solid #eee; text-align:left; }

/* =========================
   RESPONSIVE HELPERS
========================= */
.desktop-only{ display:inline-flex; }
.mobile-only{ display:none; }

@media (max-width:900px){
  .desktop-only{ display:none !important; }
  .mobile-only{ display:inline-flex !important; }
}

/* =========================
   HEADER (fixed transparent -> scroll black)
========================= */
.site-header{
  position:fixed;
  top:0; left:0; right:0;
  z-index:9998;
  background:transparent;
  transition:background .25s ease, box-shadow .25s ease, backdrop-filter .25s ease;
}

.site-header.is-scrolled{
  background:rgba(0,0,0,.92);
  backdrop-filter:blur(10px);
  box-shadow:0 12px 35px rgba(0,0,0,.28);
}

.site-header .container{
  max-width:1200px;
  margin:0 auto;
  padding:0 16px;
}

.site-header .top{
  min-height:64px;
  position:relative;
}

/* Desktop row: logo + categories + actions */
.site-header .header-desktop-row{
  height:64px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:14px;
}
.site-header .header-desktop-row .header-logo{ justify-self:start; }
.site-header .header-desktop-row .center-nav{ justify-self:center; }
.site-header .header-desktop-row .right.row{ justify-self:end; margin-left:0; }

/* Mobile row: burger left, logo centered, icons right */
.site-header .header-mobile-row{
  height:64px;
  display:flex;
  align-items:center;
  gap:10px;
}
.site-header .header-mobile-row .header-burger{ flex:0 0 auto; }
.site-header .header-mobile-row .header-logo{
  flex:1 1 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
}
.site-header .header-mobile-row .header-logo img{
  max-height:34px;
  width:120px;
}
.site-header .header-mobile-row .mobile-icons{ flex:0 0 auto; margin-left:0; }

@media (max-width:900px){
  .site-header .header-desktop-row{ display:none; }
}

@media (min-width:901px){
  .site-header .header-mobile-row{ display:none; }
}

/* Mobile header shortcuts (search + login) */
.mobile-icons{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:8px;
}
@media(min-width:901px){
  .mobile-icons{display:none;}
}

/* header fixed offset */



/* nav buttons */
.nav-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.22);
  transition:background .2s ease, color .2s ease, transform .2s ease;
}

.site-header a{ color:#ffffff; }
.site-header .nav-btn{ color:#ffffff; height:40px; padding:0 12px;  border:none; }

.site-header .nav-btn:hover{ background:rgba(0,0,0,.06); }

.site-header.is-scrolled a,
.site-header.is-scrolled .nav-btn{ color:#fff; }

.site-header.is-scrolled .nav-btn:hover{ background:rgba(255,255,255,.12); }

/* center nav */
.center-nav{
  flex:1;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  position:relative;
  min-width:240px;
}
.center-nav .nav-btn{ white-space:nowrap; }

@media(max-width:900px){
  .center-nav{ display:none; }
}

/* right row in header */
.site-header .right.row{
  display:flex;
  align-items:center;
  gap:10px;
  white-space:nowrap;
}
@media (max-width:900px){
  .site-header .right.row{ flex-wrap:wrap; gap:8px; }
}

/* svg icons in header */
.site-header a svg{
  width:22px;
  height:22px;
  flex:0 0 auto;
  stroke:currentColor;
}
@media (max-width:980px){
  .site-header a svg{ width:20px; height:20px; }
}
#js-cart-count{ font-weight:800; margin-left:4px; }
.site-header .nav-btn:hover svg{ transform:translateY(-1px); }

/* favorites icon button in header */
.site-header .icon-btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:999px;
}


.site-header .badge{
  position:absolute;
  right:-5px;
  top:-5px;
  min-width:18px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#ff2d55;
  color:#fff;
}

/* =========================
   MEGA MENU (single source)
========================= */
.site-header .mega{
  display:none;
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:calc(64px - 6px);
  width:min(1180px, calc(100vw - 24px));
  background:#fff;
  color:#111;
  border:1px solid rgba(0,0,0,.08);
  border-radius:18px;
  box-shadow:0 18px 50px rgba(0,0,0,.18);
  padding:14px;
  z-index:9999;
}

.site-header .mega .cols{
  display:grid;
  grid-template-columns:1fr 240px 240px;
  gap:16px;
  align-items:stretch;
}

.site-header .mega-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:16px;
}

.site-header .mega-h{
  display:block;
  font-weight:800;
  margin:4px 0 10px;
  color:#111 !important;
}

.site-header .mega-links a{
  display:block;
  padding:6px 0;
  color:#333;
}
.site-header .mega-links a:hover{
  color:#000;
  text-decoration:underline;
}


/* Mega menu cards (Style 1 modern) */
.site-header .mega-cards{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:18px;
}
.site-header .mega-card{
  display:block;
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  text-decoration:none;
  color:inherit;
}
.site-header .mega-card-img{
  height:120px;
  background:rgba(0,0,0,.04);
}
.site-header .mega-card-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.site-header .mega-card-ph{width:100%;height:100%;}
.site-header .mega-card-body{padding:12px 14px;}
.site-header .mega-card-title{font-weight:800;color:#111;margin-bottom:8px;}
.site-header .mega-card-links{display:flex;flex-direction:column;gap:6px;color:#6b7280;font-size:13px;}
.site-header .mega-card:hover{border-color:rgba(0,0,0,.12);}

.site-header .mega-divider{
  grid-column:1/-1;
  height:1px;
  background:rgba(0,0,0,.06);
  margin-top:8px;
}


.site-header .mega-brands{grid-column:1/-1; padding-top:12px;}
.site-header .mega-brands-panels{width:100%;}
.site-header .mega-brands-panel{display:flex;flex-wrap:wrap;gap:10px;}

.site-header .mega-brand{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.06);
  background:#fff;
  color:#111;
  text-decoration:none;
  font-size:13px;
}
.site-header .mega-brand-logo{
  width:26px;height:26px;border-radius:8px;
  overflow:hidden;
  background:rgba(0,0,0,.04);
  display:flex;align-items:center;justify-content:center;
  flex:0 0 auto;
}
.site-header .mega-brand-logo img{width:100%;height:100%;object-fit:contain;display:block;background:#fff;}
.site-header .mega-brand-ph{font-weight:800;color:#6b7280;font-size:13px;}
.site-header .mega-brand:hover{border-color:rgba(0,0,0,.12);}
.mega-media{
  position:relative;
  border-radius:14px;
  overflow:hidden;
  background:rgba(0,0,0,.04);
  height:100%;
  min-height:220px;
}
.mega-media img{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  height:100%;
  object-fit:cover;
  display:block;
}

/* Kategori görseli üstü yazılar */
.mega-overlay{
  position:absolute;
  left:12px;
  bottom:12px;
  right:12px;
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:12px;
  border-radius:12px;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(8px);
  border:1px solid rgba(0,0,0,.06);
}
.mega-overlay[aria-hidden="true"]{ display:none; }
.mega-ov-title{ font-weight:900; font-size:16px; color:#111; line-height:1.2; }
.mega-ov-desc{ font-size:13px; color:#333; line-height:1.35; }
.mega-ov-btn{
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:34px;
  padding:0 12px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,.12);
  background:transparent;
  color:#111;
  font-weight:800;
  text-decoration:none;
}
.mega-ov-btn:hover{ background:rgba(255,255,255,.95); }

/* promo */
.mega-promo{
  position:absolute;
  left:12px;
  bottom:12px;
  right:12px;
  display:block;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(8px);
  padding:12px 14px;
  border-radius:12px;
  color:#111;
  font-weight:800;
}
.mega-promo:hover{ background:#fff; }

/* ✅ resim yoksa sağ taraf komple gizle */
.mega-media.no-image{ display:none; }

@media (max-width:920px){
  .site-header .mega{ display:none !important; }
}

/* =========================
   OFFCANVAS (menu)
========================= */
.overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  z-index:9998;
}
.overlay.open{ display:block; }

/* Prevent background scroll when drawers/sheets are open */
html.no-scroll,
html.no-scroll body{
  overflow:hidden;
}

.offcanvas{
  position:fixed;
  top:0; left:0;
  height:100%;
  width:86%;
  max-width:360px;
  background:#fff;
  transform:translateX(-105%);
  transition:transform .2s ease;
  z-index:9999;
  padding:14px;
  overflow:auto;
}
.offcanvas.open{ transform:translateX(0); }

.off-head{ display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.off-title{ font-weight:800; font-size:15px; color:#0f172a; }
.off-close,
.off-back{
  border:1px solid rgba(15,23,42,.18);
  background:#fff;
  border-radius:12px;
  padding:10px 12px;
  cursor:pointer;
  line-height:1;
}
.off-close{ margin-left:auto; }

.off-body{ display:block; }
.off-panel{ display:none; }
.off-panel.is-active{ display:block; }

.off-link{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(15,23,42,.10);
  margin-bottom:10px;
  color:#0f172a;
  background:#fff;
  text-decoration:none;
}
.off-link:hover{ border-color:rgba(15,23,42,.18); }
.off-link--all{ background:rgba(15,23,42,.04); font-weight:800; }
.off-link-text{ font-weight:700; }
.off-link-ico{ opacity:.7; font-size:18px; }

.off-sep{ height:1px; background:rgba(15,23,42,.10); margin:14px 2px; border-radius:999px; }

.off-sub{ margin:-4px 0 10px 12px; display:flex; flex-direction:column; gap:8px; }
.off-sublink{
  display:block;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,.08);
  color:#334155;
  text-decoration:none;
  background:#fff;
  font-size:14px;
}
.off-sublink:hover{ border-color:rgba(15,23,42,.16); }

/* =========================
   CART DRAWER
========================= */
.cart-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.4);
  z-index:9998;
}
.cart-drawer{
  position:fixed;
  top:0; right:0;
  height:100%;
  background:#fff;
  z-index:9999;
  transform:translateX(100%);
  transition:transform .25s ease;
  box-shadow:-10px 0 30px rgba(0,0,0,.2);
  display:flex;
  flex-direction:column;
}
.cart-drawer.open{ transform:translateX(0); }

.cart-drawer-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 16px;
  border-bottom:1px solid rgba(0,0,0,.08);
}
.cart-drawer-title{ font-weight:700; }
.cart-drawer-close{ background:transparent; border:0; font-size:18px; cursor:pointer; line-height:1; }
.cart-drawer-body{ padding:12px 16px; overflow:auto; flex:1; }

@media (max-width:640px){
  .cart-drawer{ width:100vw; max-width:100vw; border-radius:0; }
  .cart-drawer-header{ padding:14px 16px; }
}

/* =========================
   UTILITIES
========================= */
.object-cover{ object-fit:cover; }
.aspect-\[3\/4\]{ aspect-ratio:3 / 4; }

/* =========================
   PRODUCT GRID (hover add-to-cart on media)
========================= */
.product-grid{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:16px;
}
@media (max-width:1100px){
  .product-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}
@media (max-width:780px){
  .product-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

.product-card{
  position:relative;
  overflow:hidden;
  /* Card contains: media(row1), info(row2), actions(over media row1) */
  display:grid;
  grid-template-rows:auto auto;
}

.product-media-wrap{
  position:relative;
  border-radius:0px;
  overflow:hidden;
}

.product-media{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  background:#f3f3f6;
  overflow:hidden;
}

.product-image,
.product-video{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  height:100%;
  display:block;
}

.product-image-link{ display:block; }

.discount-badge{
  position:absolute;
  left:12px;
  top:12px;
  z-index:5;
  padding:6px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;
  background:#111;
  color:#fff;
}

/* ✅ tek fav-btn (çakışma kaldırıldı) */
.fav-btn{
  position:absolute;
  top:12px;
  right:12px;
  z-index:6;
  width:2rem;
  height:2rem;
  border-radius:999px;
  border:0;
  cursor:pointer;
  background:rgba(255,255,255,.92);
  color:#111;
  font-size:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:transform .15s ease, background .15s ease;
}
.fav-btn:hover{ transform:translateY(-1px); }
.fav-btn.is-active{ background:#ff2d55; color:#fff; }

/* hover gradient */
.product-media-wrap::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0));
  opacity:0;
  transition:opacity .18s ease;
  pointer-events:none;
  z-index:2;
}
.product-card:hover .product-media-wrap::after{ opacity:1; }

/* overlay actions */
.media-actions{
  /* Place actions over the media row */
  grid-row:1;
  grid-column:1;
  align-self:end;
  justify-self:stretch;
  margin:0 12px 12px;
  z-index:6;
  opacity:0;
  transform:translateY(8px);
  pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
}
.product-card:hover .media-actions{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}

/* mobile always show */
@media (max-width:980px){
  .media-actions{
    opacity:1;
    transform:none;
    pointer-events:auto;
  }
  .product-media-wrap::after{ opacity:1; }
}

/* overlay buttons */
.media-actions .btn,
.media-actions .btn-add-to-cart,
.media-actions .btn-variant-popup{
    width: 45px;
    max-width: 100%;
    box-sizing: border-box;
    height: 35px;
    border-radius: 6px;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    background: rgb(255 255 255);
    color: #000000;
    border: 1px solid rgba(255, 255, 255, .18);
    backdrop-filter: blur(8px);
}
.media-actions .btn:hover,
.media-actions .btn-add-to-cart:hover,
.media-actions .btn-variant-popup:hover{
  background: rgb(255 255 255);
  color: #000000;
}
.media-actions .btn-out-of-stock{
  background:rgba(0,0,0,.45);
  border-color:rgba(255,255,255,.12);
  cursor:not-allowed;
  opacity:.95;
}

.product-info{ padding:12px 4px 0; }

.product-title{
margin: 0px 0px 5px 0px;
    letter-spacing: .025em;
    color: #111827;
    font-weight: 400;
    line-height: 1.4;
    font-size: 14px;
    text-transform: uppercase;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 1;
}

.product-pricing{
  display:flex;
  align-items:baseline;
  gap:10px;
}
.product-price{ font-weight:900; font-size:14px; }
.product-old-price{ font-size:13px; text-decoration:line-through; opacity:.6; }

.product-card.is-oos .product-media{ filter:grayscale(.15); }

/* ------------------------------
   Skeletons (loading placeholders)
------------------------------ */
.skeleton-card{ pointer-events:none; }
.skeleton-box,
.skeleton-line{
  background: linear-gradient(90deg, rgba(0,0,0,.06) 25%, rgba(0,0,0,.10) 37%, rgba(0,0,0,.06) 63%);
  background-size: 400% 100%;
  animation: skel-shimmer 1.2s ease-in-out infinite;
  border-radius: 12px;
}
.dark .skeleton-box,
.dark .skeleton-line{
  background: linear-gradient(90deg, rgba(255,255,255,.06) 25%, rgba(255,255,255,.10) 37%, rgba(255,255,255,.06) 63%);
  background-size: 400% 100%;
}
.skeleton-line{ height: 12px; }
.skeleton-line.w-80{ width: 80%; }
.skeleton-line.w-40{ width: 40%; }
.skeleton-line.mt-8{ margin-top: 8px; }

@keyframes skel-shimmer{
  0%{ background-position: 100% 0; }
  100%{ background-position: 0 0; }
}

/* Image fade-in on load */
.product-media.image-media{ position: relative; overflow: hidden; }
.product-media.image-media::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(0,0,0,.06) 25%, rgba(0,0,0,.10) 37%, rgba(0,0,0,.06) 63%);
  background-size: 400% 100%;
  animation: skel-shimmer 1.2s ease-in-out infinite;
  opacity: .8;
  pointer-events:none;
}
.dark .product-media.image-media::after{
  background: linear-gradient(90deg, rgba(255,255,255,.06) 25%, rgba(255,255,255,.10) 37%, rgba(255,255,255,.06) 63%);
  background-size: 400% 100%;
}
.product-media.image-media.is-loaded::after{ opacity:0; animation:none; }
.product-media.image-media img{ opacity:0; transition: opacity .18s ease; }
.product-media.image-media.is-loaded img{ opacity:1; }

/* =========================
   BANNERS (1 => full, 2 => side by side)
========================= */
.home-section{ padding:20px 0; }
.home-section-banner{ padding:20px 0; }

/* Banner section (Home Builder) */
.home-section-banner .hb-banner-grid{
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.home-section-banner .hb-banner-grid.hb-cols-1{
  grid-template-columns: 1fr;
}
@media (max-width: 760px){
  .home-section-banner .hb-banner-grid{ grid-template-columns: 1fr; }
}

/* Banner item */
.hb-banner{
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 18px;
  background: #f2f3f7;
  min-height: 160px;
  box-shadow: 0 10px 30px rgba(17,24,39,.08);
  text-decoration: none;
}
.hb-banner[aria-disabled="true"]{ cursor: default; }

.hb-banner__media{
  width: 100%;
  height: 100%;
}
.hb-banner__media img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transform: scale(1.001);
  transition: transform .35s ease;
}
.hb-banner:hover .hb-banner__media img{ transform: scale(1.03); }

.hb-banner__overlay{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px;
  background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.65) 100%);
}
.hb-banner__title{
  color: #fff;
  font-weight: 800;
  font-size: 20px;
  line-height: 1.15;
  text-shadow: 0 2px 18px rgba(0,0,0,.45);
}
.hb-banner__btn{
align-self: flex-start;
    color: #ffffff;
    font-weight: 800;
    font-size: 13px;
    padding: 10px 25px;
    border-radius: 999px;
    box-shadow: 0 10px 22px rgba(0, 0, 0, .22);
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, .45);
}

.hb-banner__desc{
  color: rgba(255,255,255,.92);
  font-weight: 600;
  font-size: 13px;
  line-height: 1.35;
  max-width: 42ch;
  text-shadow: 0 2px 18px rgba(0,0,0,.35);
}
@media (max-width: 760px){
  .hb-banner__title{ font-size: 18px; }
  .hb-banner__desc{ font-size: 12.5px; }
}
/* =========================
   FEATURES / TRUST STRIP
========================= */
.features-grid{
  display:grid;
  gap:14px;
  grid-template-columns:repeat(5, minmax(0, 1fr));
}
.features-grid.cols-3{grid-template-columns:repeat(3, minmax(0, 1fr));}
.features-grid.cols-4{grid-template-columns:repeat(5, minmax(0, 1fr));}
@media (max-width:1024px){
  .features-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
.feature-card{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:16px;
  padding:14px;
  display:flex;
  gap:12px;
  align-items:center;
}
.feature-icon{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#f1f5f9;flex:0 0 34px}
.feature-icon i{font-size:18px;line-height:1}
.feature-icon svg{width:18px;height:18px;display:block}
.feature-emoji{font-size:18px;line-height:1}
.feature-text{min-width:0}
.feature-title{font-weight:900; font-size:14px; line-height:1.1}
.feature-sub{margin-top:6px; color:#64748b; font-weight:700; font-size:13px}


/* =========================
   CATEGORIES GRID (5 cols)
========================= */
.cat-grid{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:16px;
}
@media (max-width:1024px){
  .cat-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
/* mobil → 2 kolon */
@media (max-width: 640px){
  .cat-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
}
.cat-card{
  display:block;
  border:1px solid #e5e7eb;
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  transition:transform .2s ease, box-shadow .2s ease;
}

.cat-image{
  position:relative;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  aspect-ratio:3/4;
  background:#f9fafb;
}
.cat-image img{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  height:100%;
  object-fit:cover;
  display:block;
}
.cat-title{
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  padding:6px 10px;
  border-radius:10px;
  color:#fff;
  font-size:13px;
  font-weight:600;
  text-align:center;
  backdrop-filter:blur(4px);
}

/* Category image overlay (optional fields from admin) */
.cat-overlay{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:6px;
  padding:12px;
  background:linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.62) 100%);
}
.cat-overlay__title{color:#fff;font-weight:700;font-size:16px;line-height:1.15}
.cat-overlay__desc{color:rgba(255,255,255,.88);font-size:13px;line-height:1.35;max-width:38ch}
.cat-overlay__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:fit-content;
  padding:8px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.35);
  color:#fff;
  font-size:13px;
  font-weight:600;
  background:rgba(0,0,0,.18);
}
.cat-overlay__btn:hover{background:rgba(0,0,0,.28)}

/* =========================
   MISC
========================= */
.bg-light{ background:#f3f3f3; }

.section-url-bottom{
  display:flex;
  justify-content:center;
  margin-top:25px;
}

.section-head h2{
  text-transform:uppercase;
  letter-spacing:.25em;
  color:#1f2937;
  text-align:center;
  font-weight:300;
}

@media (max-width:768px){
  .footer-cols{ grid-template-columns:1fr !important; }
}

/* =========================
   TOAST + SKELETON (unchanged)
========================= */
.toast-host{position:fixed;right:14px;top:14px;z-index:99999;display:flex;flex-direction:column;gap:10px;max-width:min(360px, calc(100vw - 28px));}
.toast{background:#fff;border:1px solid rgba(15,23,42,.12);border-radius:16px;box-shadow:0 18px 50px rgba(0,0,0,.18);overflow:hidden;transform:translateY(10px);opacity:0;transition:opacity .18s ease, transform .18s ease;}
.toast.is-in{opacity:1;transform:translateY(0)}
.toast.is-out{opacity:0;transform:translateY(10px)}
.toast__head{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid rgba(15,23,42,.08);background:#fff}
.toast__head-left{display:flex;align-items:center;gap:8px;min-width:0}
.toast__ok{width:22px;height:22px;border-radius:999px;background:#16a34a;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:14px;flex:0 0 22px}
.toast__title{font-size:13px;font-weight:600;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.toast__close{appearance:none;border:0;background:transparent;width:28px;height:28px;border-radius:999px;cursor:pointer;color:rgba(15,23,42,.6)}
.toast__close:hover{background:rgba(15,23,42,.06);color:rgba(15,23,42,.85)}
.toast__content{display:flex;gap:12px;padding:12px}
.toast__media{width:64px;height:80px;border-radius:12px;overflow:hidden;background:rgba(15,23,42,.04);flex:0 0 64px}
.toast__media img{width:100%;height:100%;object-fit:cover;display:block}
.toast__meta{min-width:0;display:flex;flex-direction:column;justify-content:center}
.toast__name{font-size:13px;font-weight:600;color:#0f172a;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.toast__price{margin-top:6px;font-size:15px;font-weight:700;color:#0f172a}
.toast__actions{padding:0 12px 12px}
.toast__btn{display:flex;align-items:center;justify-content:center;width:100%;height:44px;text-decoration:none;background:#0f172a;color:#fff;font-size:11px;letter-spacing:.16em;text-transform:uppercase;border-radius:12px}
.toast__btn:hover{background:#111827}

/* ===========================
   Variant modal (listing pages)
   Flat (no box-shadow)
   =========================== */

.vmodal{background:#fff;border:1px solid rgba(15,23,42,.12);border-radius:18px;padding:14px;max-height:82vh;overflow:auto}
.vmodal__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.vmodal__head-left{display:flex;align-items:center;gap:12px;min-width:0}
.vmodal__media{width:52px;height:52px;border-radius:14px;border:1px solid rgba(15,23,42,.10);background:rgba(15,23,42,.03);display:flex;align-items:center;justify-content:center;overflow:hidden;flex:0 0 auto}
.vmodal__media img{width:100%;height:100%;object-fit:cover;display:block}
.vmodal__title{font-weight:700;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px}
.vmodal__sub{font-size:12px;line-height:1.25}
.vmodal__close{border:1px solid rgba(15,23,42,.14);background:#fff;border-radius:12px;width:38px;height:38px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.vmodal__close:hover{border-color:rgba(15,23,42,.26)}
.vmodal__body{margin-top:12px}
.vmodal__foot{margin-top:12px;border-top:1px solid rgba(15,23,42,.08);padding-top:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.vmodal__price-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.vmodal__actions{display:flex;align-items:center;gap:10px}

/* compact qty stepper (reused) */
.qty{display:flex;align-items:center;border:1px solid rgba(15,23,42,.14);border-radius:14px;overflow:hidden;background:#fff}
.qty__btn{width:38px;height:40px;border:0;background:transparent;cursor:pointer;font-size:18px;line-height:1}
.qty__btn:hover{background:rgba(15,23,42,.04)}
.qty__input{width:52px;border:0;text-align:center;outline:0}

/* Ensure variant option chips fit inside modal */
.vmodal .vopt__list{min-width:0}

@media (max-width:480px){
  .toast-host{right:10px;left:10px;bottom:10px;max-width:none}
}

.js-skeleton{display:block}
.js-skeleton-content{display:block}
.sk{background:linear-gradient(90deg, rgba(0,0,0,.06) 25%, rgba(0,0,0,.12) 37%, rgba(0,0,0,.06) 63%);background-size:400% 100%;animation:sk-shimmer 1.2s ease-in-out infinite;border-radius:12px}
@keyframes sk-shimmer{0%{background-position:100% 0}100%{background-position:-100% 0}}
.sk-grid{gap:14px}
.sk-card{padding:10px;border:1px solid rgba(0,0,0,.06);border-radius:14px;background:#fff}
.sk-media{height:160px;width:100%;border-radius:12px;margin-bottom:10px}
.sk-line{margin:8px 0;border-radius:10px}
.sk-banner{height:140px;width:100%;border-radius:8px}
@media (max-width:640px){
  .sk-media{height:180px}
  .sk-banner{height:120px}
}



/* cart icon wrapper */
.cart-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:999px;
  position:relative;
  text-decoration:none;
}


.cart-icon{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.cart-link svg{
  width:22px;
  height:22px;
  display:block;
}

/* badge */
.cart-badge{
    position: absolute;
    top: 0px;
    right: 10px;
    min-width: 5px;
    height: 15px;
    padding: 0 5px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    background: #ffffff;
    color: #000000;
    border: 2px solid rgba(255, 255, 255, .95);
}

/* =========================
   FLAT UI OVERRIDES (NO BOX-SHADOW)
   - User preference: keep UI modern & flat
========================= */
.card,
.product-card,
.checkout-shell,
.checkout-block,
.cart-summary,
.cart-summary-card,
.cart-item,
.mini-cart,
.mini-cart-layout,
.dropdown-menu,
.dropdown,
.modal,
.search-sheet,
.toast,
.ps-nav,
.btn,
.btn:hover,
.btn:focus,
.btn:active{
  box-shadow:none !important;
}

/* Keep focus accessible without shadows */
input:focus, textarea:focus, select:focus,
.form-control:focus, .form-select:focus{
  box-shadow:none !important;
  outline:3px solid rgba(15,23,42,.08);
  outline-offset:0;
}

/* Remove hover lift that relied on shadows */
.product-card:hover{transform:none !important;}

/* scroll'da header siyahken border daha iyi dursun */
.site-header.is-scrolled .cart-badge{
}

/* mobil biraz küçült */
@media (max-width:980px){
  .cart-link{ width:38px; height:38px; }
  .cart-link svg{ width:20px; height:20px; }
  .cart-badge{ top:-6px; right:-8px; }
}


.cat-image{
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 4;
  background: #f3f4f6;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* gerçek resim */
.cat-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* placeholder */
.cat-image-placeholder{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 13px;
  font-weight: 600;
  color: #6b7280;          /* gray-500 */
  background: repeating-linear-gradient(
    45deg,
    #f3f4f6,
    #f3f4f6 10px,
    #e5e7eb 10px,
    #e5e7eb 20px
  );
  text-align: center;
  padding: 10px;
}

/* title üstte kalsın */
.cat-title{
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 10px;
  padding: 6px 10px;
  border-radius: 10px;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  backdrop-filter: blur(4px);
}






/* favori ikon link */
.fav-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:999px;
  position:relative;
  text-decoration:none;
}


/* ikon wrapper */
.fav-icon{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* svg */
.fav-link svg{
  width:22px;
  height:22px;
  display:block;
}

/* badge */
.fav-badge{
    position: absolute;
    top: -6px;
    right: -15px;
    min-width: 0px;
    height: 15px;
    padding: 0 5px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    background: #ffffff;
    color: #000000;
    border: 2px solid rgba(255, 255, 255, .95);
}

/* header siyahken border ayarı */
.site-header.is-scrolled .fav-badge{
}

/* mobil */
@media (max-width:980px){
  .fav-link{ width:38px; height:38px; }
  .fav-link svg{ width:20px; height:20px; }
}




/* =========================
   PRODUCT DETAIL LAYOUT
========================= */

/* Yeni (row kullanmadan) layout: yatay kayma/boşlukları engeller */
.pd-layout{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  width: 100%;
  max-width: 100%;
}
.pd-layout > *{ min-width: 0; }

@media (max-width: 900px){
  .pd-layout{ grid-template-columns: 1fr; }
}

/* Card üst wrapper: width taşmalarını kes */
.pd-card-wrap{
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.pd-card{
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

@media (min-width: 980px){
  .pd-card{ position: sticky; top: 88px; }
}

/* Eski .row yerine ürün detaydaki satırlar */
.pd-row{
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  min-width: 0;
}

/* Card içeriğinde taşmaları önle */
.pd-card img,
.pd-card video,
.pd-card iframe,
.pd-card svg,
.pd-card canvas{
  max-width: 100%;
}

.pd-card table{
  display: block;
  max-width: 100%;
  overflow-x: auto;
}
.pd-card pre,
.pd-card code{
  white-space: pre-wrap;
  word-break: break-word;
}

.pd-related-head{ justify-content: space-between; width: 100%; }
.pd-card iframe{ width: 100%; }

/* =========================
   PRODUCT DETAIL TABS
========================= */
.pd-tabs{width:100%;max-width:100%}
.pd-tabs__nav{display:flex;gap:10px;flex-wrap:wrap;border-bottom:1px solid rgba(0,0,0,.08);padding-bottom:8px}
.pd-tab{appearance:none;border:1px solid rgba(0,0,0,.10);background:rgba(0,0,0,.02);padding:8px 12px;border-radius:999px;font-weight:600;cursor:pointer;transition:background .12s ease,border-color .12s ease,transform .12s ease}
.pd-tab:hover{transform:translateY(-1px)}
.pd-tab.is-active{background:#111827;color:#fff;border-color:#111827}
.pd-tabs__panes{padding-top:12px}
.pd-pane{display:none}
.pd-pane.is-active{display:block}

/* Mobile sticky add-to-cart bar */
.pd-stickybar{position:fixed;left:0;right:0;bottom:0;z-index:9999;transform:translateY(110%);transition:transform .18s ease;pointer-events:none}
.pd-stickybar.is-active{transform:translateY(0);pointer-events:auto}
.pd-stickybar__inner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;background:rgba(255,255,255,.96);border-top:1px solid rgba(0,0,0,.10);backdrop-filter:blur(8px)}
.pd-stickybar__price{font-weight:800;font-size:16px;white-space:nowrap}
.pd-stickybar__btn{flex:1;min-height:42px;border-radius:12px}
@media (min-width: 901px){.pd-stickybar{display:none}}


/* Genel: product layout row zaten var, biz sadece iyileştiriyoruz */
.product-layout{
  align-items: flex-start;
}

/* Sol galeri alanı */
.product-layout > div:first-child{
  flex: 1;
  min-width: 0;
}

/* Sağ bilgi kartı (desktop sticky) */
.product-layout > .card{
  flex: 1;
  min-width: 0;
}

@media (min-width: 980px){
  .product-layout > .card{
    position: sticky;
    top: 88px; /* header yüksekliğine göre: 64px + boşluk */
  }
}

/* Mobilde tek kolon */
@media (max-width: 900px){
  .product-layout{
    flex-direction: column;
  }
  .product-layout > div,
  .product-layout > .card{
    width: 100%;
  }
}

/* =========================
   GALLERY / MEDIA
========================= */

/* Ana görsel/video ortak görünüm */
.product-layout img[style*="width:100%"],
.product-layout video[style*="width:100%"],
.product-layout iframe[style*="width:100%"]{
  border-radius: 8px !important;
  box-shadow: 0 18px 60px rgba(0,0,0,.10);
}

/* Thumbnail satırı */
.product-layout .row[style*="flex-wrap:wrap"]{
  gap: 10px !important;
}

/* Thumbnail görseller */
.product-layout .row[style*="flex-wrap:wrap"] img{
  width: 84px !important;
  height: 110px !important;
  object-fit: cover;
  border-radius: 14px !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.product-layout .row[style*="flex-wrap:wrap"] img:hover{
  transform: translateY(-2px);
  border-color: rgba(0,0,0,.18) !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.12);
}

/* =========================
   PRODUCT INFO CARD
========================= */

/* Başlık + fav butonu hizası */
.product-layout h1{
  font-size: 22px;
  line-height: 1.25;
  letter-spacing: .01em;
}

/* Stok / sku satırı */
.product-layout .muted[style*="display:flex"]{
  margin-top: 6px;
  color: rgba(17,17,17,.65);
  font-size: 13px;
}

/* Sosyal proof pills zaten var ama biraz iyileştirelim */
.social-proof{
  margin-top: 12px !important;
}
.sp-pill{
  border-radius: 999px;
  padding: 7px 12px;
  background: rgba(15,23,42,.04);
}

/* Açıklama paragrafı */
.product-layout p{
  margin: 12px 0 0;
  color: rgba(17,17,17,.85);
  line-height: 1.65;
}

/* Fiyat satırı */
#js-price-new{
  font-size: 20px;
}
#js-price-old{
  font-size: 14px;
}
#js-price-disc.badge{
  background: #111;
  color: #fff;
  border-radius: 999px;
  padding: 6px 10px;
  font-weight: 900;
}

/* =========================
   VARIANT SELECTS / FORM
========================= */

.js-ajax-add-to-cart label{
  display: block;
  margin-top: 12px;
  margin-bottom: 6px;
  font-weight: 700;
  font-size: 13px;
  color: rgba(17,17,17,.85);
}

.js-ajax-add-to-cart select,
.js-ajax-add-to-cart input[type="number"],
.js-ajax-add-to-cart input[type="text"],
.js-ajax-add-to-cart input[type="email"],
.js-ajax-add-to-cart textarea{
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
}

.js-ajax-add-to-cart select:focus,
.js-ajax-add-to-cart input:focus,
.js-ajax-add-to-cart textarea:focus{
  outline: none;
  border-color: rgba(0,0,0,.35);
  box-shadow: 0 0 0 4px rgba(0,0,0,.06);
}

/* Butonlar: Sepete Ekle + Sepete Git */
.js-ajax-add-to-cart .btn{
    width: 45px;
    height: 35px;
    border-radius: 6px;
    font-weight: 900;
    letter-spacing: .02em;
}

.js-ajax-add-to-cart .btn + .btn{
  margin-top: 10px;
}

.js-ajax-add-to-cart.data .btn{
    width: 100%;
    height: 35px;
    border-radius: 6px;
    font-weight: 900;
    letter-spacing: .02em;
}

.js-ajax-add-to-cart.data .btn + .btn{
  margin-top: 10px;
}

/* Sepete Git outline daha “buton” dursun */
.js-ajax-add-to-cart .btn-outline{
  border-radius: 14px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

/* Variant meta */
#js-variant-meta{
  margin-top: 10px !important;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.04);
  border: 1px solid rgba(0,0,0,.06);
}

/* =========================
   PRODUCT DETAIL - VARIANT OPTIONS (Color / Size as checkbox-like)
========================= */

.vopt{ margin-top: 14px; }
.vopt__label{
  font-weight: 800;
  font-size: 13px;
  letter-spacing: .02em;
  margin-bottom: 8px;
}

.vopt__list{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.vopt__input{ position: absolute; opacity: 0; pointer-events: none; }

.vopt__item{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  user-select: none;
}

/* Color swatches */
.vopt__item--color{
  padding: 4px;
  border-radius: 999px;
  transition: transform .15s ease, box-shadow .15s ease;
}

.vopt__swatch{
  width: 32px;
  height: 32px; 
  display: block;
  border-radius: 999px;
  border: 2px solid rgba(0,0,0,.22);
  background: #ddd;
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.vopt__item--color:hover .vopt__swatch{ transform: scale(1.06); border-color: rgba(0,0,0,.32); }

.vopt__item--color .vopt__input:checked ~ .vopt__swatch{
  border-color: transparent;
}

/* Size / generic pills */
.vopt__item--size,
.vopt__item--generic{
  border: 1px solid rgba(0,0,0,.18);
  border-radius: 14px;
  padding: 10px 14px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .04em;
  background: rgba(255,255,255,.92);
  transition: transform .12s ease, border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.vopt__item--size:hover,
.vopt__item--generic:hover{ border-color: rgba(0,0,0,.32); transform: translateY(-1px); }

.vopt__item--size .vopt__input:checked ~ .vopt__text,
.vopt__item--generic .vopt__input:checked ~ .vopt__text{ color: #fff; }

.vopt__item--size:has(.vopt__input:checked),
.vopt__item--generic:has(.vopt__input:checked){
  background: rgba(0,0,0,.90);
  border-color: rgba(0,0,0,.90);
}

/* Fallback for browsers without :has() */
.vopt__item.is-selected{

}
.vopt__item.is-selected .vopt__text{ color:#fff; }

.vopt__text{ display:inline-block; }

/* Selected badge */
.vopt__badge{
  position: absolute;
  top: -8px;
  right: -6px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .02em;
  padding: 3px 6px;
  border-radius: 999px;
  background: rgba(0,0,0,.90);
  color: #fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
  transform: translateY(-2px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .12s ease, transform .12s ease;
}
.vopt__item.is-selected .vopt__badge,
.vopt__item:has(.vopt__input:checked) .vopt__badge{
  opacity: 1;
  transform: translateY(0);
}

/* Disabled / out-of-stock */
.vopt__item.is-disabled,
.vopt__item.is-oos{
  cursor: not-allowed;
  opacity: .55;
  transform: none !important;
  box-shadow: none !important;
}
.vopt__item.is-disabled:hover,
.vopt__item.is-oos:hover{ transform: none; }

/* Strike for sizes */
.vopt__item.is-disabled .vopt__text,
.vopt__item.is-oos .vopt__text{
  text-decoration: line-through;
  text-decoration-thickness: 2px;
  text-decoration-color: rgba(0,0,0,.55);
}

/* Disabled swatch diagonal */
.vopt__item--color.is-disabled::after,
.vopt__item--color.is-oos::after{
  content: '';
  position: absolute;
  left: 6px;
  right: 6px;
  top: 50%;
  height: 2px;
  background: rgba(0,0,0,.65);
  transform: rotate(-35deg);
  border-radius: 999px;
}

/* Out-of-stock feels stronger */
.vopt__item.is-oos{ opacity: .45; }

.vopt__sr{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* =========================
   EXTRA CARDS (Açıklama / Özellikler / Yorumlar)
========================= */

.card h3, .card h4{
  margin: 0 0 10px;
}

.card hr{
  border: 0;
  border-top: 1px solid rgba(0,0,0,.08);
}

/* Özellikler satırı (sen inline border-top veriyorsun, biz biraz toparlayalım) */
.card [style*="border-top:1px solid #eee"]{
  border-top-color: rgba(0,0,0,.08) !important;
}

/* =========================
   REVIEW FORM (Modern)
========================= */

.review-form{
  display: grid;
  gap: 12px;
}

.review-form label{
  display:block;
  font-size: 13px;
  font-weight: 600;
  color: rgba(17,24,39,.85);
}

.review-form input[type="text"],
.review-form input[type="email"],
.review-form textarea,
.review-form select{
  width: 100%;
  padding: 11px 12px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  outline: none;
}

.review-form textarea{ resize: vertical; min-height: 110px; }

/* Review image uploader */
.review-upload{margin-top:12px}
.review-upload__label{display:block;font-weight:600;font-size:13px;margin-bottom:8px}
.review-upload__drop{position:relative;border:1px dashed rgba(17,24,39,.25);border-radius:14px;padding:14px;display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;transition:background .15s ease,border-color .15s ease}
.review-upload__drop.is-drag{background:rgba(17,24,39,.03);border-color:rgba(17,24,39,.4)}
.review-upload__input{position:absolute;opacity:0;pointer-events:none}
.review-upload__hint{text-align:center}
.review-upload__title{font-weight:700}
.review-upload__preview{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.review-upload__thumb{width:72px;height:72px;border-radius:12px;overflow:hidden;border:1px solid rgba(17,24,39,.12);background:#fff}
.review-upload__thumb img{width:100%;height:100%;object-fit:cover;display:block}

/* Review images inside review cards */
.review-card__images{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.review-img{width:78px;height:78px;border-radius:12px;overflow:hidden;border:1px solid rgba(17,24,39,.12);display:block}
.review-img img{width:100%;height:100%;object-fit:cover;display:block}

.review-form input:focus,
.review-form textarea:focus,
.review-form select:focus{
  border-color: rgba(0,0,0,.22);
}

.review-form__row{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

@media (max-width: 640px){
  .review-form__row{ grid-template-columns: 1fr; }
}

.review-rating{
  display:flex;
  flex-direction: column;
  gap: 8px;
}

.review-rating__stars{
  display:flex;
  align-items:center;
  gap: 6px;
}

.review-star{
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.12);
  background: transparent;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  color: rgba(17,24,39,.30);
}

.review-star.is-active,
.review-star.is-hover{
  color: rgba(245, 158, 11, 1);
  border-color: rgba(245, 158, 11, .35);
  background: rgba(245, 158, 11, .08);
}

.review-rating__meta{
  display:flex;
  align-items: baseline;
  gap: 10px;
}

.review-rating__value{
  font-weight: 700;
  color: rgba(17,24,39,.92);
}

/* Review list row typography */
.review-item{
  padding: 12px 0;
  border-top: 1px solid rgba(0,0,0,.08);
}

.review-item__head{
  display:flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.review-item__stars{ letter-spacing: 1px; }

/* Review item */
.card [style*="padding:10px 0;border-top:1px solid #eee"]{
  border-top-color: rgba(0,0,0,.08) !important;
}

/* Alert (success/error) basit görünüm - sınıfın varsa override eder */
.alert{
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(0,0,0,.04);
  margin: 10px 0;
}

/* =========================
   FAVORITE BUTTON ON DETAIL (kalp)
========================= */

.product-layout .fav-btn{
  width: 40px;
  height: 40px;
  border-radius: 999px;
  box-shadow: 0 14px 30px rgba(0,0,0,.10);
}

/* =========================
   SMALL SCREENS
========================= */
@media (max-width: 640px){
  .product-layout h1{ font-size: 20px; }
  #js-price-new{ font-size: 18px; }
  .product-layout .row[style*="flex-wrap:wrap"] img{
    width: 76px !important;
    height: 98px !important;
  }
}
/* ===== Products page layout ===== */
.products-page{
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.products-aside{
  flex: 1;
  min-width: 260px;
}

.products-main{
  flex: 3;
  min-width: 0;
}



/* Mobile: stack */
@media (max-width: 900px){
  .products-page{
    flex-direction: column;
  }
  .products-aside,
  .products-main{
    width: 100%;
    min-width: 0;
  }
}

/* ===== Filter card ===== */
.filter-card{
  padding: 14px;
  border-radius: 18px;
}

.filter-title{
  font-weight: 800;
  margin-bottom: 10px;
}

/* Filter tree */
.filter-tree{
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.filter-item{
  display: flex;
  gap: 8px;
  align-items: center;
  cursor: pointer;
  padding: 8px 10px;
  border-radius: 12px;
  padding-left: calc(10px + (var(--indent) * 10px));
  transition: background .15s ease;
}

.filter-item:hover{
  background: rgba(0,0,0,.04);
}

.filter-item input[type="checkbox"]{
  width: 18px;
  height: 18px;
  accent-color: #111;
}

/* ===== Filter bar ===== */
.filter-bar{
  margin-bottom: 12px;
  padding: 14px;
  border-radius: 8px;
}

.filter-form{
  display: flex;
  gap: 12px;
  align-items: flex-end;
  flex-wrap: wrap;
}

.filter-field{
  flex: 1;
  min-width: 160px;
}

.filter-field.is-search{
  flex: 2;
  min-width: 220px;
}

.filter-actions{
  display: flex;
  gap: 10px;
  align-items: center;
}

.filter-actions .btn,
.filter-actions .btn-outline{
  height: 44px;
  border-radius: 14px;
  font-weight: 900;
  padding: 0 14px;
}

@media (max-width: 900px){
  .filter-form{
    flex-direction: column;
    align-items: stretch;
  }
  .filter-field,
  .filter-field.is-search{
    width: 100%;
    min-width: 0;
  }
  .filter-actions{
    width: 100%;
  }
  .filter-actions .btn,
  .filter-actions .btn-outline{
    width: 100%;
  }
}

/* ===== Count ===== */
.products-count{
  margin: 0 0 10px;
}

/* ===== Products list ===== */
.products-list{
  min-width: 0;
}

/* ⚠️ Grid: partial içinde .product-grid varsa bunu kullanır.
   Desktop 5 / Mobile 2 */


@media (max-width: 1280px){
  .product-grid{ grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 1024px){
  .product-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px){
  .product-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
}

/* ===== Pagination ===== */
.pagination-row{
  display: flex;
  justify-content: space-between;
  margin-top: 14px;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 12px;
  border-top: 1px solid rgba(0,0,0,.08);
}

.pagination-actions{
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
/* En baskın grid kuralı */
.products-list .product-grid,
.product-grid{
  display: grid !important;
  
  gap: 10px !important;
  align-items: stretch;
}

/* ürün kartları genişlik yüzünden kırılmasın */
.products-list .product-grid > *,
.product-grid > *{
  min-width: 0;
}

/* laptop */
@media (max-width: 1280px){
  .products-list .product-grid,
  .product-grid{
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

/* tablet */
@media (max-width: 1024px){
  .products-list .product-grid,
  .product-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* mobil: 2 kolon */
@media (max-width: 640px){
  .products-list .product-grid,
  .product-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}
/* category_products.php .grid kullanıyorsa */
.products-list .grid{
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

@media (max-width: 640px){
  .products-list .grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}



.filter-search{
  margin: 10px 0 12px;
}

.filter-search input{
  width: 100%;
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.12);
  padding: 0 12px;
  background: #fff;
}

.filter-search input:focus{
  outline: none;
  border-color: rgba(0,0,0,.35);
  box-shadow: 0 0 0 4px rgba(0,0,0,.06);
}
.header-spacer{ height:64px; }

.products-page{
  display:flex;
  gap:16px;
  align-items:flex-start;
}

.products-aside{ flex:1; min-width:260px; }
.products-main{ flex:3; min-width:0; }



@media (max-width: 900px){
  .products-page{ flex-direction:column; }
  .products-aside, .products-main{ width:100%; min-width:0; }
}

.filter-card{ border-radius:8px; padding:14px; }
.filter-title{ font-weight:900; margin-bottom:10px; letter-spacing:.02em; }

.filter-search{ margin: 10px 0 8px; }
.filter-search input{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  height:42px;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.12);
  padding:0 12px;
  background:#fff;
}
.filter-search input:focus{
  outline:none;
  border-color:rgba(0,0,0,.35);
  box-shadow:0 0 0 4px rgba(0,0,0,.06);
}

.filter-divider{
  height:1px;
  background: rgba(0,0,0,.08);
  margin: 10px 0 12px;
}

.filter-tree{ display:flex; flex-direction:column; gap:6px; }
.filter-item{
  display:flex;
  gap:8px;
  align-items:center;
  cursor:pointer;
  padding:8px 10px;
  border-radius:12px;
  padding-left: calc(10px + (var(--indent) * 10px));
}
.filter-item:hover{ background: rgba(0,0,0,.04); }
.filter-item input{ width:18px; height:18px; accent-color:#111; }

.filter-bar{ padding:14px; border-radius:18px; margin-bottom:12px; }
.filter-form{
  display:flex;
  gap:12px;
  align-items:flex-end;
  flex-wrap:wrap;
}
.filter-field{ flex:1; min-width:160px; }
.filter-field.is-search{ flex:2; min-width:220px; }

.filter-actions-row{ margin-top:12px; display:flex; justify-content:flex-end; }

@media (max-width: 900px){
  .filter-form{ flex-direction:column; align-items:stretch; }
  .filter-field, .filter-field.is-search{ width:100%; min-width:0; }
  .filter-actions-row{ justify-content:stretch; }
  .filter-actions-row .btn-outline{ width:100%; }
}

/* Attr filter */
.attr-block{ padding:10px 0; border-top:1px solid rgba(0,0,0,.08); }
.attr-title{ font-weight:800; margin-bottom:8px; }
.attr-item{
  display:flex;
  gap:8px;
  align-items:center;
  margin:6px 0;
  cursor:pointer;
  padding:6px 8px;
  border-radius:10px;
}
.attr-item:hover{ background: rgba(0,0,0,.04); }
.attr-item input{ width:18px; height:18px; accent-color:#111; }

/* Grid desktop 5 / mobile 2 (partial .product-grid üretiyor varsayımı) */
.product-grid{
  display:grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}
@media (max-width: 1024px){
  .product-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px){
  .product-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
}




/* PRODUCTS GRID: desktop 5 / mobile 2 */
.product-grid{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

@media (max-width: 1100px){
  .product-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 640px){
  .product-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}

/* placeholder */
.product-image-placeholder{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  color:#6b7280;
  background:#f3f4f6;
}

/* product card baseline (senin daha önceki product css ile uyumlu) */
.product-card{ position:relative; overflow:hidden; }
.product-media{ border-radius:0px; overflow:hidden; background:#f3f4f6; }
.product-info{ padding:5px 0px 0; }
.product-actions{ display:flex; flex-direction:column; gap:8px; margin-top:10px; }
.product-meta{ margin-top:6px; font-size:12px; }




.active-filters{
  margin: 10px 0 14px;
  padding: 12px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  background: #fff;
}
.active-filters__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}

/* =========================
   FINAL OVERRIDES (tek kaynak)
   - product grid / product card stilleri dosyanın farklı yerlerinde tekrar ettiği için
     en sonda tek bir "source of truth" bırakıyoruz.
========================= */
.product-grid{
  display:grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap:16px;
  align-items:stretch;
}
@media (max-width:1100px){
  .product-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width:640px){
  .product-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap:12px; }
}

.product-image-placeholder{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  color:#6b7280;
  background:#f3f4f6;
}
.active-filters__clear{
  border:0;
  background: transparent;
  cursor:pointer;
  font-weight:700;
  color:#0f172a;
  padding:6px 10px;
  border-radius:10px;
}
.active-filters__clear:hover{ background: rgba(15,23,42,.06); }

.active-filters__chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.filter-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:999px;
  background: rgba(15,23,42,.04);
  border:1px solid rgba(15,23,42,.10);
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  user-select:none;
}
.filter-chip:hover{ background: rgba(15,23,42,.08); }
.filter-chip__x{
  width:18px;height:18px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(15,23,42,.10);
  font-size:12px;
}
.auth-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
}

.auth-card{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  max-width:420px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px;
  padding:22px;
}

.auth-title{
  margin:0 0 14px;
  font-size:22px;
  font-weight:800;
  letter-spacing:-.02em;
}

.auth-alert{
  border-radius:12px;
  padding:10px 12px;
  margin:0 0 12px;
  font-weight:600;
  font-size:14px;
}

.auth-errors{
  margin:0;
  padding-left:18px;
}

.auth-errors li{
  margin:4px 0;
}

.auth-alert.is-error{
  border:1px solid #ffb6b6;
  background:#ffe7e7;
  color:#8a1f1f;
}

.auth-alert.is-success{
  border:1px solid #b6f0c8;
  background:#e8fff0;
  color:#1e6a33;
}

.auth-form{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.auth-label{
  font-size:13px;
  font-weight:700;
  color: rgba(0,0,0,.7);
  margin-top:4px;
}

.auth-input{
  height:44px;
  padding:0px 0px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  outline:none;
}

.auth-input:focus{
  border-color: rgba(0,0,0,.35);
  box-shadow: 0 0 0 4px rgba(0,0,0,.08);
}

.auth-input.is-invalid{
  border-color: rgba(220,38,38,.65);
  box-shadow: 0 0 0 4px rgba(220,38,38,.12);
}

.auth-field-error{
  display:none;
  margin-top:-6px;
  font-size:12px;
  line-height:1.3;
  color: rgba(220,38,38,.95);
}

.auth-field-error.is-show{ display:block; }

.auth-links{
  margin-top:4px;
  font-size:13px;
  color: rgba(0,0,0,.6);
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}

.auth-links a{
  color: rgba(0,0,0,.7);
  text-decoration:none;
}

.auth-links a:hover{
  text-decoration:underline;
}

.auth-dot{ opacity:.6; }

.auth-btn{
  margin-top:8px;
  height:46px;
  border:0;
  border-radius:12px;
  cursor:pointer;
  font-weight:800;
  background:#111;
  color:#fff;
  transition: transform .06s ease, box-shadow .15s ease, opacity .15s ease;
}

.auth-btn:hover{ opacity:.95; }
.auth-btn:active{ transform: translateY(1px); }

.auth-footer{
  margin:12px 0 0;
  font-size:13px;
  color: rgba(0,0,0,.65);
}




.cart-page { max-width:1200px; margin:auto; }
.cart-modern { padding: 0 12px; }

.cart-head{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:12px;
  margin-bottom:14px;
}
.cart-title { margin:0; }
.cart-continue-link{
  color:#666;
  text-decoration:none;
  font-size:14px;
}
.cart-continue-link:hover{ text-decoration:underline; }

.cart-alert {
  background:#f5f7fa;
  padding:12px;
  border-radius:12px;
  margin-bottom:12px;
  border:1px solid rgba(0,0,0,.04);
}

.cart-layout-modern{
  display:grid;
  grid-template-columns: 1fr 380px;
  gap:18px;
  align-items:start;
}

@media (max-width: 980px) {
  .cart-layout-modern { grid-template-columns:1fr; }
}

.cart-left{

}
.cart-right{ }

.card-soft{
  background: rgba(255,255,255,.7);
  border:1px solid rgba(0,0,0,.04);
  box-shadow: 0 10px 30px rgba(0,0,0,.05);
  backdrop-filter: blur(6px);
}

.cart-items{ padding:14px; }
.cart-items-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:10px;
}

.cart-item-list{ display:flex; flex-direction:column; gap:12px; }

.cart-item{
  display:grid;
  grid-template-columns: 72px 1fr 140px;
  gap:12px;
  align-items:center;
  padding:12px;
  border-radius:16px;
  background: rgba(255,255,255,.9);
  border:1px solid rgba(0,0,0,.05);
}
@media (max-width: 680px){
  .cart-item{ grid-template-columns: 72px 1fr; }
  .cart-item-price{ grid-column: 1 / -1; display:flex; justify-content:space-between; align-items:center; padding-top:8px; border-top:1px dashed rgba(0,0,0,.08); }
}

.cart-item-img{
  width:72px;
  height:72px;
  border-radius:14px;
  object-fit:cover;
  background:#f1f3f5;
}
.cart-item-img--ph{ display:block; }

.cart-item-title{ font-weight:700; line-height:1.2; margin-bottom:2px; }
.cart-item-meta{ color:#7b7b7b; font-size:12px; margin-top:2px; }

.cart-item-actions{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

.qty-stepper{
  display:flex;
  align-items:center;
  border:1px solid rgba(0,0,0,.10);
  border-radius:12px;
  overflow:hidden;
  height:38px;
  background:#fff;
}
.qty-btn{
  width:36px;
  height:38px;
  border:0;
  background:transparent;
  cursor:pointer;
  font-size:18px;
  line-height:1;
}
.qty-input{
  width:56px;
  text-align:center;
  border:0;
  outline:0;
  height:38px;
}

.btn-sm{ padding:8px 10px; font-size:13px; border-radius:12px; }
.btn-ghost{
  background:transparent;
  border:1px solid rgba(0,0,0,.08);
}
.btn-ghost:hover{ background:rgba(0,0,0,.03); }
.btn-ghost-text{ margin-left:6px; }
.trash{ font-size:14px; }

.cart-item-price{ text-align:right; }
.cart-item-total{ font-weight:800; font-size:16px; margin-top:2px; }

.cart-summary { display:flex; flex-direction:column; gap:12px; }

.cart-coupon{ padding:14px; margin-top:12px; }
.cart-coupon-form{
  display:flex;
  gap:10px;
  align-items:center;
}
.cart-coupon-form .input{ flex:1; }

.cart-totals{ padding:16px; }
.card-title{ margin:0 0 10px; font-size:16px; }

.cart-totals .row {
  display:flex;
  justify-content:space-between;
  margin:8px 0;
  color:#555;
}

.cart-grand {
  margin:12px 0 14px;
  font-size:16px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-top:10px;
  border-top:1px dashed rgba(0,0,0,.12);
}

.btn-block{ display:block; width:100%; text-align:center; }

.cart-sticky{
  position: sticky;
  top: 14px;
}

.cart-empty{
  text-align:center;
  padding:56px 24px;
  border-radius:24px;
  border:1px solid rgba(0,0,0,.06);
  background:linear-gradient(90deg,#ffffff 0%,#ffffff 56%,#f7f2e8 56%,#f7f2e8 100%);
}
@media (max-width: 980px){
  .cart-empty{ padding:44px 18px; background:#ffffff; }
}

.cart-empty-icon{
  width:76px;
  height:76px;
  border-radius:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:34px;
  background:rgba(0,0,0,.04);
  border:1px solid rgba(0,0,0,.05);
}
.cart-empty-title{ font-weight:900; margin-top:14px; font-size:20px; letter-spacing:-0.01em; }
.cart-empty-text{ color:#6f6f6f; margin:8px 0 16px; max-width:420px; margin-left:auto; margin-right:auto; line-height:1.45; }
.cart-empty-actions{ max-width:360px; margin:0 auto; display:grid; gap:10px; }

/* Mini cart empty state */
.mini-cart-empty{ text-align:center; padding:18px 14px; }
.mini-cart-empty-ico{
  width:56px;height:56px;border-radius:18px;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.04);border:1px solid rgba(0,0,0,.05);
  font-size:24px;
}
.mini-cart-empty-title{ font-weight:900; margin-top:10px; letter-spacing:-0.01em; }
.mini-cart-empty .muted{ margin-top:6px; line-height:1.4; }
.mini-cart-empty-btn{ margin-top:12px; width:100%; }


.checkout-bg{
  /* Full-width split background (left white / right beige) */
  background: linear-gradient(90deg,#ffffff 0%,#ffffff 50%,#f7f2e8 50%,#f7f2e8 100%);
  padding: 34px 0 44px;
}
@media (max-width: 980px){
  .checkout-bg{ background:#ffffff; padding: 22px 0 28px; }
}

.checkout-shell{ position: relative; }



.checkout-page { max-width: 1200px; margin: auto; }
.checkout-head { margin-bottom: 14px; }
.checkout-title { margin: 0 0 8px; }

.checkout-alert{
  border-radius: 12px;
  padding: 12px;
  border: 1px solid #eee;
  background: #f6f7f9;
}
.checkout-alert.is-error{
  border-color:#ffb6b6;
  background:#ffe7e7;
}

.checkout-grid{
  display:grid;
  grid-template-columns: 1fr 380px;
  gap: 18px;
  align-items: start;
}
@media (max-width: 980px){
  .checkout-grid{ grid-template-columns: 1fr; }
}

/* prevent grid items from forcing overflow */
.checkout-grid > *{ min-width:0; }

.checkout-panel{

  padding:16px;

}


.checkout-block{ margin-bottom:14px; }

.pm-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:10px;
}
.pm-card{
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  padding:12px;
  background:#ffffff;
  display:flex;
  align-items:center;
  gap:10px;
  cursor:pointer;
}
.pm-card input{ margin:0; }
.pm-card.is-active{ border-color: rgba(0,0,0,.18); }

.checkout-card{ padding: 14px; }
.checkout-card-head{
  display:flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 12px;
}

.checkout-note{
  border:1px dashed #ddd;
  background:#fafafa;
  padding:10px;
  border-radius:12px;
}

.checkout-form{ margin-top: 8px; }

.checkout-fields{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 680px){
  .checkout-fields{ grid-template-columns: 1fr; }
}
.field{ display:flex; flex-direction:column; gap:6px; }
.field-full{ grid-column: 1 / -1; }

.form-label{ font-weight: 600; font-size: 13px; color: #444; }
.input{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  display:block;
  border:1px solid #e6e6e6;
  border-radius: 12px;
  padding: 10px 12px;
  outline:none;
  background:#fff;
}
.input:focus{ border-color:#cfcfcf; }

.checkout-bank{
  margin-top: 12px;
  border: 1px solid #eee;
  background: #fafafa;
  border-radius: 14px;
  overflow: hidden;
}
.checkout-bank-head{
  padding: 12px;
  display:flex;
  align-items:center;
  justify-content: space-between;
  border-bottom:1px solid #eee;
}
.checkout-pill{
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  border:1px solid #e6e6e6;
  background:#fff;
}
.checkout-bank-body{ padding: 12px; }
.checkout-bank-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 12px;
}
@media (max-width: 680px){
  .checkout-bank-grid{ grid-template-columns: 1fr; }
}

.checkout-submit{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  margin-top: 12px;
  border-radius: 14px;
}

.checkout-summary{
  padding: 14px;
  position: sticky;
  top: 88px;
}
@media (max-width: 980px){
  .checkout-summary{ position: static; }
}

.checkout-summary-head{
  display:flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 10px;
}

.checkout-items{
  display:flex;
  flex-direction: column;
  gap: 10px;
  max-height: 320px;
  overflow:auto;
  padding-right: 6px;
}
.checkout-item-title{ font-weight:600; }
.checkout-divider{ height:1px; background:#eee; margin: 12px 0; }

.checkout-totals .row{
  display:flex;
  justify-content: space-between;
  margin: 6px 0;
  color:#555;
}
.checkout-grand{
  display:flex;
  justify-content: space-between;
  margin-top: 10px;
  font-size: 16px;
}

/* =========================================================
   Checkout v2 (address -> payment)  (Default theme)
   ========================================================= */
.checkout2-bg{background:#f6f7fb;padding:22px 0 36px;}
.checkout2-page{max-width:1220px;margin:auto;}
.checkout2-grid{display:grid;grid-template-columns:1fr 380px;gap:22px;align-items:start;}
.checkout2-grid.is-locked{opacity:.55;pointer-events:none;filter:grayscale(.15);}
.checkout2-left{min-width:0;}
.checkout2-right{min-width:0;}

/* cards */
.checkout2-card{border:1px solid rgba(15,23,42,.10);border-radius:18px;background:#fff;}
.checkout2-card .card-head{display:flex;gap:12px;align-items:flex-start;padding:16px 16px 12px;border-bottom:1px solid rgba(15,23,42,.06);}
.card-head-icon{width:44px;height:44px;border-radius:999px;background:#0f172a;color:#fff;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.card-title{font-weight:800;font-size:16px;line-height:1.2;}
.card-sub{font-size:12px;margin-top:3px;}
.checkout2-block{padding:16px;}
.block-title{font-weight:800;margin-bottom:10px;}
.checkout2-note{padding:12px 14px;margin:12px 16px;border:1px dashed rgba(15,23,42,.18);border-radius:14px;background:rgba(15,23,42,.02);}
.checkout2-actions{display:flex;justify-content:flex-end;gap:10px;padding:14px 16px;border-top:1px solid rgba(15,23,42,.06);}
.checkout2-add-addr{margin-top:12px;}
.checkout2-add-addr .plus{font-weight:900;margin-right:6px;}
.checkout2-checkbox{display:flex;align-items:center;gap:10px;margin-top:14px;color:rgba(15,23,42,.85);font-size:13px;}
.checkout2-checkbox input{width:16px;height:16px;}

/* steps */
.checkout2-steps{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1px solid rgba(15,23,42,.10);border-radius:18px;padding:18px 18px;margin-bottom:18px;background:#fff;}
.checkout2-steps .step{display:flex;align-items:center;gap:12px;min-width:0;}
.checkout2-steps .step-line{flex:1;height:4px;border-radius:999px;background:rgba(15,23,42,.10);position:relative;}
.checkout2-steps .step-line:before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--progress,0%);background:#16a34a;border-radius:999px;}

/* Checkout toast */
.co-toast{position:fixed;left:50%;top:18px;transform:translateX(-50%);z-index:9999;opacity:0;pointer-events:none;
  background:#0f172a;color:#fff;border-radius:999px;padding:10px 14px;font-size:13px;box-shadow:0 12px 30px rgba(15,23,42,.18);
  transition:opacity .18s ease, transform .18s ease;}
.co-toast.is-show{opacity:1;transform:translateX(-50%) translateY(0);}
.co-toast.is-success{background:#16a34a;}
.co-toast.is-error{background:#ef4444;}
.step-dot{width:62px;height:62px;border-radius:999px;background:#fff;border:3px solid rgba(15,23,42,.14);display:flex;align-items:center;justify-content:center;position:relative;color:rgba(15,23,42,.55);flex:0 0 auto;}
.step-dot .ico{display:block;}
.step-dot:before{content:"";position:absolute;inset:-16px;border-radius:999px;background:rgba(59,130,246,.12);opacity:0;}
.step-check{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:900;opacity:0;color:#fff;font-size:18px;}
.step-text{min-width:0;}
.step-kicker{font-size:12px;color:rgba(15,23,42,.55);}
.step-title{font-weight:900;color:#111827;}
.step.is-active .step-dot{border-color:#3b82f6;color:#3b82f6;}
.step.is-active .step-dot:before{opacity:1;}
.step.is-done .step-dot{background:#16a34a;border-color:#16a34a;color:#fff;}
.step.is-done .step-dot:before{opacity:0;}
.step.is-done .step-dot .ico{opacity:0;}
.step.is-done .step-check{opacity:1;}
.step.is-done .step-kicker,.step.is-done .step-title{color:#16a34a;}

/* address cards */
.addr-list{display:flex;flex-direction:column;gap:12px;}
.addr-card{border:1px solid rgba(15,23,42,.10);border-radius:16px;background:#fff;display:flex;align-items:flex-start;gap:12px;padding:14px;text-align:left;cursor:pointer;position:relative;}
.addr-card:hover{border-color:rgba(15,23,42,.22);}
.addr-card.is-selected{border-color:rgba(37,99,235,.55);background:rgba(37,99,235,.06);}
.addr-icon{width:34px;height:34px;border-radius:12px;background:rgba(37,99,235,.12);display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.addr-body{min-width:0;}
.addr-title{font-weight:900;}
.addr-meta{font-size:12px;line-height:1.25;margin-top:3px;}
.addr-check{margin-left:auto;width:26px;height:26px;border-radius:999px;background:rgba(37,99,235,.12);display:flex;align-items:center;justify-content:center;color:#2563eb;font-weight:900;opacity:0;}
.addr-card.is-selected .addr-check{opacity:1;}

/* mini blocks */
.checkout2-summary-block{padding:16px;}
.mini-card{border:1px solid rgba(15,23,42,.10);border-radius:16px;padding:14px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;background:#fff;}
.mini-card-title{font-weight:900;}
.mini-card-meta{font-size:12px;margin-top:4px;white-space:pre-line;}
.mini-card-action{border:0;background:transparent;color:#2563eb;font-weight:800;cursor:pointer;}
.secure-pill{display:flex;align-items:center;gap:10px;border:1px solid rgba(37,99,235,.25);background:rgba(37,99,235,.06);padding:12px 14px;border-radius:16px;margin-top:12px;font-size:13px;}
.secure-pill b{font-weight:900;}

/* right summary */
.co-items{padding:14px 16px;display:flex;flex-direction:column;gap:12px;}
.co-item{display:grid;grid-template-columns:54px 1fr auto;gap:12px;align-items:center;}
.co-item-media{width:54px;height:54px;border-radius:14px;border:1px solid rgba(15,23,42,.10);overflow:hidden;background:rgba(15,23,42,.03);}
.co-item-media img{width:100%;height:100%;object-fit:cover;display:block;}
.co-item-ph{width:100%;height:100%;background:repeating-linear-gradient(45deg,#f3f4f6,#f3f4f6 10px,#e5e7eb 10px,#e5e7eb 20px);}
.co-item-title{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px;}
.co-item-meta{font-size:12px;margin-top:3px;}
.co-item-price{font-weight:900;white-space:nowrap;}
.checkout2-divider{height:1px;background:rgba(15,23,42,.08);margin:0 16px;}
.co-totals{padding:14px 16px 16px;}
.co-grand{border-top:1px solid rgba(15,23,42,.08);margin-top:10px;padding-top:12px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.co-grand strong{font-size:22px;}
.co-secure{margin-top:10px;}
.co-coupon-form{display:flex;gap:10px;padding:14px 16px 16px;}
.co-coupon-form .input{flex:1;}

/* modal */
.co-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:18px;}
body.modal-open{overflow:hidden;}
.co-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.55);}
.co-modal-card{position:relative;z-index:1;background:#fff;border-radius:18px;border:1px solid rgba(15,23,42,.12);width:min(760px, 100%);max-height:86vh;overflow:auto;}
.co-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 16px 12px;border-bottom:1px solid rgba(15,23,42,.06);}
.co-modal-title{font-weight:900;font-size:16px;}
.co-modal-close{border:1px solid rgba(15,23,42,.14);background:#fff;border-radius:12px;width:38px;height:38px;cursor:pointer;}
.co-modal-body{padding:16px;}
.co-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px;}
.co-modal-msg{margin-top:10px;color:#b91c1c;}

/* bank modal */
.bank-total{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid rgba(15,23,42,.10);border-radius:14px;padding:12px 14px;}
.bank-total strong{font-size:18px;}
.bank-info{margin-top:12px;border:1px solid rgba(245,158,11,.35);background:rgba(245,158,11,.12);border-radius:14px;padding:12px 14px;}
.bank-info-title{font-weight:900;margin-bottom:6px;}
.bank-info ul{margin:0;padding-left:18px;}
.bank-details{margin-top:12px;border:1px solid rgba(15,23,42,.10);background:rgba(15,23,42,.02);border-radius:14px;padding:12px 14px;}
.bank-empty{margin-top:12px;border:1px solid rgba(15,23,42,.10);background:rgba(15,23,42,.02);border-radius:14px;padding:12px 14px;color:rgba(15,23,42,.75);}
.bank-proof{margin-top:12px;}

@media (max-width:980px){
  .checkout2-grid{grid-template-columns:1fr;}
  .checkout2-steps{flex-direction:column;align-items:stretch;}
  .checkout2-steps .step-line{width:100%;}
  .co-item-title{max-width:160px;}
}

/* =========================
   PRODUCT GRID / CARD (final)
   Dosyada tekrar eden kuralların etkisini sabitlemek için en sona tek tanım.
========================= */
.product-grid{
  display:grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap:16px;
  align-items: stretch;
}
@media (max-width:1100px){
  .product-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width:640px){
  .product-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap:12px; }
}

.product-image-placeholder{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#6b7280;
  font-size:13px;
}


/* View/sort bar (products & category) */
.view-sort-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px;flex-wrap:wrap}
.view-toggle{display:flex;gap:6px;align-items:center;padding:4px;border:1px solid rgba(0,0,0,.08);border-radius:12px;background:rgba(255,255,255,.75)}
.dark .view-toggle, body.dark .view-toggle{border-color:rgba(255,255,255,.14);background:rgba(17,24,39,.55)}
.view-btn{display:inline-flex;align-items:center;justify-content:center;padding:8px;border-radius:10px;border:0;background:transparent;cursor:pointer;transition:transform .12s ease, background-color .12s ease, color .12s ease}
.view-btn .icon{width:16px;height:16px}
.view-btn.is-active{background:linear-gradient(90deg,#111827,#0f172a);color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.18)}
.view-btn:not(.is-active){color:rgba(0,0,0,.6)}
.dark .view-btn:not(.is-active), body.dark .view-btn:not(.is-active){color:rgba(255,255,255,.65)}
.view-btn:hover{transform:translateY(-1px)}
.sort-select{min-width:180px;max-width:100%;padding:10px 12px;border-radius:12px;border:1px solid rgba(0,0,0,.12);background:rgba(255,255,255,.9);color:#111827}
.dark .sort-select, body.dark .sort-select{border-color:rgba(255,255,255,.14);background:rgba(17,24,39,.55);color:rgba(255,255,255,.85)}

/* List view (horizontal card) */
.product-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.product-list .product-card{
  display:flex;
  gap:14px;
  align-items:center;
  padding:14px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  overflow:hidden;
  transition: box-shadow .18s ease, transform .18s ease;
}

.product-list .product-card:hover{
  transform: translateY(-1px);
}

.dark .product-list .product-card,
body.dark .product-list .product-card{
  background: rgba(17,24,39,.55);
  border-color: rgba(255,255,255,.12);
}

.product-list .product-media-wrap{
  flex:0 0 128px;
  max-width:128px;
}

/* Make thumbnail square in list mode */
.product-list .product-image-link .product-media{
  aspect-ratio: 1 / 1;
  height:128px;
  border-radius:14px;
}

.product-list .product-image,
.product-list .product-video{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  height:100%;
  object-fit:cover;
}

/* Move fav into top-right of thumb */
.product-list .fav-btn{
  top:10px;
  right:10px;
}

/* Info layout */
.product-list .product-info{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:2px 0;
}

.product-list .product-title{
  font-size:16px;
  line-height:1.25;
  margin:0;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.product-list .product-pricing{
  display:flex;
  align-items:baseline;
  gap:10px;
}

.product-list .product-price{ font-size:18px; }
.product-list .product-old-price{ opacity:.6; }

.product-list .product-actions{
  position:static;
  margin-left:auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  width:190px;
}

.product-list .product-actions .btn-add-to-cart,
.product-list .product-actions .btn-variant-popup,
.product-list .product-actions .btn-out-of-stock{
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    height: 44px;
    border-radius: 14px;
    white-space: nowrap;
    background: black;
    color: white;
}

@media (max-width: 520px){
  .sort-select{min-width:100%}
  .product-list .product-card{gap:12px;padding:12px}
  .product-list .product-media-wrap{flex-basis:108px;max-width:108px}
  .product-list .product-image-link .product-media{height:108px}
  .product-list .product-actions{width:150px}
  .product-list .product-actions .btn-add-to-cart,
  .product-list .product-actions .btn-variant-popup,
  .product-list .product-actions .btn-out-of-stock{height:40px}
}

/* List view UX tweaks: no hover effects + actions always visible (keep grid hover intact) */
.product-list .product-card{transition:none;}
.product-list .product-card:hover{transform:none; box-shadow:0 10px 30px rgba(15,23,42,.06);} /* neutralize hover */
.product-list .product-media-wrap::after{display:none !important;}
.product-list .media-actions,
.product-list .product-actions{
  opacity:1 !important;
  transform:none !important;
  pointer-events:auto !important;
  transition:none !important;
  margin:0; /* no overlay spacing */
}

/* =========================
   ACCOUNT (DEFAULT THEME)
========================= */

.account-page{
  margin: 24px auto;
}

/* Make container centered if theme's container doesn't set margin */
.account-page.container{ margin-left:auto;margin-top: 90px; margin-right:auto; }

.account-page h1{
  font-size: 22px;
  margin: 0 0 14px;
  letter-spacing: -0.01em;
}

/* Generic card (some pages rely on .card but base theme didn't define it) */
.card{
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  padding: 14px;
}

/* Generic card (some pages rely on .card but base theme didn't define it) */
.card_blog{
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  padding: 14px;
}
.card_page{
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  padding: 14px;
}

/* Account grids: improve spacing + mobile stacking (inline grid-template-columns remains) */
.account-page .grid{
  gap: 14px !important;
}

@media (max-width: 900px){
  .account-page .grid{
    grid-template-columns: 1fr !important;
  }
}

/* Account menu (new _menu.php markup) */
.account-menu{ padding: 14px; }
.account-user{ margin-bottom: 12px; }
.account-user__name{ font-weight: 900; }

/* Generic grid helper (used across templates).
   Many pages rely on .grid + util-gri-* classes, so ensure .grid actually creates a grid. */
.grid{ display: grid; }
.grid > *{ min-width: 0; }
.account-user__email{ color:#667085; font-size: 13px; margin-top: 2px; }

.account-nav{ display:flex; flex-direction:column; gap: 6px; }
.account-nav__link{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.06);
  background: rgba(15,23,42,.02);
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.acc-ico{ width: 22px; height: 22px; display:inline-flex; align-items:center; justify-content:center; font-size: 16px; }
.account-nav__link:hover{
  background: rgba(15,23,42,.05);
  border-color: rgba(0,0,0,.10);
  transform: translateY(-1px);
}
.account-nav__link.is-active{
  background: #0f172a;
  border-color: #0f172a;
  color: #fff;
}

/* Filters bar (orders) */
.acc-filters{
  margin: 10px 0 12px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(0,0,0,.06);
  background: rgba(15,23,42,.02);
}

/* Keep status chips visible while scrolling long orders list */
.acc-filters--sticky{
  position: sticky;
  top: 10px;
  z-index: 5;
  backdrop-filter: blur(10px);
}
.acc-filters__row{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap: 10px;
}
.acc-field{ min-width: 0; }
.acc-label{ display:block; font-size: 12px; font-weight: 800; color:#667085; margin-bottom: 6px; }
.acc-filters__actions{ display:flex; gap:10px; margin-top: 10px; flex-wrap:wrap; }
@media (max-width: 900px){
  .acc-filters__row{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px){
  .acc-filters__row{ grid-template-columns: 1fr; }
}

.account-logout{ margin-top: 12px; }
.account-logout__btn{ width: 100%; }

/* Tables inside account */
.account-page table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin-top: 10px;
}
.account-page thead th{
  text-align: left;
  font-size: 12px;
  color: #667085;
  font-weight: 800;
  padding: 10px 12px;
  background: rgba(15,23,42,.03);
  border-top: 1px solid rgba(0,0,0,.08);
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.account-page thead th:first-child{ border-top-left-radius: 12px; }
.account-page thead th:last-child{ border-top-right-radius: 12px; }

.account-page tbody td{
  padding: 12px;
  border-bottom: 1px solid rgba(0,0,0,.06);
  vertical-align: middle;
}
.account-page tbody tr:hover td{ background: rgba(15,23,42,.02); }

/* Badges for statuses */
.account-badge, .badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(15,23,42,.04);
}

/* Order status badges (Turkish labels) */
.status-badge{
  display:inline-flex;
  align-items:center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(15,23,42,.04);
}
.status-badge.is-new{ background: rgba(59,130,246,.12); border-color: rgba(59,130,246,.24); }
.status-badge.is-pending{ background: rgba(245,158,11,.14); border-color: rgba(245,158,11,.25); }
.status-badge.is-processing{ background: rgba(99,102,241,.14); border-color: rgba(99,102,241,.25); }
.status-badge.is-paid{ background: rgba(16,185,129,.14); border-color: rgba(16,185,129,.25); }
.status-badge.is-shipped{ background: rgba(14,165,233,.14); border-color: rgba(14,165,233,.25); }
.status-badge.is-delivered{ background: rgba(34,197,94,.14); border-color: rgba(34,197,94,.25); }
.status-badge.is-completed{ background: rgba(34,197,94,.14); border-color: rgba(34,197,94,.25); }
.status-badge.is-canceled{ background: rgba(239,68,68,.14); border-color: rgba(239,68,68,.25); }
.status-badge.is-refunded{ background: rgba(244,63,94,.14); border-color: rgba(244,63,94,.25); }
.status-badge.is-failed{ background: rgba(239,68,68,.14); border-color: rgba(239,68,68,.25); }
.status-badge.is-unknown{ opacity: .9; }

/* Info box (digital products) */
.acc-info{
  margin: 10px 0 12px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(0,0,0,.06);
  background: rgba(15,23,42,.02);
}
.acc-info__title{ font-weight: 900; margin-bottom: 6px; }
.acc-info__text{ color:#475467; font-size: 13px; line-height: 1.45; }
.account-badge.is-pending{ background: rgba(245, 158, 11, .14); border-color: rgba(245, 158, 11, .25); }
.account-badge.is-approved{ background: rgba(16, 185, 129, .14); border-color: rgba(16, 185, 129, .25); }
.account-badge.is-rejected{ background: rgba(239, 68, 68, .14); border-color: rgba(239, 68, 68, .25); }

/* Forms in account */
.account-page input,
.account-page select,
.account-page textarea{
  width: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
}
.account-page input:focus,
.account-page select:focus,
.account-page textarea:focus{
  outline:none;
  border-color: rgba(0,0,0,.35);
  box-shadow: 0 0 0 4px rgba(15, 23, 42, .08);
}

/* Buttons spacing inside action cells */
.account-page td .btn{ padding: 8px 10px; border-radius: 12px; }
.account-page td form{ display:inline-flex; gap: 8px; align-items:center; }


/* Account layout helpers (used in v4 views) */
.account-layout{
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 14px;
  align-items: start;
}
.account-sidebar{ min-width: 0; }
.account-content{ min-width: 0; }
@media (max-width: 900px){
  .account-layout{ grid-template-columns: 1fr; }
}

.account-title{ font-size: 22px; margin: 0 0 14px; }
.account-section-title{ font-weight: 900; font-size: 16px; margin-bottom: 10px; }

.account-table-wrap{ overflow:auto; }

/* =========================
   MOBILE FILTERS DRAWER (products/category)
========================= */

.filters-mobile-bar{ margin-bottom: 10px; }

.filters-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  z-index: 9997;
}
.filters-overlay.open{ display:block; }

/* Desktop: keep aside normal */
.filters-drawer{
  position:relative;
}

@media (max-width: 900px){
  .filters-drawer{
    position:fixed;
    top:0;
    left:0;
    height:100vh;
    width:86vw;
    max-width:360px;
    background:#fff;
    z-index: 9998;
    transform:translateX(-105%);
    transition:transform .2s ease;
    overflow:auto;
    padding:14px;
    box-shadow: 14px 0 40px rgba(0,0,0,.22);
  }
  .filters-drawer.open{ transform:translateX(0); }

  /* Ensure aside cards look good inside drawer */
  .filters-drawer .card{ margin:0 0 12px; }

  /* Layout: stack */
  .products-page{ display:block !important; }
  .products-main{ width:100% !important; }
}
.account-table{ width:100%; border-collapse: separate; border-spacing: 0; }
.account-table th, .account-table td{ padding: 10px 12px; border-bottom: 1px solid rgba(0,0,0,.06); }
.account-table th{ text-align:left; font-size: 12px; color:#667085; letter-spacing: .02em; text-transform: uppercase; background: rgba(15,23,42,.02); position: sticky; top: 0; }
.account-table tbody tr:hover td{ background: rgba(15,23,42,.02); }

.ta-right{ text-align:right; }
.nowrap{ white-space: nowrap; }
.inline-actions{ display:inline-flex; gap: 8px; align-items:center; margin-left: 8px; }

.status-badge{
  display:inline-flex;
  align-items:center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(15,23,42,.04);
}
.status-badge.status-new, .status-badge.status-pending{ background: rgba(245, 158, 11, .14); border-color: rgba(245, 158, 11, .25); }
.status-badge.status-processing{ background: rgba(59, 130, 246, .14); border-color: rgba(59, 130, 246, .25); }
.status-badge.status-completed, .status-badge.status-delivered, .status-badge.status-paid{ background: rgba(16, 185, 129, .14); border-color: rgba(16, 185, 129, .25); }
.status-badge.status-cancelled, .status-badge.status-rejected{ background: rgba(239, 68, 68, .14); border-color: rgba(239, 68, 68, .25); }

/* Old price (product detail) - JS toggles display */

/* ------------------------------
   Product detail: left media + right sidebar (reference layout)
------------------------------ */
.pd-layout{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:48px;
  align-items:start;
  margin-top:16px;
}
.pd-layout__media{min-width:0;}
.pd-layout__sidebar{min-width:0;}

@media (max-width: 1024px){
  .pd-layout{grid-template-columns:1fr; gap:24px;}
}

/* Ensure media stage doesn't overflow in grid */
.pd-media2{width:100%;}

.util-tex-line-through-opa-65-2{ text-decoration:line-through; opacity:.65; margin-left:8px; display:none; }

/* === Auto-generated: extracted inline styles & <style> blocks === */

/* From themes/default/layout.php */
/* default (inner pages) */
.site-header{
  background: #000;
}

/* HOME: transparent header (Style 1 only)
   Style 2 is a light header and should keep its own background. */
body.is-home .site-header.header--style1{
  background: transparent;
}

/* HOME: scroll olunca siyaha dönsün (opsiyonel, senin scroll scriptin is-scrolled ekliyor) */
body.is-home .site-header.header--style1.is-scrolled{
  background: #000;
}

/* HOME: şeffafken ikon/text beyaz olsun (istersen) */
body.is-home .site-header.header--style1:not(.is-scrolled) a,
body.is-home .site-header.header--style1:not(.is-scrolled) .nav-btn,
body.is-home .site-header.header--style1:not(.is-scrolled) svg{
  
}

/* Home Builder Slider: when using contained mode on the home page,
   add top padding equal to the header offset so the slider doesn't sit under the header.
   Full-width sliders remain flush (hero look). */


/* From themes/default/partials/product_slider.php */
.product-slider{position:relative}
.ps-track{display:flex;gap:14px;overflow:auto;scroll-snap-type:x mandatory;padding:2px 2px 8px;scrollbar-width:thin}
.ps-item{flex:0 0 260px;scroll-snap-align:start}
@media (max-width: 860px){.ps-item{flex-basis:72vw;max-width:72vw}}
.ps-nav{position:absolute;top:40%;transform:translateY(-50%);width:38px;height:38px;border-radius:999px;border:1px solid #e2e8f0;background:#fff;box-shadow:0 10px 25px rgba(2,6,23,.12);display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:.95}
.ps-prev{left:-12px}
.ps-next{right:-12px}
@media (max-width: 640px){.ps-nav{display:none}}
.card.is-oos{opacity:.55;filter:grayscale(1)}

/* From themes/default/partials/footer.php */
/* Footer */
.site-footer {
  background: #f5f5f5;
  color: #cbd5e1;
  padding: 48px 0 24px;
  border-top: none;
}
.hb-video {
    padding: 36px;
}
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* Footer Grid */
.footer-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
  margin-bottom: 40px;
}

/* Footer Columns */
.footer-col {
  display: flex;
  flex-direction: column;
}

.footer-col-title {
  color: #4b4b4b;
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 20px 0;
  position: relative;
  padding-bottom: 10px;
}

.footer-col-title::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 40px;
  height: 2px;
  background: #3b82f6;
}

/* Footer Links */
.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-links li {
  margin-bottom: 12px;
}

.footer-links a {
  color: #94a3b8;
  text-decoration: none;
  transition: color 0.3s ease;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}




/* Footer Logo */
.footer-logo {
  margin-bottom: 20px;
}

.footer-logo img {
  height: 40px;
  width: auto;
  opacity: 0.9;
}

.footer-description {
  color: #94a3b8;
  font-size: 14px;
  line-height: 1.6;
  margin: 0 0 20px 0;
}

/* Social Icons */
.footer-social {
  display: flex;
  gap: 12px;
  margin-top: 10px;
}

.social-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  text-decoration: none;
  font-size: 16px;
  transition: all 0.3s ease;
}

.social-icon:hover {
  background: #3b82f6;
  transform: translateY(-3px);
  box-shadow: 0 5px 15px rgba(59, 130, 246, 0.3);
}

/* Footer Bottom */
.footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  flex-wrap: wrap;
  gap: 20px;
}

.copyright {
  color: #94a3b8;
  font-size: 14px;
  margin: 0;
}

/* Payment Methods */
.payment-methods {
  display: flex;
  gap: 12px;
  align-items: center;
}

.payment-method {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.05);
  color: #fff;
  font-size: 18px;
  transition: all 0.3s ease;
}

.payment-method:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

/* Footer Extra */
.footer-extra {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: #94a3b8;
  font-size: 14px;
  text-align: center;
}

/* Custom HTML */
.footer-custom-html {
  margin-bottom: 40px;
}

/* Responsive */
@media (max-width: 992px) {
  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
  }
  
  .site-footer {
    padding: 40px 0 20px;
  }
}

@media (max-width: 768px) {
  .footer-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  
  .footer-bottom {
    flex-direction: column;
    text-align: center;
    gap: 15px;
  }
  
  .footer-bottom-left,
  .footer-bottom-right {
    width: 100%;
    justify-content: center;
  }
  
  .payment-methods {
    justify-content: center;
  }
  
  .footer-social {
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .container {
    padding: 0 15px;
  }
  
  .footer-col-title {
    font-size: 15px;
  }
  
  .footer-links a {
    font-size: 13px;
  }
  
  .social-icon,
  .payment-method {
    width: 32px;
    height: 32px;
    font-size: 14px;
  }
}

/* From themes/default/partials/footer.php */
/* Font Awesome kullanmak isterseniz */
.social-icon i {
  font-size: 16px;
}

.payment-method i {
  font-size: 18px;
}

/* From themes/default/account/cancel_requests.php */
@media (max-width:900px){.grid{grid-template-columns:1fr !important}}

/* From themes/default/account/favorites.php */
@media (max-width:900px){.grid{grid-template-columns:1fr !important}}

/* From themes/default/account/index.php */
@media (max-width:900px){.grid{grid-template-columns:1fr !important}}

/* From themes/default/account/notifications.php */
@media (max-width:900px){.grid{grid-template-columns:1fr !important}}

/* From themes/default/account/password.php */
@media (max-width:900px){.grid{grid-template-columns:1fr !important}}

/* Inline style attribute classes */
.flex-items-center{margin-top:12px;display:flex;gap:8px;align-items:center;}
.util-h-28px-maxw-160px{height:28px;max-width:160px;object-fit:contain;display:block;}
.maxw-520{max-width:520px;}
.flex-items-center-2{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.h-12{height:12px;}
.util-gri-repeat-3-1fr-gap-10px{grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px;}
.util-gri-320px-1fr-gap-12px{grid-template-columns:320px 1fr;gap:12px;align-items:start;}
.util-gap-16px-ai-center{gap:16px;align-items:center;}
.util-w-140px-h-100px{width:140px;height:100px;object-fit:cover;border-radius:10px;}
.util-mar-0{margin:0;}
.inline-flex{display:inline-flex;}
.mt-16{margin-top:16px;}
.util-d-flex-jc-space-betwee{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #eee;padding-top:10px;}
.util-bor-4px-solid-c0{border-left:4px solid #c0392b;}
.flex-items-center-3{display:flex;gap:8px;align-items:center;margin:6px 0;cursor:pointer;}
.util-pos-absolute-top-0{position:absolute;top:0;left:0;width:100%;height:100%;border:0;border-radius:12px;}
.bg-f8fafc{background:#f8fafc;}
.util-w-100-rd-12px{width:100%;border-radius:12px;}
.util-w-100-rd-10px{width:100%;border-radius:10px;}
.util-bor-4px-solid-27{border-left:4px solid #27ae60;}
.util-fw-800-mb-8px{font-weight:800;margin-bottom:8px;}
.util-mt-10px-p-10px{margin-top:10px;padding:10px;border:1px solid #eee;background:#fafafa;border-radius:6px;}
.block{display:block;}
.util-jc-space-betwee-ai-center{justify-content:space-between;align-items:center;}
.util-mar-10px-0-0-0{margin:10px 0 0 0;}
.util-pos-absolute-bottom-10px{position:absolute;bottom:10px;left:10px;}
.util-minw-160px-fw-700{min-width:160px;font-weight:700;}
.util-fle-3{flex:3;}
.util-d-flex-gap-10px{display:grid;gap:10px;}
.util-mt-6px-whi-pre-wrap{margin-top:6px;white-space:pre-wrap;}
.flex-items-center-4{display:flex;gap:8px;align-items:center;margin-top:8px;}
.util-d-inline-flex-gap-6px{display:inline-flex;gap:6px;align-items:center;}
.flex-items-center-5{display:flex;gap:10px;align-items:center;overflow:auto;white-space:nowrap;}
.minw-200{min-width:200px;}
.util-gri-1fr-1fr-gap-12px{grid-template-columns:1fr 1fr;gap:12px;}
.util-fle-2{flex:2;}

.util-fs-22px-fw-900{font-size:22px;font-weight:900;}
.util-ai-flex-start-gap-12px{align-items:flex-start;gap:12px;}
.util-d-block-w-140px{display:block;width:140px;flex:0 0 140px;}
.util-gri-1fr-2fr-gap-12px{grid-template-columns:1fr 2fr;gap:12px;align-items:start;}
.text-right{text-align:right;}
.mt-12{margin-top:12px;}
.w-90{width:90px;}
.p-10{padding:10px;}
.util-fle-1-minw-280px{flex:1;min-width:280px;}
.util-tex-line-through-opa-65{text-decoration:line-through;opacity:.65;margin-left:8px;}
.ml-8{margin-left:8px;}
.util-d-flex-gap-10px-2{display:flex;gap:10px;flex-wrap:wrap;}
.inline-block{display:inline-block;}
.util-d-flex-ai-flex-start{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;}
.util-w-90px-h-90px{width:90px;height:90px;object-fit:cover;border-radius:999px;}
.util-mar-6px-0-0-0{margin:6px 0 0 0;}
.minw-180{min-width:180px;}
.util-d-flex-gap-10px-3{display:flex;gap:10px;margin-top:10px;}
.util-d-flex-jc-space-betwee-2{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap;}
.util-w-100-ta-center{width:100%;text-align:center;}
.h-10{height:10px;}
.none{display:none;}
.h-64{height: 64px;}
.fs-12{font-size:12px;}
.util---i-int-level{ /* legacy: indentation handled in markup */ }
.util-mar-0-0-10px{margin:0 0 10px;}
.p-20{padding:20px;}

.util-mar-24px-0{margin:24px 0;}
.p-6px-10px{padding:6px 10px;}
.flex-items-center-justify-space-between{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;}
.util-mt-6px-whi-pre-line{margin-top:6px;white-space:pre-line;}
.util-ai-flex-start-gap-16px{align-items:flex-start;gap:16px;}
.util-gri-1fr-1fr-gap-12px-2{grid-template-columns:1fr 1fr;gap:12px;align-items:start;}
.h-8{height:8px;}
.util-mt-12px-ai-flex-end{margin-top:12px;align-items:flex-end;}
.util-w-100-d-block{width:100%;display:block;}
.util-mar-6px-0-0{margin:6px 0 0;}
.util-fw-600-mb-6px{font-weight:600;margin-bottom:6px;}
.util-fs-24px-fw-800{font-size:24px;font-weight:800;}
.util-gap-8px-ai-center{gap:8px;align-items:center;margin:10px 0;}
.mt-8{margin-top:8px;}
.p-14{padding:14px;}
.util-whi-pre-wrap-mt-6px{white-space:pre-wrap;margin-top:6px;}
.text-center{text-align:center;}
.util-mt-14px-p-10px{margin-top:14px;padding:10px;border:1px solid #eee;background:#fafafa;border-radius:6px;}
.mt-4{margin-top:4px;}
.util-fle-1{flex:1;}
.util-d-flex-gap-10px-4{display:flex;gap:10px;flex-wrap:wrap;align-items:end;}
.util-d-block-mb-6px{display:block;margin-bottom:6px;}
.util-maxw-520px-mar-8vh-auto{max-width:300px;margin:8vh auto;background:#fff;border-radius:14px;padding:14px;box-shadow:0 10px 40px rgba(0,0,0,.25);}
.util-w-260px-fle-0-0-260px{width:260px;flex:0 0 260px;}
.util-d-flex-jc-space-betwee-3{display:flex;justify-content:space-between;}
.util-whi-pre-wrap{white-space:pre-wrap;}
.util-mt-14px-d-flex{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap;}
.justify-space-between{justify-content:space-between;}
.util-d-flex-fle-column{display:flex;flex-direction:column;gap:10px;}
.util-ov-auto{overflow:auto;}
.util-fs-12px-mt-8px{font-size:12px;margin-top:8px;}
.flex-items-center-6{display:flex;gap:6px;flex-wrap:wrap;align-items:center;}
.util-mar-12px-0-bd-0{margin:12px 0;border:0;border-top:1px solid #eee;}
.util-mt-8px-opa-6{margin-top:8px;opacity:.6;cursor:not-allowed;}
.util-mt-10px-fle-wrap{margin-top:10px;flex-wrap:wrap;}
.maxw-700{max-width:700px;}
.util-d-none-pos-fixed{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:9998;}
.util-p-12px-mb-12px{padding:12px;margin-bottom:12px;}
.util-h-70px-rd-12px{height:70px;border-radius:12px;}
.util-mar-16px-0-8px{margin:16px 0 8px;}
.price-old{display:none;text-decoration:line-through;opacity:.65;margin-left:8px;}
.util-fw-700-mb-10px{font-weight:700;margin-bottom:10px;}
.p-12{padding:12px;}
.p-6px-0{padding:6px 0;}
.inline{display:inline;}
.util-gap-16px-ai-flex-start{gap:16px;align-items:flex-start;}
.util-whi-pre-wrap-lh-1-6{white-space:pre-wrap;line-height:1.6;}
.mt-10{margin-top:10px;}
.util-p-10px-0-bor-1px-solid-ee{padding:10px 0;border-top:1px solid #eee;}
.util-pos-relative{position:relative;}
.util-mar-12px-0{margin:12px 0;}
.mt-14{margin-top:14px;}
.util-fle-1-pos-relative{flex:1;position:relative;}
.mb-12{margin-bottom:12px;}
.util-tex-line-through-opa-65-3{text-decoration:line-through;opacity:.65;display:none;}
.util-p-6px-10px-bd-1px-solid-ee{padding:6px 10px;border:1px solid #eee;border-radius:999px;}
.util-pos-relative-pt-56-25{position:relative;padding-top:56.25%;}
.util-d-flex-jc-space-betwee-4{display:flex;justify-content:space-between;margin-top:6px;}
.textc-c00{color:#c00;}
.util-mt-10px-p-12px{margin-top:10px;padding:12px;border:1px solid #eee;}
.util-mar-0-0-10px-0{margin:0 0 10px 0;}
.flex-center{width:90px;height:90px;border-radius:999px;background:#f2f2f2;display:flex;align-items:center;justify-content:center;}
.util-lh-1-7{line-height:1.7;}
.util-mar-8px-0{margin:8px 0;}
.util-mar-16px-0{margin:16px 0;}
.util-gri-1fr-1fr-gap-10px{grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;}
.util-gap-8px-ai-center-2{gap:8px;align-items:center;flex-wrap:wrap;}
.h-64-2{height:64px;}
.mt-6{margin-top:6px;}
.util-w-90px-h-auto{width:90px;height:auto;border-radius:10px;border:1px solid #eee;}



/* =========================
   PRODUCT DETAIL GALLERY (2-COL GRID + LIGHTBOX)
========================= */
.pd-media{display:flex;flex-direction:column;gap:12px}
.pd-main{position:relative;display:block;border-radius:14px;overflow:hidden;border:1px solid rgba(0,0,0,.08);background:rgba(0,0,0,.03)}
.pd-main img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;display:block;transition:transform .15s ease}
.pd-main__hint{position:absolute;right:10px;bottom:10px;padding:6px 10px;border-radius:999px;background:rgba(0,0,0,.45);color:#fff;font-size:12px;backdrop-filter:blur(6px)}
.pd-main.is-zoom img{transform:scale(1.9)}

.pd-thumbs{display:flex;gap:10px;overflow:auto;padding-bottom:2px;scrollbar-width:thin}
.pd-thumbs.is-switching{opacity:.45;filter:blur(.2px);transition:opacity .15s ease}
.pd-thumb{flex:0 0 auto;display:block;width:74px;height:74px;border-radius:12px;overflow:hidden;border:1px solid rgba(0,0,0,.10);background:rgba(0,0,0,.04);opacity:.9;transition:transform .12s ease, opacity .12s ease, border-color .12s ease, box-shadow .12s ease}
.pd-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.pd-thumb:hover{opacity:1;transform:translateY(-1px)}
.pd-thumb.is-active{opacity:1;border-color:rgba(17,24,39,.55);box-shadow:0 6px 18px rgba(0,0,0,.08)}

/* Color-specific gallery UX */
.pd-color-note{margin-top:8px}
.pd-color-note__pill{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;border:1px solid rgba(0,0,0,.10);background:rgba(0,0,0,.03);font-size:12px;color:rgba(17,24,39,.85)}
.pd-thumbs.is-switching{opacity:.55;filter:blur(.2px);transition:opacity .18s ease, filter .18s ease}

@media(max-width:768px){
  .pd-thumb{width:64px;height:64px}
  .pd-main__hint{right:8px;bottom:8px;font-size:11px}
}

/* Lightbox */

.pd-lightbox{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.75);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
}
.pd-lightbox.is-open{ display:flex; }
.pd-lightbox__stage{
  position:relative;
  max-width:min(1000px,92vw);
  max-height:92vh;
  width:92vw;
  display:flex;
  align-items:center;
  justify-content:center;
}
.pd-lightbox__stage img{
  max-width:100%;
  max-height:92vh;
  border-radius:14px;
  background:#111;
}
.pd-lightbox__close{
  position:absolute;
  top:16px;
  right:16px;
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.25);
  background:rgba(0,0,0,.35);
  color:#fff;
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.pd-lightbox__nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:48px;
  height:48px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.25);
  background:rgba(0,0,0,.35);
  color:#fff;
  font-size:34px;
  line-height:1;
  cursor:pointer;
}
.pd-lightbox__prev{ left:16px; }
.pd-lightbox__next{ right:16px; }

@media(max-width:768px){
  .pd-gallery{ gap:10px; }
  .pd-lightbox__nav{ width:42px;height:42px;font-size:30px; }
  .pd-lightbox__close{ width:40px;height:40px;font-size:26px; }
}



/* =========================
   PRODUCT REVIEWS SUMMARY
========================= */
.review-summary{margin-top:10px}
.review-summary__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.review-summary__title{font-weight:700;font-size:16px;margin-bottom:6px}
.review-summary__meta{display:flex;align-items:baseline;gap:10px}
.review-summary__avg{font-size:28px;font-weight:800;line-height:1}
.review-summary__count{color:var(--muted,#6b7280);font-size:13px}
.review-summary__liked{margin-top:6px;color:var(--muted,#6b7280);font-size:13px}
.review-summary__breakdown{display:flex;flex-direction:column;gap:8px}
.review-row{display:grid;grid-template-columns:20px 1fr 44px 22px;gap:10px;align-items:center}
.review-row__star{font-weight:700}
.review-row__bar{height:8px;border-radius:999px;background:rgba(107,114,128,.18);overflow:hidden}
.review-row__fill{height:100%;background:rgba(17,24,39,.75)}
.review-row__pct{font-size:12px;color:var(--muted,#6b7280);text-align:right}
.review-row__count{font-size:12px;color:var(--muted,#6b7280);text-align:right}
@media(max-width:768px){
  .review-summary__head{flex-direction:column;align-items:stretch}
  .review-row{grid-template-columns:20px 1fr 44px 22px}
}

/* =========================
   PRODUCT REVIEWS LIST (Modern)
========================= */
.review-list{display:flex;flex-direction:column;gap:12px}
.review-card{border:1px solid rgba(17,24,39,.12);border-radius:14px;padding:14px;background:#fff}
.review-card__top{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.review-card__name{font-weight:700;line-height:1.2}
.review-card__meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;align-items:center}
.review-card__time{font-size:12px;color:var(--muted,#6b7280)}
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:12px;line-height:1;border:1px solid rgba(17,24,39,.14);background:rgba(17,24,39,.03);color:#111827}
.badge-verified::before{content:"✓";font-weight:900}
.review-card__rating{text-align:right;min-width:84px}
.review-card__score{font-weight:800}
.review-card__stars{font-size:13px;letter-spacing:1px}
.review-card__body{margin-top:10px;color:#111827}
.review-card__actions{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap}
.review-vote{appearance:none;border:1px solid rgba(17,24,39,.18);background:#fff;border-radius:10px;padding:8px 10px;font-weight:600;font-size:13px;cursor:pointer}
.review-vote:hover{background:rgba(17,24,39,.04)}
.review-vote.is-selected{border-color:rgba(17,24,39,.38);background:rgba(17,24,39,.06)}
.review-vote:disabled{opacity:.65;cursor:not-allowed}

.review-vote-stats{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--muted,#6b7280)}
.review-vote-stats:empty{display:none}
.review-vote-stats__total:empty,.review-vote-stats__pct:empty{display:none}
@media(max-width:768px){
  .review-card__top{flex-direction:column;align-items:stretch}
  .review-card__rating{text-align:left}
}




/* ===============================
   GRID PRODUCT CARD - ACTIONS OVER IMAGE (HOVER)
   Keeps LIST view unchanged.
================================ */
.product-grid .product-card{
  display:grid;   
  margin-bottom: 10px;
  grid-template-columns:1fr;
  grid-template-areas:
    "media"
    "info";
}
.product-grid .product-media-wrap{ grid-area:media; position:relative; }
.product-grid .product-info{ grid-area:info; }
.product-grid .product-actions{
  grid-area:media;
  margin-top:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-self:stretch;
  z-index:5;
  pointer-events:none;
}
.product-grid .product-actions .btn,
.product-grid .product-actions button{
  pointer-events:auto;
  box-sizing:border-box;
  opacity:0;
  transform:translateY(10px);
  transition:opacity .25s ease, transform .25s ease;
}
.product-grid .product-card:hover .product-actions .btn,
.product-grid .product-card:hover .product-actions button{
  opacity:1;
  transform:none;
}


/* ================================
   Grid kolon ayarları (products/category)
   Admin > Site Özellikleri > Ürün Ayarları
================================ */
@media (min-width: 1024px) {
  .product-grid.grid-cols-d-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-grid.grid-cols-d-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .product-grid.grid-cols-d-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .product-grid.grid-cols-d-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .product-grid.grid-cols-d-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (min-width: 768px) and (max-width: 1023.98px) {
  .product-grid.grid-cols-t-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-grid.grid-cols-t-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .product-grid.grid-cols-t-4 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .product-grid.grid-cols-t-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .product-grid.grid-cols-t-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .product-grid.grid-cols-m-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .product-grid.grid-cols-m-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-grid.grid-cols-m-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .product-grid.grid-cols-m-4 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}


/* =========================
   HOME BUILDER: FLASH DEAL
========================= */
.deal-section .section-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px
}
.deal-section .section-link{color:#666;text-decoration:none}
.deal-section .section-link:hover{text-decoration:underline}

/* Multiple deals: stack cards with consistent spacing */
.deal-grid{display:grid;gap:14px}

.deal-card{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:14px;
  border:1px solid #eee;
  border-radius:16px;
  padding:14px;
  background:#fff;
  overflow:hidden;
}
.deal-media{
  position:relative;
  display:block;
  border-radius:14px;
  overflow:hidden;
  background:#f3f4f6;
  min-height:260px;
}
.deal-media img{width:100%;height:100%;min-height:260px;object-fit:cover;display:block;transition:transform .25s ease}
.deal-media-placeholder{width:100%;height:100%;min-height:260px}
.deal-badge{
  position:absolute;left:12px;top:12px;
  background:#ef4444;color:#fff;
  padding:6px 10px;border-radius:999px;
  font-size:12px;font-weight:700
}
.deal-hover{
  position:absolute;right:12px;bottom:12px;
  background:rgba(0,0,0,.65);color:#fff;
  padding:6px 10px;border-radius:999px;
  font-size:12px;opacity:0;transform:translateY(6px);
  transition:all .2s ease
}
.deal-media:hover img{transform:scale(1.04)}
.deal-media:hover .deal-hover{opacity:1;transform:none}

.deal-body{display:flex;flex-direction:column;gap:10px}
.deal-title{margin:0;font-size:18px;line-height:1.25}
.deal-title a{text-decoration:none;color:inherit}
.deal-title a:hover{text-decoration:underline}

.deal-prices{display:flex;align-items:baseline;gap:10px}
.deal-price{font-size:22px;font-weight:800}
.deal-old{color:#6b7280;text-decoration:line-through}

.deal-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.deal-actions form{margin:0}

.deal-meta{font-size:12px;margin-top:auto}

@media(max-width:900px){
  .deal-card{grid-template-columns:1fr}
  .deal-media img, .deal-media-placeholder{min-height:220px}
}


/* =========================
   Bottom search sheet (header search)
   ========================= */
.search-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:9998}
.search-sheet{position:fixed;left:0;right:0;bottom:0;z-index:9999;background:#fff;border-radius:16px 16px 0 0;box-shadow:0 -12px 40px rgba(0,0,0,.18);transform:translateY(110%);transition:transform .22s ease;max-height:78vh;display:flex;flex-direction:column}
.search-sheet.is-open{transform:translateY(0)}
.search-sheet__handle{width:44px;height:5px;border-radius:999px;background:#d1d5db;margin:10px auto 6px;touch-action:none;cursor:grab}
.search-sheet__head{display:flex;align-items:center;justify-content:space-between;padding:8px 14px 6px}
.search-sheet__title{font-weight:800}
.search-sheet__close{border:0;background:transparent;font-size:18px;line-height:1;padding:8px 10px;border-radius:10px;cursor:pointer}
.search-sheet__bar{padding:8px 14px 12px}
.search-sheet__bar input{width:100%;border:1px solid #e5e7eb;border-radius:12px;padding:12px 12px;font-size:14px;outline:none}
.search-sheet__bar input:focus{border-color:#111827;box-shadow:0 0 0 3px rgba(17,24,39,.08)}
.search-sheet__results{padding:0 10px 12px;overflow:auto}
.search-chips{display:flex;flex-wrap:wrap;gap:8px;padding:6px 2px 2px}
.search-chip{border:1px solid #e5e7eb;background:#fff;border-radius:999px;padding:8px 12px;font-size:13px;line-height:1;cursor:pointer;color:#111827;transition:background .15s ease,border-color .15s ease}
.search-chip:hover{background:#f9fafb;border-color:#d1d5db}
.search-chip:active{transform:translateY(1px)}

/* Search results markup (rendered from theme.js) */
.search-res__sec{padding:10px 6px 6px}
.search-res__h{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#6b7280;margin:0 0 8px 6px}
.search-res__item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px;border-radius:14px;text-decoration:none;color:inherit}
.search-res__item:hover{background:#f3f4f6}
.search-res__item span{flex:1;min-width:0;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search-res__price{font-weight:800;white-space:nowrap}

.search-sec{padding:10px 6px 6px}
.search-sec__title{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#6b7280;margin:0 0 8px 6px}

.search-item{display:flex;align-items:center;gap:10px;padding:10px;border-radius:14px;text-decoration:none;color:inherit}
.search-item:hover{background:#f3f4f6}
.search-item__left{flex:1;min-width:0}
.search-item__name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search-item__meta{display:flex;align-items:center;gap:8px;margin-top:2px;flex-wrap:wrap}
.search-badge{font-size:11px;padding:2px 8px;border-radius:999px;background:#eef2ff;color:#3730a3}
.search-price{font-weight:800}
.search-oldprice{font-size:12px;color:#6b7280;text-decoration:line-through}
.search-discount{font-size:11px;padding:2px 8px;border-radius:999px;background:#fee2e2;color:#991b1b;font-weight:800}
.search-muted{color:#6b7280;font-size:12px}

.search-item__right{width:44px;height:44px;border-radius:12px;overflow:hidden;flex:0 0 auto;background:#f3f4f6;display:flex;align-items:center;justify-content:center}
.search-item__right img{width:100%;height:100%;object-fit:cover;display:block}
.search-iconbox svg{width:22px;height:22px;opacity:.8}

/* Make icon button spacing consistent if not present */
.icon-btn.search-link svg{width:22px;height:22px}

@media(max-width:900px){
  .search-sheet{max-height:86vh}
}
/* Drawer her zaman ekrana sabit */
#js-cart-drawer.cart-drawer{
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;

  height: 100vh !important;

  z-index: 99999;
  background: #fff;

  display: flex;
  flex-direction: column;

  /* animasyon istersen */
  transform: translateX(100%);
  transition: transform .25s ease;
}

/* Açıkken ekrana gelsin */
#js-cart-drawer.cart-drawer.open{
  transform: translateX(0);
}

/* Header sabit kalsın */
#js-cart-drawer .cart-drawer-header{
  flex: 0 0 auto;
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 1;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}

/* İçerik alanı: taşarsa drawer içinde scroll */
#js-cart-drawer .cart-drawer-body{
  flex: 1 1 auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 12px 16px;
}
/* drawer body tam yükseklik kullanıp altı sabitlemek için */
.cart-drawer-body{
  height: 100%;
  display: flex;
  flex-direction: column;
  min-height: 0; /* önemli: overflow düzgün çalışsın */
}

/* items + footer layout */
.mini-cart-layout{
  height: 100%;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* scroll olan alan */
.mini-cart-scroll{
  flex: 1 1 auto;
  overflow: auto;
  padding-right: 4px;
  min-height: 0;
}

/* footer sabit */
.mini-cart-footer{
  flex: 0 0 auto;
  padding-top: 12px;
  margin-top: 10px;
  border-top: 1px solid rgba(0,0,0,.08);

  /* istersen daha “sabit” hissi */
  position: sticky;
  bottom: 0;
  background: #fff;
  padding-bottom: 12px;
}
.mini-cart-total-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}
.mini-cart-total{
  font-weight: 800;
  font-size: 18px;
  white-space: nowrap;
}
.mini-cart-subrow{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top: 6px;
  opacity: .8;
}
.mini-cart-actions{
  display:flex;
  gap:10px;
  margin-top: 12px;
}
.mini-cart-checkout,
.mini-cart-gocart{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  padding:12px 14px;
  border-radius:14px;
}
.mini-cart-checkout{ font-weight: 800; }
.mini-cart-gocart{ font-weight: 700; }

/* =============================
   404 Page
============================= */
.error404{padding:64px 0;background:#fff}
.error404-inner{position:relative;max-width:720px;margin:0 auto;text-align:center;padding:44px 18px}
.error404-water{position:absolute;inset:auto 0 0 0;top:-10px;font-weight:900;letter-spacing:.04em;font-size:120px;line-height:1;color:rgba(17,17,17,.08);pointer-events:none;user-select:none}
@media (min-width:768px){.error404-water{font-size:160px;top:-22px}}
.error404-title{position:relative;margin:40px 0 10px;font-size:26px;line-height:1.15;color:#111}
@media (min-width:768px){.error404-title{font-size:30px}}
.error404-subtitle{position:relative;margin:0 auto 22px;max-width:520px;color:#555;line-height:1.6}
.error404-actions{position:relative;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.error404-btn{display:inline-flex;align-items:center;gap:10px;border-radius:12px;padding:12px 16px}
.error404-ic{display:inline-flex;width:20px;justify-content:center}

/* Legacy selectors (if any old template still calls them) */
.error-hero{padding:64px 0}

/* =============================================================
   Home Builder style variants (Slider + Products)
   Default theme only
============================================================= */

/* Slider */
.home-section-slider.hb-slider-contained { padding: 18px 0; }
.home-section-slider.hb-slider-full { padding: 0; width: 100%; max-width: none; }

/* Full-bleed helper (safe even if the layout is later wrapped with a container) */
.home-section-slider.hb-slider-full{
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
}

.home-section-slider.hb-slider-style2 .swiper {
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(0,0,0,.10);
}
.home-section-slider.hb-slider-style2 .swiper-button-prev,
.home-section-slider.hb-slider-style2 .swiper-button-next {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  background: rgba(255,255,255,.90);
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
}
.home-section-slider.hb-slider-style2 .swiper-button-prev:after,
.home-section-slider.hb-slider-style2 .swiper-button-next:after { font-size: 14px; color: #111; font-weight: 800; }

/* Products */
.home-section.hb-products-style2{
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 18px;
}
.home-section.hb-products-style2 > .container{ padding-left: 18px; padding-right: 18px; }

.home-section.hb-products-style3{
  background: linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,0));
  border-top: 1px solid rgba(0,0,0,.06);
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.hb-products-style2 .product-card {
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 26px rgba(0,0,0,.06);
}
.hb-products-style2 .product-card:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(0,0,0,.10); }
.hb-products-style2 .product-info { padding: 14px 14px 12px; }
.hb-products-style2 .product-title { font-size: 14px; line-height: 1.25; }

.hb-products-style3 .product-card {
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 14px;
  box-shadow: none;
}
.hb-products-style3 .product-media-wrap { border-bottom: 1px solid rgba(0,0,0,.06); }
.hb-products-style3 .product-info { padding: 10px 12px; }
.hb-products-style3 .product-title { font-size: 13px; line-height: 1.2; max-height: 2.4em; overflow: hidden; }
.hb-products-style3 .product-pricing { gap: 8px; }
.hb-products-style3 .product-actions .btn { padding: 10px 12px; font-size: 13px; }

/* =============================================================
   Home Builder style variants – full templates
   Default theme only
   (extends card-only variants above)
============================================================= */

/* Slider base (moved from inline) */
.home-section-slider{ position: relative; }
.home-section-slider .swiper{ width:100%; height:100%; }
.home-section-slider .swiper-slide{ width:100%; height:100%; }
.home-section-slider .slide{ display:block; width:100%; height:100%; }
.home-section-slider img{ width:100%; height:100vh; object-fit:cover; display:block; }
@media (max-width: 768px){
  .home-section-slider{ height: calc(-180px + 100vh); }
}

/* Slider style 1 */
.home-section-slider.hb-slider-style1 .swiper-button-prev,
.home-section-slider.hb-slider-style1 .swiper-button-next{
  opacity: .92;
  transition: transform .18s ease, opacity .18s ease;
}
.home-section-slider.hb-slider-style1 .swiper-button-prev:hover,
.home-section-slider.hb-slider-style1 .swiper-button-next:hover{
  transform: scale(1.05);
  opacity: 1;
}

/* Slider style 2 – pagination + buttons polish */
.home-section-slider.hb-slider-style2 .swiper-pagination{
  bottom: 14px;
}
.home-section-slider.hb-slider-style2 .swiper-pagination-bullet{
  width: 8px;
  height: 8px;
  background: rgba(255,255,255,.75);
  opacity: 1;
}
.home-section-slider.hb-slider-style2 .swiper-pagination-bullet-active{
  width: 18px;
  border-radius: 99px;
  background: #ffffff;
}

/* Products – section layout templates */
.home-section.hb-products-style1{ padding: 26px 0; }
.home-section.hb-products-style2{ padding: 34px 0; }
.home-section.hb-products-style3{ padding: 30px 0; }

/* Shared head */
.home-section .section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 16px;
}
.home-section .section-head h2{ margin:0; }

/* Style 2 – "card bar" head + tighter CTA */
.hb-products-style2 .section-head{
  padding: 14px 14px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 10px 26px rgba(0,0,0,.06);
  margin-bottom: 18px;
}
.hb-products-style2 .section-head h2{
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -.01em;
}
.hb-products-style2 .section-head .btn,
.hb-products-style2 .section-url-bottom .btn{
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 800;
}
/* Make outline CTA look like "soft filled" just inside style2 */
.hb-products-style2 .btn.btn-outline{
  background: rgba(0,0,0,.06);
  border-color: rgba(0,0,0,.12);
}
.hb-products-style2 .btn.btn-outline:hover{
  background: rgba(0,0,0,.10);
}

/* Style 3 – centered head + underline accent */
.hb-products-style3 .section-head{
  justify-content: center;
  text-align: center;
  flex-direction: column;
  margin-bottom: 14px;
}
.hb-products-style3 .section-head h2{
  font-size: 20px;
  font-weight: 900;
  letter-spacing: -.02em;
}
.hb-products-style3 .section-head:after{
  content:"";
  width: 84px;
  height: 3px;
  border-radius: 99px;
  background: rgba(0,0,0,.12);
}
.hb-products-style3 .section-head .btn{ margin-top: 6px; }

/* Grid spacing variants */
.hb-products-style1 .product-grid{ gap: 16px; }
.hb-products-style2 .product-grid{ gap: 18px; }
.hb-products-style3 .product-grid{ gap: 14px; }

/* Bottom CTA alignment for grid module */
.section-url-bottom{
  margin-top: 16px;
  display:flex;
  justify-content: center;
}
.hb-products-style2 .section-url-bottom{ justify-content: flex-end; }
.hb-products-style3 .section-url-bottom{ justify-content: center; }

/* Buttons – subtle hover polish inside HB sections */
.home-section .btn{ transition: transform .18s ease, box-shadow .18s ease; }
.home-section .btn:hover{ transform: translateY(-1px); box-shadow: 0 10px 22px rgba(0,0,0,.10); }

@media (max-width: 768px){
  .home-section .section-head{flex-direction: column; /* align-items: flex-start; */ font-size: 12px; text-align: center; justify-content: center; }
  .hb-products-style3 .section-head{ align-items:center; }
  .hb-products-style2 .section-url-bottom{ justify-content: center; }
}

/* --- Header styles (Site Ozellikleri > Header) --- */
.logom {
    width: 180px;
}
.site-header.header--fixed{ position: fixed; top:0; left:0; right:0; z-index: 999; }
.site-header.header--sticky{ position: sticky; top:0; z-index: 999; }

/* Style 2: light header, modern bar */
.site-header.header--style2{
  background:#ffffff;
  color:#0f172a;
  border-bottom: 1px solid rgba(15,23,42,.08);
}
.site-header.header--style2 .container{ max-width: 1180px; }
.site-header.header--style2 a,
.site-header.header--style2 .nav-btn{ color:#0f172a; }
.site-header.header--style2 .nav-btn{ background:transparent; border-radius: 10px; }
.site-header.header--style2 .nav-btn:hover{ background: rgba(15,23,42,.06); }
.site-header.header--style2 .icon-btn{ color:#0f172a; }
.site-header.header--style2 .cart-badge,
.site-header.header--style2 .fav-badge{ background:#0f172a; color:#fff; }

/* Scroll state polish */
.site-header.header--style2.is-scrolled{
  box-shadow: 0 10px 30px rgba(2,6,23,.10);
}

/* Ensure mega panel stays readable on light header */
.site-header.header--style2 .mega{
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 20px 60px rgba(2,6,23,.12);
}


/* --- Home Builder product card variants (style2/style3) --- */
.product-card-s2{
  display:flex;
  gap:12px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  border-radius:12px;
  overflow:hidden;
  padding:10px;
  align-items:stretch;
}
.product-card-s2.is-oos{opacity:.75}
.product-card-s2 .pc2-img{position:relative;flex:0 0 110px;max-width:110px;border-radius:10px;overflow:hidden}
.product-card-s2 .pc2-img img{width:100%;height:100%;object-fit:cover;display:block}
.product-card-s2 .pc2-img-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#f1f5f9;color:#64748b;font-size:12px}
.product-card-s2 .pc2-discount{position:absolute;left:8px;top:8px;background:#0f172a;color:#fff;padding:3px 7px;border-radius:999px;font-size:12px}
.product-card-s2 .pc2-body{flex:1;min-width:0;display:flex;flex-direction:column}
.product-card-s2 .pc2-top{display:flex;align-items:flex-start;gap:10px}
.product-card-s2 .pc2-title{font-size:14px;line-height:1.25;margin:0;flex:1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.product-card-s2 .pc2-title a{color:inherit;text-decoration:none}
.product-card-s2 .pc2-sku{color:#64748b;font-size:12px;margin-top:2px}
.product-card-s2 .pc2-price{margin-top:6px;display:flex;align-items:center;gap:8px}
.product-card-s2 .pc2-now{font-weight:700;color:#0f172a}
.product-card-s2 .pc2-old{color:#64748b;text-decoration:line-through;font-size:12px}
.product-card-s2 .pc2-actions{margin-top:auto}

.product-card-s3{
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  border-radius:16px;
  overflow:hidden;
}
.product-card-s3.is-oos{opacity:.75}
.product-card-s3 .pc3-media{position:relative}
.product-card-s3 .pc3-img{display:block;position:relative}
.product-card-s3 .pc3-img img{width:100%;height:auto;display:block;aspect-ratio:3/4;object-fit:cover}
.product-card-s3 .pc3-img-ph{aspect-ratio:3/4;display:flex;align-items:center;justify-content:center;background:#f1f5f9;color:#64748b;font-size:12px}
.product-card-s3 .pc3-badge{position:absolute;left:10px;bottom:10px;background:rgba(15,23,42,.92);color:#fff;padding:4px 9px;border-radius:999px;font-size:12px}
.product-card-s3 .pc3-fav{position:absolute;right:10px;top:10px}
.product-card-s3 .pc3-body{padding:12px}
.product-card-s3 .pc3-title{font-size:14px;line-height:1.25;margin:0 0 10px 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.product-card-s3 .pc3-title a{color:inherit;text-decoration:none}
.product-card-s3 .pc3-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px}
.product-card-s3 .pc3-price{display:flex;align-items:baseline;gap:8px;min-width:0}
.product-card-s3 .pc3-now{font-weight:800;color:#0f172a;white-space:nowrap}
.product-card-s3 .pc3-old{color:#64748b;text-decoration:line-through;font-size:12px;white-space:nowrap}

/* Make style2 more list-like in HB product grids */
.hb-products-style2 .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width: 992px){.hb-products-style2 .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width: 1200px){.hb-products-style2 .product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* Give style3 a slightly bigger gap */
.hb-products-style3 .product-grid{gap:18px}

/* --- Home Builder: Blog Posts section --- */
.home-section-blog .section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.home-section-blog .section-head--center{flex-direction:column;align-items:center;justify-content:center;text-align:center}
.home-section-blog .section-title{margin: 0; font-size: 20px; text-transform: uppercase; letter-spacing: .25em; color: #1f2937; text-align: center; font-weight: 300;}
.home-section-blog .section-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid rgba(0,0,0,.12);border-radius:12px}

.home-section-blog .blog-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
@media(max-width:1024px){.home-section-blog .blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.home-section-blog .blog-grid{grid-template-columns:1fr}}

.home-section-blog .blog-card{border:1px solid rgba(0,0,0,.08);border-radius:16px;overflow:hidden;background:#fff;display:flex;flex-direction:column;min-height:100%}
.home-section-blog .blog-thumb{display:block;aspect-ratio:16/10;background:rgba(0,0,0,.04)}
.home-section-blog .blog-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.home-section-blog .blog-thumb .blog-thumb-placeholder{width:100%;height:100%}
.home-section-blog .blog-body{padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.home-section-blog .blog-meta{display:flex;gap:8px;align-items:center;font-size:12px;opacity:.75}
.home-section-blog .blog-cat{font-weight:600}
.home-section-blog .blog-title{margin:0;font-size:16px;line-height:1.25}
.home-section-blog .blog-excerpt{margin:0;font-size:13px;line-height:1.45;opacity:.85}
.home-section-blog .blog-more{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-weight:600}

/* Style 2: compact + centered head */
.home-section-blog.blog--style2 .blog-grid{grid-template-columns:repeat(2,1fr);gap:14px}
@media(max-width:768px){.home-section-blog.blog--style2 .blog-grid{grid-template-columns:1fr}}
.home-section-blog.blog--style2 .blog-card{flex-direction:row;align-items:stretch}
.home-section-blog.blog--style2 .blog-thumb{width:42%;aspect-ratio:4/3;flex:0 0 auto}
.home-section-blog.blog--style2 .blog-body{padding:14px;gap:10px}
.home-section-blog.blog--style2 .blog-title{font-size:17px}
.toast-host {
  position: fixed;
  z-index: 1000;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Toast'un konumlandırılması için sınıflar */
.toast-host--top {
  top: 20px;
}

.toast-host--bottom {
  bottom: 20px;
}

.toast-host--left {
  align-items: flex-start;
  left: 20px;
}

.toast-host--right {
  align-items: flex-end;
  right: 20px;
}

.toast-host--center {
  align-items: center;
}

.toast {
  color: white;
  border-radius: 8px;
  margin-bottom: 10px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  pointer-events: auto;
  transform: translateY(0);
  opacity: 0;
  transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.toast.is-in {
  opacity: 1;
  transform: translateY(0);
}

/* Toast giriş animasyonları */
.toast.is-in.toast--slide-up {
  transform: translateY(0);
}

.toast.is-in.toast--slide-down {
  transform: translateY(0);
}

/* Toast tip stilleri */
.toast--text {
  background-color: rgba(0, 0, 0, 0.8);
}

.toast--success {
  background-color: #10b981;
}

.toast--error {
  background-color: #ef4444;
}

.toast--warning {
  background-color: #f59e0b;
}

.toast--info {
  background-color: #3b82f6;
}

/* Toast içeriği */
.toast__body {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5; padding: 12px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Toast ikonları (opsiyonel) */
.toast__body::before {
  margin-right: 8px;
  font-size: 16px;
}

.toast--success .toast__body::before {
  content: '✓';
}

.toast--error .toast__body::before {
  content: '✕';
}

.toast--warning .toast__body::before {
  content: '⚠';
}

.toast--info .toast__body::before {
  content: 'ℹ';
}

/* Toast çıkış animasyonu */
.toast.is-out {
  opacity: 0;
  transform: scale(0.8);
  transition: all 0.2s ease-out;
}

/* Mobil uyumluluk */
@media (max-width: 640px) {
  .toast-host {
    padding: 0 16px;
  }
  
  .toast {
    max-width: 100%;
    width: 100%;
    border-radius: 12px;
  }
  
  .toast-host--left,
  .toast-host--right {
    align-items: center;
    left: 16px;
    right: 16px;
  }
}

/* Koyu tema için */
@media (prefers-color-scheme: dark) {
  .toast--text {
    background-color: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
  }
}

/* Animasyon keyframes */
@keyframes toastSlideUp {
  from {
    transform: translateY(100%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes toastSlideDown {
  from {
    transform: translateY(-100%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes toastFadeIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
/* --- Product detail: media video + accordion (modern, flat) --- */
.pd-media{gap:12px}
.pd-video{width:100%;border:1px solid rgba(0,0,0,.08);border-radius:12px;background:#fff}
.pd-video.is-hidden{display:none}
.pd-video__frame{position:relative;padding-top:56.25%}
.pd-video__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:12px}
.pd-video video{width:100%;height:auto;display:block;border-radius:12px}
.pd-main.is-hidden{display:none}

.pd-thumb--video{display:flex;align-items:center;justify-content:center}
.pd-thumb__play{width:28px;height:28px;border-radius:999px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(0,0,0,.15);font-size:12px;line-height:1;color:rgba(0,0,0,.65);background:rgba(255,255,255,.9)}

.pd-acc{display:flex;flex-direction:column;gap:10px}
.pd-acc__item{border:1px solid rgba(0,0,0,.08);border-radius:14px;background:#fff}
/* Native accordion via <details> */
.pd-acc__btn{list-style:none;width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 14px;background:transparent;border:0;cursor:pointer;text-align:left}
.pd-acc__btn::-webkit-details-marker{display:none}
.pd-acc__btn::marker{content:""}
.pd-acc__title{font-weight:700}
.pd-acc__panel{padding:0 14px 14px 14px}

.pd-acc__plus{width:24px;height:24px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.04)}
.pd-acc__svg{width:14px;height:14px;stroke:rgba(0,0,0,.55)}
.pd-acc__item[open] .pd-acc__plus{background:rgba(0,0,0,.06)}
.pd-acc__item[open] .pd-acc__svg{transform:rotate(45deg)}

/* Keep things flat inside accordion */
.pd-acc .card{border:0;padding:0;background:transparent}
.pd-acc .card h3{display:none}

@media (max-width: 768px){
  .pd-acc__btn{padding:12px}
  .pd-acc__panel{padding:0 12px 12px 12px}
}


/* --- Product detail overrides v23+ --- */
/* sticky kapat (her breakpoint) */
.product-layout > .card{position:static !important;top:auto !important;}
@media (min-width: 980px){.product-layout > .card{position:static !important;top:auto !important;}}
/* mobil ürün layout: tek kolon + düzgün boşluk */
@media (max-width: 980px){
  .product-layout{flex-direction:column !important;}
  .product-layout > div,.product-layout > .card{width:100% !important;max-width:100% !important;}
  .pd-thumbs{overflow-x:auto;scroll-snap-type:x mandatory;}
  .pd-thumb{scroll-snap-align:start;}
}

/* Product accordion panel: keep content readable */
.pd-attrs{margin-top:14px;border-top:1px solid rgba(0,0,0,.06);padding-top:14px}
.pd-attrs__title{font-weight:700;margin-bottom:10px}
.pd-attrs__row{display:flex;gap:12px;justify-content:space-between;padding:8px 0;border-bottom:1px solid rgba(0,0,0,.05)}
.pd-attrs__row:last-child{border-bottom:0}
.pd-attrs__k{min-width:140px;color:rgba(0,0,0,.65);font-weight:600}
.pd-attrs__v{text-align:right}

/* --- Sold-out (Tükendi) overlay --- */
.product-media-wrap,
.pc2-img,
.pc3-media,
.pd-main{
  position: relative;
}

.soldout-overlay,
.pd-soldout{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  background: rgba(15, 23, 42, 0.35);
  color: #fff;
  z-index: 2;
  pointer-events: none;
}

.soldout-overlay{
  border-radius: 0px;
}

.pd-soldout{
  border-radius: 14px;
}

.btn.is-disabled,
.btn.btn-out-of-stock{
  opacity: .7;
  cursor: not-allowed;
}


/* Passive customer global notice */
.customer-status-alert{
  position: relative;
  z-index: 50;
  padding: 10px 14px;
  font-size: 14px;
  line-height: 1.3;
  background: #ffe8e8;
  color: #8a1c1c;
  border: 1px solid #f3bcbc;
  margin: 10px auto 0;
  max-width: 1200px;
  border-radius: 10px;
}

/* Prevent horizontal scroll issues globally */
html, body { max-width: 100%; overflow-x: hidden; }
img, svg, video, iframe, table, pre, code { max-width: 100%; }
pre { overflow: auto; }

.vopt__item.is-disabled,
.vopt__item.is-oos{
  opacity:.45;
  cursor:not-allowed;
  pointer-events:none; /* label tıklamasını da kapatır */
}
.vopt__item.is-disabled .vopt__swatch,
.vopt__item.is-disabled .vopt__text{
  filter: grayscale(1);
}
.vopt__oos,
.vopt__na{
  display:none;
  margin-left:8px;
  font-size:12px;
  padding:2px 6px;
  border-radius:999px;
  background:rgba(0,0,0,.08);
}
.vopt__item.is-oos .vopt__oos{ display:inline-block; }
.vopt__item.is-disabled .vopt__na{ display:inline-block; }

/* ------------------------------
   Header / Hesabım dropdown
------------------------------ */
.account-dd{position:relative;display:inline-flex;align-items:center}
.account-dd-btn{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;cursor:pointer;padding:6px 8px;border-radius:12px}
.account-dd-btn:hover{background:rgba(255,255,255,.12)}
.account-dd-chevron{font-size:12px;opacity:.85;transform:translateY(1px)}

.account-dd-menu{position:absolute;right:0;top:calc(100% + 10px);min-width:224px;max-width:280px;background:#fff;border:1px solid rgba(17,24,39,.12);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.14);padding:6px;z-index:220}
.account-dd-menu[aria-hidden="true"]{display:none}

.account-dd-label{padding:10px 10px 8px}
.account-dd-name{font-size:14px;font-weight:700;line-height:1.2;color:#111827}
.account-dd-email{margin-top:2px;font-size:12px;line-height:1.2;color:#6b7280;word-break:break-all}
.account-dd-sep{height:1px;background:rgba(17,24,39,.08);margin:6px 0}

.account-dd-item{width:100%;display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;text-decoration:none;color:#111827;font-size:14px;font-weight:600;cursor:pointer;border:0;background:transparent}
.account-dd-item:hover{background:#f3f4f6}
.account-dd-ico{width:18px;display:inline-flex;justify-content:center;opacity:.85}

.account-dd-item--danger{color:#dc2626}
.account-dd-item--danger:hover{background:rgba(220,38,38,.08)}
.account-dd-logout{margin:0}

@media (max-width: 980px){
  .account-dd-menu{right:0;left:auto}
}

/* ------------------------------
   Category tree (sidebar)
------------------------------ */
.custom-scrollbar-categories::-webkit-scrollbar{width:6px}
.custom-scrollbar-categories::-webkit-scrollbar-thumb{background:rgba(0,0,0,.18);border-radius:999px}
.custom-scrollbar-categories::-webkit-scrollbar-track{background:transparent}

.cat-tree{margin-top:6px}
.cat-tree__scroll{max-height:500px;overflow-y:auto;padding-right:6px}
.cat-tree__all{display:block;width:100%;text-decoration:none;background:transparent;border:0;padding:8px 0;margin:0 0 6px;cursor:pointer;color:#6b7280;font-weight:600;font-size:13px;text-align:left}
.cat-tree__all:hover{color:#111827}

.cat-tree__node{display:block}
.cat-tree__row{display:flex;align-items:center;gap:8px;padding:8px 0;cursor:pointer;position:relative;color:#6b7280;transition:color .2s ease}
.cat-tree__row:hover{color:#111827}
.cat-tree__row.is-active{color:#111827;font-weight:700}
.cat-tree__row.is-active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:2px;height:16px;background:#111827;border-radius:999px}

.cat-tree__toggle{padding:2px;border:0;background:transparent;border-radius:999px;cursor:pointer;line-height:0;opacity:.55;transition:opacity .2s ease, background .2s ease}
.cat-tree__toggle:hover{opacity:1;background:rgba(0,0,0,.06)}
.cat-tree__toggle-spacer{width:18px;height:18px;flex:0 0 18px}
.cat-tree__chev{transition:transform .2s ease}
.cat-tree__chev.is-closed{transform:rotate(-90deg)}
.cat-tree__chev.is-open{transform:rotate(0deg)}

.cat-tree__checkbox{position:absolute;opacity:0;pointer-events:none}
.cat-tree__label{flex:1;text-align:left;background:transparent;border:0;padding:0;margin:0;cursor:pointer;color:inherit;font:inherit;font-size:13px;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cat-tree__label.js-cat-nav{text-decoration:none}
.cat-tree__count{font-size:12px;color:rgba(107,114,128,.9);flex-shrink:0}

.cat-tree__children.is-closed{display:none}
.cat-tree__children.is-open{display:block}


/* checkout v2: address type pills + invoice block */
.co-addr-type{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 6px;}
.co-type{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:12px;padding:10px 12px;font-weight:600;display:flex;gap:8px;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease;}
.co-type .ico{font-size:16px;line-height:1;}
.co-type:hover{border-color:rgba(37,99,235,.35);box-shadow:0 6px 18px rgba(2,6,23,.06);}
.co-type.is-active{border-color:rgba(37,99,235,.6);background:rgba(37,99,235,.06);}
.checkout2-invoice{margin-top:10px;padding-top:10px;border-top:1px dashed rgba(15,23,42,.12);}
.checkout2-checkbox{display:flex;gap:10px;align-items:center;padding:10px 12px;border:1px solid rgba(15,23,42,.08);background:rgba(15,23,42,.02);border-radius:12px;margin-top:12px;}
.checkout2-checkbox input{width:18px;height:18px;}
.co-modal-card{border-radius:18px;}
.co-modal-sub{margin-top:2px;}
.co-modal-actions .btn{min-width:140px;}
.co-sel + .co-sel{margin-top:10px;}



/* Skeleton */

.js-skeleton-container{position:relative}
.js-skeleton{display:block}
.js-skeleton-content{display:block}
.js-skeleton-container.is-loading .js-skeleton-content{visibility:hidden; height:0; overflow:hidden}
.js-skeleton-container.is-loading .js-skeleton{display:block}
.js-skeleton-container.is-loaded .js-skeleton{display:none}
.js-skeleton-container.is-loaded .js-skeleton-content{visibility:visible; height:auto; overflow:visible}

/* -------------------------------------------------
   Products/Category AJAX loading overlay
   - Used for pagination + filtering without full refresh
-------------------------------------------------- */
.products-ajax-wrap{position:relative}
.products-ajax-wrap.is-ajax-loading{min-height:220px}
.products-ajax-loading{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:#f6f7fb; z-index:50}
.products-ajax-loading__spinner{width:44px; height:44px; border-radius:999px; border:3px solid rgba(0,0,0,.15); border-top-color:rgba(0,0,0,.65); animation:productsSpin .9s linear infinite}
@keyframes productsSpin{to{transform:rotate(360deg)}}

.skel-shimmer{
  position:relative;
  overflow:hidden;
  background:rgba(17,24,39,.06);
  border-radius:14px;
}
.skel-shimmer::after{
  content:"";
  position:absolute; inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.55), rgba(255,255,255,0));
  animation:skelShimmer 1.1s infinite;
}
@keyframes skelShimmer{ 100%{ transform:translateX(100%);} }

/* Skeleton helpers */
.skel-ml-auto{margin-left:auto}
.skel-w-20{width:20%}
.skel-w-30{width:30%}
.skel-w-40{width:40%}
.skel-w-45{width:45%}
.skel-w-55{width:55%}
.skel-w-60{width:60%}
.skel-w-75{width:75%}
.skel-w-80{width:80%}
.skel-w-85{width:85%}

.skel-icon{width:34px;height:34px;border-radius:999px}
.skel-badge{display:inline-block;width:54px;height:22px;border-radius:999px}
.skel-btn{width:100%;max-width:180px;border-radius:14px;height:44px}
.skel-pill{width:120px;border-radius:999px;height:38px}
.skel-media{width:100%;height:100%;border-radius:14px}
.skel-blog-media{width:100%;height:180px;border-radius:14px}

@media (max-width:640px){
  .skel-blog-media{height:160px}
  .skel-btn{max-width:160px}
}

.skel-line{height:12px;border-radius:10px}
.skel-line.sm{height:10px}
.skel-line.lg{height:14px}
.skel-gap{height:10px}
.skel-card{margin-bottom:10px;}
.skel-thumb{width:100%;aspect-ratio:3/4;border-radius:14px}
.skel-thumb.h{aspect-ratio:3/4}
.skel-banner-fixed .skel-banner-thumb{width:100%;aspect-ratio:9/5;border-radius:14px}
.skel-row{display:flex;gap:10px}
.skel-col{flex:1}
/* keep button/pill sizes consistent */
.skel-btn{height:44px;border-radius:14px}
.skel-pill{height:38px;border-radius:999px;width:120px}

.skel-grid{display:grid;gap:14px}
@media (min-width: 992px){
  .skel-grid.cols-5{grid-template-columns:repeat(5,1fr)}
  .skel-grid.cols-4{grid-template-columns:repeat(5,1fr)}
  .skel-grid.cols-3{grid-template-columns:repeat(3,1fr)}
  .skel-grid.cols-2{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 991px){
  .skel-grid.cols-m-2{grid-template-columns:repeat(2,1fr)}
  .skel-grid.cols-m-1{grid-template-columns:repeat(1,1fr)}
}

.skel-slider{display:flex;gap:14px;overflow:hidden}
.skel-slider .skel-slide{flex:0 0 260px}
@media (max-width: 640px){
  .skel-slider .skel-slide{flex-basis:72vw}
}



/* Home Builder Banner Styles */
.hb-banner-grid--style2{
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, 1fr);
}

/* Default: flow layout (when less than 6 items) */
.hb-banner-grid--style2.hb-style2-flow{
  grid-auto-rows: 180px;
}

/* Mosaic layout (reference look) */
.hb-banner-grid--style2.hb-style2-mosaic{
  grid-template-columns: 1.05fr 0.95fr 1.25fr;
  grid-template-rows: 180px 180px 230px;
}

.hb-banner-grid--style2 .hb-b2-item{
  min-height: 0;
}

/* Mosaic slots (1..6) */
.hb-banner-grid--style2.hb-style2-mosaic .hb-b2-1{ grid-column: 1; grid-row: 1 / 3; }
.hb-banner-grid--style2.hb-style2-mosaic .hb-b2-2{ grid-column: 2; grid-row: 1; }
.hb-banner-grid--style2.hb-style2-mosaic .hb-b2-3{ grid-column: 3; grid-row: 1; }
.hb-banner-grid--style2.hb-style2-mosaic .hb-b2-4{ grid-column: 2 / 4; grid-row: 2; }
.hb-banner-grid--style2.hb-style2-mosaic .hb-b2-5{ grid-column: 3; grid-row: 3 / 4; }
.hb-banner-grid--style2.hb-style2-mosaic .hb-b2-6{ grid-column: 1 / 3; grid-row: 3; }

/* Single item */
.hb-banner-grid--style2.hb-style2-single{
  grid-template-columns: 1fr;
  grid-template-rows: auto;
}

.hb-banner-grid--style2.hb-style2-single > :nth-child(1){
  grid-column: 1; grid-row: 1;
}

/* Card styling */
.hb-banner--style2{
  border-radius: 18px;
  overflow: hidden;
}

.hb-banner--style2 .hb-banner__media,
.hb-banner--style2 .hb-banner__video{
  height: 100%;
}

.hb-banner--style2 .hb-banner__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hb-banner--video iframe{
  width: 100%;
  height: 100%;
}

/* Overlay typography tweaks for this layout */
.hb-banner--style2 .hb-banner__content{
  max-width: 86%;
}

/* Responsive */
@media (max-width: 1024px){
  .hb-banner-grid--style2.hb-style2-mosaic{
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }
  .hb-banner-grid--style2.hb-style2-mosaic .hb-b2-1{ grid-column: 1 / 3; grid-row: auto; }
  .hb-banner-grid--style2.hb-style2-mosaic .hb-b2-2{ grid-column: 1; grid-row: auto; }
  .hb-banner-grid--style2.hb-style2-mosaic .hb-b2-3{ grid-column: 2; grid-row: auto; }
  .hb-banner-grid--style2.hb-style2-mosaic .hb-b2-4{ grid-column: 1 / 3; grid-row: auto; }
  .hb-banner-grid--style2.hb-style2-mosaic .hb-b2-5{ grid-column: 1 / 3; grid-row: auto; }
  .hb-banner-grid--style2.hb-style2-mosaic .hb-b2-6{ grid-column: 1 / 3; grid-row: auto; }
}

@media (max-width: 640px){
  .hb-banner-grid--style2{
    grid-template-columns: 1fr;
  }
  .hb-banner-grid--style2.hb-style2-flow{ grid-auto-rows: 170px; }
}
.hb-banner--style3{
  background:#fff;
  border:1px solid rgba(17,24,39,.10);
  box-shadow: 0 10px 26px rgba(17,24,39,.06);
  min-height: 140px;
}
.hb-banner--style3 .hb-banner__media img{
  transform: scale(1.02);
  transition: transform .25s ease;
}
.hb-banner--style3 .hb-banner__content{
  position:absolute;
  inset:auto 14px 14px 14px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.hb-banner--style3 .hb-banner__title{
  color:#111827;
  text-shadow:none;
}
.hb-banner--style3 .hb-banner__desc{
  color: rgba(17,24,39,.72);
  text-shadow:none;
  max-width: 46ch;
}
.hb-banner--style3 .hb-banner__btn{
  opacity:0;
  transform: translateY(6px);
  transition: opacity .2s ease, transform .2s ease;
  background:#111827;
  color:#fff;
  box-shadow:none;
}
.hb-banner--style3:hover .hb-banner__btn{
  opacity:1;
  transform: translateY(0);
}
.hb-banner--style3:hover .hb-banner__media img{
  transform: scale(1.06);
}
@media (max-width: 760px){
  .hb-banner--style3 .hb-banner__btn{ opacity:1; transform:none; }
}
.w-\[18px\] {
    width: 18px;
}
.h-\[18px\] {
    height: 18px;
}
/* ---- Custom additions: Brand pill ---- */
.brand-pill{
display: inline-flex;
    align-items: center;
    max-width: 100%;
    font-size: 10px;
    line-height: 1;
    color: inherit;
    text-decoration: none;
    margin-bottom: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
	text-transform: uppercase;
    color: oklch(0.71 0.02 261.33 / 1);
}


/* Brand filter rows */
.brand-filter__row{padding:8px 10px;border-radius:12px;transition:background .15s ease,color .15s ease}
.brand-filter__row:hover{background:#f3f4f6;color:#111827}
.brand-filter__chk{width:16px;height:16px;border-radius:4px;margin:0}
.brand-filter__name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}


/* Empty state (category/products no results) */
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:64px 16px;gap:10px;}
.empty-state__icon{opacity:.6;margin-bottom:4px;}
.empty-state__title{font-weight:800;font-size:20px;}
.empty-state__text{color:#6b7280;}
.empty-state__btn{margin-top:8px;padding:10px 16px;border-radius:10px;}
/* Reviews / Alerts (Default theme) */
.dt-alert {
  border-radius: 14px;
  padding: 18px 18px;
  border: 1px solid rgba(0,0,0,.06);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  text-align: center;
  min-height: 82px;
  margin-top:8px;
}

.dt-alert__icon {
  width: 28px;
  height: 28px;
  opacity: .65;
}

/* "Henüz yorum yapılmamış" (açık gri) */
.dt-alert--empty {
  background: #f7f8fa;
  color: #6b7280; /* gri */
}

/* "Giriş yapın" uyarısı (açık sarı) */
.dt-alert--warn {
  background: #fff7db;
  color: #b45309; /* turuncu */
  border-color: rgba(180,83,9,.18);
}


/* ===== Modern Pagination ===== */
.pg-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 3rem 0;
  user-select: none;
}

.pg-btn,
.pg-ellipsis {
  min-width: 34px;
  height: 34px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 500;
  border-radius: 9999px;
  color: #6b7280; /* gray-500 */
  transition: all .18s ease;
}

.pg-btn:hover {
  background: #f3f4f6; /* gray-100 */
  color: #111827; /* gray-900 */
}

.pg-btn.is-active {
  background: #111827;
  color: #fff;
  pointer-events: none;
}

.pg-btn.is-disabled {
  opacity: .35;
  pointer-events: none;
}

.pg-ellipsis {
  color: #9ca3af;
  cursor: default;
}

/* Mobile: only Prev / Next */
@media (max-width: 768px) {
  .pg-btn[data-page],
  .pg-ellipsis {
    display: none;
  }
}
/* ===============================
   Modern Pagination (PJAX Uyumlu)
   =============================== */

.pg-wrap,
.pagination-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 3rem 0;
}

/* Genel link görünümü */
.pg-wrap a,
.pagination-wrap a {
  min-width: 34px;
  height: 34px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #6b7280; /* gray-500 */
  border-radius: 9999px;
  transition: all .18s ease;
  text-decoration: none;
}

/* Hover */
.pg-wrap a:hover,
.pagination-wrap a:hover {
  background-color: #f3f4f6; /* gray-100 */
  color: #111827; /* gray-900 */
  transform: translateY(-1px);
}

/* Aktif sayfa */
.pg-wrap span.bg-gray-900,
.pagination-wrap .is-active {
  background-color: #111827;
  color: #ffffff;
  font-weight: 600;
  pointer-events: none;
}

/* Disabled */
.pg-wrap a.pointer-events-none,
.pagination-wrap a[aria-disabled="true"] {
  opacity: .35;
  pointer-events: none;
  transform: none;
}

/* Ellipsis */
.pg-wrap span,
.pagination-wrap .pg-ellipsis {
  min-width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #9ca3af; /* gray-400 */
  user-select: none;
}

/* Mobile: sadece Önceki / Sonraki */
@media (max-width: 768px) {
  .pg-wrap a[data-page],
  .pg-wrap span,
  .pagination-wrap a[data-page],
  .pagination-wrap .pg-ellipsis {
    display: none;
  }
}

/* Küçük mikro animasyon */
.pg-wrap a:active,
.pagination-wrap a:active {
  transform: scale(.96);
}
/* ===== Tailwind-like responsive helpers ===== */

/* "md" = 768px */
.md-hidden { display: flex !important; }         /* mobile: show */
.hidden-md-flex { display: none !important; }    /* mobile: hide */

@media (min-width: 768px) {
  .md-hidden { display: none !important; }       /* desktop: hide */
  .hidden-md-flex { display: flex !important; }  /* desktop: flex show */
}
/* ===== Pagination mini loading bar ===== */
.pg-wrap {
  position: relative;
}

.pg-wrap.pg-loading::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -10px;
  width: 180px;
  height: 2px;
  transform: translateX(-50%);
  border-radius: 9999px;
  background: rgba(17, 24, 39, 0.12); /* gray-900 @ 12% */
  overflow: hidden;
}

.pg-wrap.pg-loading::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -10px;
  width: 60px;
  height: 2px;
  transform: translateX(-50%);
  border-radius: 9999px;
  background: #111827; /* gray-900 */
  animation: pgbar 0.9s ease-in-out infinite;
  z-index: 1;
}

@keyframes pgbar {
  0%   { transform: translateX(-50%) translateX(-80px); opacity: .55; }
  50%  { transform: translateX(-50%) translateX(0px);  opacity: 1; }
  100% { transform: translateX(-50%) translateX(80px); opacity: .55; }
}
<div id="js-toast-host" class="toast-host"><div class="toast toast--text is-in"><div class="toast__body">Favorilerden çıkarıldı</div></div></div>

/* =========================
   Product Detail - Right Panel (modern)
========================= */
.pd-head{display:flex;flex-direction:column;gap:6px}
.pd-brand{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(0,0,0,.55);font-weight:800}
.pd-brand a{color:inherit;text-decoration:none}
.pd-title{margin:0;font-size:22px;line-height:1.25;font-weight:900}
.pd-sku{font-size:11px;color:rgba(0,0,0,.55)}
.pd-sku span{font-weight:700;color:rgba(0,0,0,.7)}
.pd-stockline{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:12px;color:rgba(0,0,0,.7)}
.pd-stockdot{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:999px;background:rgba(0,0,0,.06);font-weight:900}
.pd-card .product-pricing{margin-top:10px}
.pd-card .product-price{font-size:22px;font-weight:900}
.pd-tax{font-size:11px;color:rgba(0,0,0,.55);margin-top:4px}

.pd-actions{display:grid;grid-template-columns: 1fr 44px 44px;gap:10px;margin-top:12px;align-items:stretch}
.pd-cart-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;border-radius:14px;border:1px solid rgba(0,0,0,.12);background:#111;color:#fff;padding:12px 14px;font-weight:900;cursor:pointer}
.pd-cart-btn svg{width:18px;height:18px;fill:currentColor}
.pd-cart-btn.is-disabled{opacity:.55;cursor:not-allowed}
.pd-icon-btn{display:inline-flex;align-items:center;justify-content:center;border-radius:14px;border:1px solid rgba(0,0,0,.12);background:#fff;cursor:pointer}
.pd-icon-btn svg{width:18px;height:18px;fill:rgba(0,0,0,.75)}
.pd-icon-btn.is-active,
.pd-icon-btn.js-fav-toggle.is-active{border-color:rgba(0,0,0,.25);background:rgba(0,0,0,.04)}
.pd-icon-btn.js-fav-toggle.is-active svg{fill:#111}

/* Make inline plugin buttons look consistent with the right panel */
.pd-card .sn-btn,
.pd-card .pn-btn,
.pd-card .fob-wa-btn{
  width:100%;
  justify-content:center;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  box-shadow:none !important;
}
.pd-card .fob-wa-wrap{margin-top:12px}
.pd-card .fob-wa-note{display:none}


/* Blog page (hero + list + sidebar) */
.blog-hero{margin:0 0 26px}
.blog-hero-card{
  border-radius:24px;
  padding:56px 28px;
  background: radial-gradient(1200px 420px at 50% 0%, rgba(255,255,255,.08), rgba(255,255,255,0) 55%),
              linear-gradient(135deg, #0b1220 0%, #111b2f 45%, #0b1220 100%);
  color:#fff;
  box-shadow:0 18px 40px rgba(2,6,23,.18);
  text-align:center;
  position:relative;
  overflow:hidden;
}
.blog-hero-title{margin:0;font-size:52px;line-height:1.05;letter-spacing:-.02em}
.blog-hero-title-soft{opacity:.55}
.blog-hero-sub{margin-top:14px;font-size:16px;opacity:.8}
.blog-search{max-width:720px;margin:28px auto 0;display:flex;gap:10px;align-items:center;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.12);
  padding:10px;border-radius:999px}
.blog-search-input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:#fff;
  padding:10px 14px;font-size:14px}
.blog-search-input::placeholder{color:rgba(255,255,255,.65)}
.blog-search-btn{border:0;cursor:pointer;border-radius:999px;padding:10px 18px;
  background:rgba(255,255,255,.2);color:#fff;font-weight:600}
.blog-search-btn:hover{background:rgba(255,255,255,.28)}

.blog-cats{margin-top:18px;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:18px;
  padding:14px 16px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.blog-cats-label{color:rgba(0,0,0,.55);font-weight:600;font-size:13px}
.blog-cats-pills{display:flex;gap:10px;flex-wrap:wrap}
.blog-pill{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;
  border:1px solid rgba(0,0,0,.08);background:#fff;color:#111827;font-weight:600;font-size:13px}
.blog-pill:hover{border-color:rgba(0,0,0,.18)}
.blog-pill.is-active{background:#0b1220;color:#fff;border-color:#0b1220}

.blog-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;margin-top:26px;align-items:start}
.blog-main{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:18px;padding:18px}
.blog-row{display:grid;grid-template-columns:300px minmax(0,1fr);gap:18px;align-items:start}
.blog-row-media{display:block;border-radius:14px;overflow:hidden;background:rgba(0,0,0,.04);aspect-ratio:16/10}
.blog-row-media img{width:100%;height:100%;object-fit:cover;display:block}
.blog-row-ph{width:100%;height:100%}
.blog-row-body{padding-top:6px}
.blog-row-meta{display:flex;gap:10px;align-items:center;color:rgba(0,0,0,.55);font-size:12px}
.blog-row-cat{font-weight:700}
.blog-row-title{display:block;margin-top:8px;font-size:18px;line-height:1.25;font-weight:800;color:#0b1220}
.blog-row-title:hover{text-decoration:underline}
.blog-row-excerpt{margin-top:10px;color:rgba(0,0,0,.65);font-size:13px;line-height:1.55}
.blog-row-sep{height:1px;background:rgba(0,0,0,.06);margin:16px 0}
.blog-empty{padding:24px;border-radius:14px;background:rgba(0,0,0,.03)}

.blog-side-card{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:18px;padding:18px}
.blog-side-title{font-weight:900;font-size:16px;margin:0 0 12px}
.blog-featured{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.blog-featured-item{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start}
.blog-featured-no{width:34px;height:34px;border-radius:999px;background:rgba(0,0,0,.06);
  display:flex;align-items:center;justify-content:center;font-weight:900}
.blog-featured-title{display:block;font-weight:800;color:#0b1220;line-height:1.25;font-size:13px}
.blog-featured-title:hover{text-decoration:underline}
.blog-featured-meta{margin-top:6px;color:rgba(0,0,0,.55);font-size:12px;display:flex;align-items:center;gap:6px}
.blog-featured-eye{font-size:12px}

@media (max-width: 1024px){
  .blog-layout{grid-template-columns:minmax(0,1fr)}
}
@media (max-width: 640px){
  .blog-hero-card{padding:36px 16px;border-radius:20px}
  .blog-hero-title{font-size:34px}
  .blog-main{padding:14px}
  .blog-row{grid-template-columns:1fr}
  .blog-row-media{aspect-ratio:16/9}
  .blog-cats{border-radius:16px}
}


/* Mega menu: featured products */
.mega-featured{
  margin-top: 14px;
  padding: 10px 0 0;
  border-top: 1px solid rgba(0,0,0,.06);
}

/* Mega featured column when used as middle column */
.site-header .mega .cols > .mega-featured{
  margin-top:0;
  padding:0;
  border-top:0;
}
.site-header .mega-featured{
  display:flex;
  flex-direction:column;
}
.site-header .mega-featured-panels{ flex:1; }

.mega-featured-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.mega-featured-title{
  font-weight:600;
  font-size:14px;
  color:#111827;
}
.mega-featured-nav{ display:flex; gap:8px; }
.mega-feat-btn{
  width:28px;height:28px;
  border:1px solid rgba(0,0,0,.08);
  background:#fff;
  border-radius:10px;
  cursor:pointer;
  line-height:26px;
}
.mega-feat-btn:hover{ border-color: rgba(0,0,0,.16); }

.mega-feat-track{
  display:flex;
  gap:12px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  padding-bottom:0; /* scrollbar çizgisi görünmesin */
  -ms-overflow-style:none; /* IE/Edge */
  scrollbar-width:none; /* Firefox */
  overscroll-behavior:contain;
}
.mega-feat-track::-webkit-scrollbar{ display:none; } /* Chrome/Safari */
.mega-feat-card{
  flex: 0 0 110px;
  display:block;
  text-decoration:none;
  color:inherit;
}
.mega-feat-img{
  position:relative;
  border-radius:16px;
  background:rgba(0,0,0,.04);
  overflow:hidden;
  width:100%;
  aspect-ratio:3/4;
  display:flex;
  align-items:center;
  justify-content:center;
}
.mega-feat-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.mega-feat-badge{
  position:absolute;
  top:10px;
  left:10px;
  font-size:11px;
  font-weight:700;
  padding:6px 10px;
  border-radius:999px;
  background:#111827;
  color:#fff;
  line-height:1;
}
.mega-feat-badge-disc{ background:#111827; }
.mega-feat-badge-oos{ background:#6b7280; }

.mega-feat-price{
  margin-top:6px;
  display:flex;
  align-items:baseline;
  gap:8px;
}
.mega-feat-now{
  font-size:13px;
  font-weight:700;
  color:#111827;
}
.mega-feat-old{
  font-size:12px;
  color:#9ca3af;
  text-decoration:line-through;
}

.mega-feat-ph{ width:100%; height:100%; }
.mega-feat-name{
  margin-top:8px;
  font-size:12px;
  color: #000000;
  line-height:1.2;
  height:30px;
  overflow:hidden;
}
.mega-feat-price{
  margin-top:4px;
  font-weight:600;
  font-size:12px;
}

.mega-feat-empty{
  padding: 18px 14px;
  font-size: 13px;
  color: #6b7280;
  border: 1px dashed rgba(0,0,0,.10);
  border-radius: 14px;
  background: rgba(0,0,0,.02);
  text-align: center;
}


/* ===============================
   Home Builder: Featured Brands
================================ */
.home-section-brands{padding: 26px 0}
.home-section-brands .hb-section-head{margin-bottom: 18px}
.hb-section-head.hb-center{text-align:center}
.hb-section-title{font-weight: 900; font-size: 28px; margin: 0}
.hb-section-underline{width: 120px; height: 4px; border-radius: 999px; margin: 10px auto 0; background: #111827; opacity:.85}

.hb-brand-grid{
  display:grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 18px;
  margin-top: 22px;
}
@media (max-width: 980px){
  .hb-brand-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 760px){
  .hb-section-title{font-size: 22px}
  .hb-brand-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}

.hb-brand-card{
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 18px;
  border-radius: 16px;
  background:#fff;
  border: 1px solid rgba(17,24,39,.10);
  text-decoration:none;
  box-shadow:none;
}
.hb-brand-card:hover{border-color: rgba(17,24,39,.18)}
.hb-brand-media{width: 100%; height: 70px; display:flex; align-items:center; justify-content:center}
.hb-brand-media img{max-width: 100%; max-height: 70px; object-fit: contain; display:block}
.hb-brand-fallback{font-weight:900; font-size: 24px; color:#111827; opacity:.8}

.hb-section-foot{margin-top: 20px; display:flex; justify-content:center}
.hb-btn-outline{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  padding: 10px 16px;
  border-radius: 14px;
  border: 1px solid rgba(17,24,39,.12);
  background: #fff;
  color:#111827;
  font-weight: 800;
  text-decoration:none;
}
.hb-btn-outline:hover{border-color: rgba(17,24,39,.22)}

/* Smart Discount promo badge */
.smart-discount-badge{font-size:12px; padding:6px 8px; max-width:90%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

/* =============================
   Home Builder Slider (Default)
   Style 1: s1 (carousel)
   Style 2: s2 (tile grid)
   Premium clean: no box-shadow
   ============================= */

/* Slider section should not inherit global hb-sec padding */
.hb-sec.hb-slider{padding:0!important}

/* ---- Style 1 (s1) ---- */
.hb-slider .s1{position:relative;overflow:hidden;border-radius:24px}
.hb-sec--full.hb-slider .s1{border-radius:0}

/* Height: calc(100vh - 180px) on desktop & mobile */
:root{--hb-slider-header-offset:180px}
.hb-slider .s1{height:calc(100vh - var(--hb-slider-header-offset));min-height:420px}
@media (max-width:768px){
  .hb-slider .s1{height:calc(100vh - var(--hb-slider-header-offset));min-height:360px}
}

.hb-slider .s1-track{display:flex;transition:transform .45s ease}
.hb-slider .s1-slide{position:relative;flex:0 0 100%}
.hb-slider .s1-img{width:100%;height:100%;object-fit:cover;display:block}
.hb-slider .s1-ov{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.58) 0%,rgba(0,0,0,.18) 55%,rgba(0,0,0,.0) 100%)}

/* Content positioning (horizontal align from HB: left|center|right). Always vertically centered */
.hb-slider .s1-c{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:14px;padding:56px}
@media (max-width:768px){.hb-slider .s1-c{padding:28px}}

.hb-slider .s1-align-left{align-items:flex-start;text-align:left}
.hb-slider .s1-align-center{align-items:center;text-align:center}
.hb-slider .s1-align-right{align-items:flex-end;text-align:right}

.hb-slider .s1-k{display:inline-flex;align-items:center;justify-content:center;padding:10px 18px;border:1px solid rgba(255,255,255,.28);border-radius:999px;color:#fff;font-weight:600;font-size:14px;backdrop-filter:blur(6px)}
.hb-slider .s1-t{margin:0;color:#fff;font-weight:800;letter-spacing:-.02em;font-size:clamp(38px,6vw,84px);line-height:1.02;text-transform:uppercase}
.hb-slider .s1-s{margin:0;color:rgba(255,255,255,.88);font-size:16px;max-width:520px}

/* Button under text */
.hb-slider .hb-btn{margin-top:12px;border-radius:999px;padding:14px 28px;border:1px solid rgba(255,255,255,.25)}

/* Nav */
.hb-slider .s1-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.25);background:rgba(0,0,0,.25);color:#fff;font-size:22px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer}
.hb-slider .s1-prev{left:14px}
.hb-slider .s1-next{right:14px}
.hb-slider .s1-dots{position:absolute;left:0;right:0;bottom:16px;display:flex;gap:10px;justify-content:center;align-items:center}
.hb-slider .s1-dot{width: 100px; height: 5px; border-radius: 3.40282e+38px; border: 0px solid rgba(255, 255, 255, .45); /* background: transparent; */ cursor: pointer;}
.hb-slider .s1-dot.is-a{background:#fff}

/* ---- Style 2 (s2) ---- */
.hb-slider .s2{padding:0px 22px}
.hb-slider .s2-g{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:1100px){.hb-slider .s2-g{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.hb-slider .s2-g{grid-template-columns:1fr}}

.hb-slider .s2-t{position:relative;display:block;overflow:hidden;border-radius:18px;aspect-ratio:3/4;background:#f4f4f5;text-decoration:none}
.hb-slider .s2-i{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hb-slider .s2-ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.0) 20%,rgba(0,0,0,.55) 100%)}

.hb-slider .s2-pill{position:absolute;left:50%;transform:translateX(-50%);bottom:18px;padding:14px 28px;border-radius:999px;background:rgba(255,255,255,.92);color:#111;font-weight:700;font-size:14px;white-space:nowrap}

/* Highlight tile (optional) */
.hb-slider .s2-t.is-h .s2-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:22px;gap:10px}
.hb-slider .s2-t.is-h .s2-ov{background:linear-gradient(180deg,rgba(0,0,0,.18) 0%,rgba(0,0,0,.62) 100%)}
.hb-slider .s2-badge{display:inline-flex;align-items:center;justify-content:center;padding:10px 18px;border:1px solid rgba(255,255,255,.28);border-radius:999px;color:#fff;font-weight:600;font-size:14px;backdrop-filter:blur(6px)}
.hb-slider .s2-big{color:#fff;font-weight:900;font-size:clamp(44px,5.5vw,88px);line-height:1.0;text-transform:uppercase}
.hb-slider .s2-mid{color:rgba(255,255,255,.9);font-size:15px}
.hb-slider .s2-t.is-h .s2-pill{position:static;transform:none;left:auto;bottom:auto}

/* -----------------------------
   Guest Checkout (Default theme)
   Matches the provided design examples
------------------------------ */
.gc-page{padding:56px 0 80px;}
.gc-card{max-width:520px;margin:0 auto;background:#fff;border:1px solid #eef1f5;border-radius:10px;box-shadow:0 10px 30px rgba(16,24,40,.06);overflow:hidden}
.gc-top{padding:18px 22px;border-bottom:1px solid #eef1f5;text-align:center}
.gc-title{font-weight:700;letter-spacing:.08em;font-size:12px;color:#111827}
.gc-section-title{padding:18px 22px 10px;font-weight:700;letter-spacing:.08em;font-size:11px;color:#6b7280;text-align:left}
.gc-form{padding:0 22px 18px}
.gc-field{margin-top:12px}
.gc-label{font-size:11px;font-weight:700;color:#6b7280;letter-spacing:.06em;margin-bottom:6px}
.gc-help{font-size:11px;color:#9aa3af;margin-top:6px}
.gc-input{width:100%;height:44px;border:1px solid #e5e7eb;border-radius:6px;padding:10px 12px;font-size:14px;outline:none;background:#fff}
.gc-input:focus{border-color:#c7d2fe;box-shadow:0 0 0 3px rgba(99,102,241,.15)}
.gc-check{display:flex;align-items:center;gap:10px;margin:14px 0 6px;border:1px solid #e5e7eb;border-radius:6px;padding:12px 12px;background:#fff;cursor:pointer;user-select:none}
.gc-check input{appearance:none;-webkit-appearance:none;width:16px;height:16px;border:1px solid #cbd5e1;border-radius:2px;background:#fff;display:inline-block;position:relative;cursor:pointer}
.gc-check input:checked{background:#111827;border-color:#111827}
.gc-check input:checked:after{content:"";position:absolute;left:4px;top:1px;width:5px;height:9px;border:2px solid #fff;border-top:0;border-left:0;transform:rotate(45deg)}
.gc-check span{font-size:12px;font-weight:700;letter-spacing:.06em;color:#374151}
.gc-btn{width:100%;height:46px;border-radius:6px;border:0;background:#6b7280;color:#fff;font-weight:800;letter-spacing:.08em;font-size:12px;display:flex;align-items:center;justify-content:center;gap:10px;margin-top:16px;cursor:pointer}
.gc-btn:hover{filter:brightness(.96)}
.gc-btn .gc-arrow{font-size:18px;line-height:1;margin-top:-2px}
.gc-or{display:flex;align-items:center;justify-content:center;padding:10px 22px 0;color:#9aa3af;font-weight:700;letter-spacing:.12em;font-size:11px}
.gc-or:before,.gc-or:after{content:"";height:1px;background:#eef1f5;flex:1}
.gc-or span{padding:0 14px}
.gc-login{padding:14px 22px 22px}
.gc-muted{color:#9aa3af;font-size:12px;line-height:1.35;margin-top:2px}
.gc-actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:14px}
.gc-btn.ghost{background:#fff;color:#111827;border:1px solid #e5e7eb;text-decoration:none}
.gc-btn.ghost:hover{background:#f9fafb}
.gc-alert{margin:14px 22px 0;padding:10px 12px;border-radius:6px;font-size:13px}
.gc-alert.is-error{background:#fef2f2;border:1px solid #fee2e2;color:#991b1b}
.gc-alert.is-success{background:#ecfdf5;border:1px solid #d1fae5;color:#065f46}
.req{color:#ef4444}

@media(min-width:520px){
  .gc-actions{grid-template-columns:1fr 1fr}
}

/* =========================
   Product Detail – Digital preview buttons (Default Theme)
   ========================= */
.pd-digital-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:12px 0 8px;
}
.pd-digital-btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  height:44px;
  padding:0 14px;
  border-radius:12px;
  border:1px solid rgba(17,24,39,.10);
  background:rgba(255,255,255,.9);
  color:#111827;
  font-weight:600;
  font-size:13px;
  text-decoration:none;
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
}
.pd-digital-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(17,24,39,.16);
  box-shadow:0 10px 24px rgba(17,24,39,.10);
  background:#fff;
}
.pd-digital-btn__icon{
  width:28px;
  height:28px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(59,130,246,.12);
  color:#2563eb;
  flex:0 0 auto;
}
.pd-digital-btn--demo .pd-digital-btn__icon{
  background:rgba(16,185,129,.14);
  color:#059669;
}
.pd-digital-btn__icon svg{
  width:16px;
  height:16px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* ==============================
   Account (Hesabım) – Premium UI
   ============================== */
.acc-premium .acc-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin:8px 0 14px;
}
.acc-premium .acc-title{ margin:0; font-size:26px; letter-spacing:-.02em; }
.acc-premium .acc-sub{ color:#6b7280; margin-top:4px; }
.acc-premium .acc-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.acc-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,.10);
  background:#fff;
  color:#0f172a;
  font-weight:700;
  text-decoration:none;
  box-shadow:0 10px 25px rgba(15,23,42,.06);
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.acc-btn:hover{ transform:translateY(-1px); box-shadow:0 14px 32px rgba(15,23,42,.10); }
.acc-btn--primary{
  border-color:rgba(37,99,235,.25);
  background:linear-gradient(180deg, rgba(37,99,235,.10), rgba(37,99,235,.06));
  color:#1d4ed8;
}
.acc-alert{
  border:1px solid rgba(15,23,42,.10);
  background:#fff;
  border-radius:14px;
  padding:12px 14px;
  box-shadow:0 12px 28px rgba(15,23,42,.06);
  margin:0 0 12px;
}
.acc-banner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-radius:16px;
  padding:14px 14px;
  border:1px solid rgba(16,185,129,.22);
  background:linear-gradient(135deg, rgba(16,185,129,.12), rgba(59,130,246,.08));
  box-shadow:0 14px 34px rgba(15,23,42,.08);
  margin:0 0 12px;
}
.acc-banner__title{ font-weight:900; color:#0f172a; letter-spacing:-.01em; }
.acc-banner__desc{ color:#475569; margin-top:3px; }
.acc-shell{
  border-radius:16px;
  border:1px solid rgba(15,23,42,.08);
  background:#fff;
  box-shadow:0 18px 45px rgba(15,23,42,.08);
  padding:14px;
}
.acc-kpis{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:10px; }
.acc-kpi{
  border-radius:14px;
  border:1px solid rgba(15,23,42,.08);
  background:linear-gradient(180deg, #f8fafc, #ffffff);
  padding:12px 12px;
}
.acc-kpi__label{ color:#6b7280; font-weight:700; }
.acc-kpi__value{ font-size:24px; font-weight:900; letter-spacing:-.02em; margin-top:4px; color:#0f172a; }
.acc-grid-2{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; margin-top:10px; }
.acc-card{
  border-radius:16px;
  border:1px solid rgba(15,23,42,.08);
  background:#fff;
  padding:14px;
}
.acc-card--highlight{ background:linear-gradient(180deg, rgba(37,99,235,.08), rgba(255,255,255,1)); }
.acc-card__title{ font-weight:900; margin-bottom:10px; color:#0f172a; letter-spacing:-.01em; }
.acc-row{ display:flex; align-items:center; justify-content:space-between; padding:8px 0; border-bottom:1px dashed rgba(15,23,42,.10); }
.acc-row:last-child{ border-bottom:none; }
.acc-row span{ color:#64748b; font-weight:700; }
.acc-row b{ color:#0f172a; }
.acc-money{ font-size:26px; font-weight:950; letter-spacing:-.02em; color:#0f172a; }
.acc-muted{ color:#6b7280; margin-top:6px; }
.acc-mini-actions{ margin-top:10px; }
.acc-link{ color:#1d4ed8; font-weight:800; text-decoration:none; }
.acc-link:hover{ text-decoration:underline; }

@media (max-width: 900px){
  .acc-premium .acc-head{ align-items:flex-start; flex-direction:column; }
  .acc-kpis{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .acc-grid-2{ grid-template-columns:1fr; }
}

@media (max-width: 520px){
  .acc-kpis{ grid-template-columns:1fr; }
  .acc-banner{ flex-direction:column; align-items:flex-start; }
}

/* Account premium extras (chips + icons + trends) */
.acc-kpi__top{ display:flex; align-items:center; gap:8px; }
.acc-ico{ width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px; background:rgba(15,23,42,.06); font-size:16px; }
.acc-kpi__hint{ margin-top:6px; color:#6b7280; font-weight:700; font-size:12px; }
.acc-trend{ margin-left:auto; font-weight:900; font-size:12px; padding:6px 10px; border-radius:999px; border:1px solid rgba(15,23,42,.12); background:rgba(15,23,42,.04); color:#0f172a; }
.acc-trend--up{ background:rgba(16,185,129,.10); border-color:rgba(16,185,129,.25); color:#065f46; }
.acc-trend--down{ background:rgba(239,68,68,.10); border-color:rgba(239,68,68,.25); color:#7f1d1d; }

.acc-chipbar{ display:flex; flex-wrap:wrap; gap:8px; padding:10px; border:1px solid rgba(15,23,42,.10); border-radius:14px; background:rgba(255,255,255,.75); }
.acc-chip{ appearance:none; border:1px solid rgba(15,23,42,.12); background:#fff; color:#0f172a; padding:8px 12px; border-radius:999px; font-weight:850; font-size:12px; cursor:pointer; }
.acc-chip:hover{ transform:translateY(-1px); box-shadow:0 10px 24px rgba(15,23,42,.08); }
.acc-chip.is-active{ background:rgba(29,78,216,.10); border-color:rgba(29,78,216,.25); color:#1d4ed8; }

.acc-sr-only{ position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }

.acc-filters__row--chips{ grid-template-columns: 1fr 1fr 1fr 1fr; }
.acc-field--wide{ grid-column: 1 / -1; }

@media (max-width: 900px){
  .acc-filters__row--chips{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px){
  .acc-filters__row--chips{ grid-template-columns: 1fr; }
}

/* Dark mode account (best-effort) */
body.is-dark .acc-ico{ background:rgba(255,255,255,.08); }
body.is-dark .acc-chipbar{ background:rgba(2,6,23,.35); border-color:rgba(255,255,255,.10); }
body.is-dark .acc-chip{ background:rgba(2,6,23,.55); border-color:rgba(255,255,255,.10); color:rgba(255,255,255,.92); }
body.is-dark .acc-chip.is-active{ background:rgba(59,130,246,.18); border-color:rgba(59,130,246,.28); color:#93c5fd; }
body.is-dark .acc-trend{ background:rgba(2,6,23,.55); border-color:rgba(255,255,255,.10); color:rgba(255,255,255,.92); }

/* ============================
   Account pages – Premium unify
   ============================ */
.account-page.container{
  max-width: 1180px;
}
.account-title{ font-size: 26px; letter-spacing:-.02em; margin:0 0 14px; }
.account-layout{ display:flex; gap:14px; align-items:flex-start; }
.account-sidebar{ flex:0 0 320px; position:sticky; top: 92px; }
.account-content{ flex:1 1 auto; min-width:0; }
.account-section-title{ font-weight:950; letter-spacing:-.01em; font-size:16px; }
.acc-card{ box-shadow:0 18px 45px rgba(15,23,42,.08); border-color:rgba(15,23,42,.08); }
.account-nav__link{ font-weight:850; color:#0f172a; text-decoration:none; }
.account-nav__link.is-active{ box-shadow:0 16px 34px rgba(15,23,42,.20); }
.account-table-wrap{ overflow:auto; border-radius:16px; border:1px solid rgba(15,23,42,.08); background:#fff; }
.account-page thead th{ background:rgba(15,23,42,.03); }
.status-badge{ display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; font-weight:900; font-size:12px; border:1px solid rgba(15,23,42,.10); background:rgba(15,23,42,.04); }

@media (max-width: 900px){
  .account-layout{ flex-direction:column; }
  .account-sidebar{ position:relative; top:auto; width:100%; flex:1 1 auto; }
}

/* Dark mode unify for account layout */
body.is-dark .account-table-wrap{ background:rgba(2,6,23,.55); border-color:rgba(255,255,255,.10); }
body.is-dark .account-page thead th{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.08); color:rgba(255,255,255,.70); }
body.is-dark .account-page tbody td{ border-color:rgba(255,255,255,.06); color:rgba(255,255,255,.92); }
body.is-dark .account-nav__link{ color:rgba(255,255,255,.92); border-color:rgba(255,255,255,.10); background:rgba(2,6,23,.35); }
body.is-dark .account-nav__link:hover{ background:rgba(2,6,23,.55); }
body.is-dark .account-nav__link.is-active{ background:rgba(59,130,246,.18); border-color:rgba(59,130,246,.28); color:#93c5fd; }

/* ============================
   Account modal (addresses)
   ============================ */
.acc-modal{ position:fixed; inset:0; display:none; z-index:9999; }
.acc-modal.is-open{ display:block; }
.acc-modal__backdrop{ position:absolute; inset:0; background:rgba(2,6,23,.55); backdrop-filter: blur(6px); }
.acc-modal__panel{
  position:relative;
  width:min(720px, calc(100vw - 24px));
  margin: 70px auto;
  border-radius:18px;
  border:1px solid rgba(15,23,42,.12);
  background:#fff;
  box-shadow:0 30px 80px rgba(15,23,42,.35);
  overflow:hidden;
}
.acc-modal__head{ display:flex; align-items:center; justify-content:space-between; padding:14px 14px; border-bottom:1px solid rgba(15,23,42,.08); }
.acc-modal__title{ font-weight:950; letter-spacing:-.01em; }
.acc-modal__close{ width:38px; height:38px; border-radius:12px; border:1px solid rgba(15,23,42,.10); background:rgba(15,23,42,.03); cursor:pointer; }
.acc-modal__body{ padding:14px; }
.acc-modal__actions{ display:flex; gap:10px; justify-content:flex-end; padding:14px; border-top:1px solid rgba(15,23,42,.08); background:rgba(15,23,42,.02); }
html.acc-modal-open{ overflow:hidden; }

body.is-dark .acc-modal__panel{ background:rgba(2,6,23,.92); border-color:rgba(255,255,255,.10); }
body.is-dark .acc-modal__head, body.is-dark .acc-modal__actions{ border-color:rgba(255,255,255,.10); background:rgba(255,255,255,.04); }
body.is-dark .acc-modal__title{ color:rgba(255,255,255,.92); }
body.is-dark .acc-modal__close{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.10); color:rgba(255,255,255,.92); }


/* === Per-theme visual settings hooks === */
body{ background: var(--t-body-bg, initial) !important; }
.card, .panel, .d-card{ background: var(--t-card-bg, initial) !important; }
.site-header{ background: var(--t-header-bg, transparent); color: var(--t-header-text, inherit); }
.site-header.is-scrolled{ background: var(--t-header-sticky-bg, rgba(0,0,0,.92)); color: var(--t-header-sticky-text, inherit); }
.site-header a, .site-header .header-link{ color: inherit !important; }
.site-footer{ background: var(--t-footer-bg, initial) !important; color: var(--t-footer-text, inherit) !important; }
.site-footer a{ color: inherit !important; opacity:.92; }
.site-footer a:hover{ opacity:1; }

/* Digital theme primary bindings */
:root{
  --d-accent: var(--t-primary, var(--d-accent));
  --d-grad1: var(--t-primary, var(--d-grad1));
  --d-grad2: var(--t-primary, var(--d-grad2));
}



/* =========================
   THEME SETTINGS BRIDGE
========================= */
[data-theme-header]{ transition: background .2s ease, color .2s ease, box-shadow .2s ease; }
[data-theme-header].th-fixed{ position:fixed; top:0; left:0; right:0; z-index:9998; }
[data-theme-header].th-sticky{ position:sticky; top:0; z-index:9998; }

[data-theme-header]{ background: var(--t-header-bg) !important; color: var(--t-header-text) !important; }
[data-theme-header].th-sticky.is-stuck,
[data-theme-header].th-fixed.is-stuck,
[data-theme-header].th-sticky.is-scrolled,
[data-theme-header].th-fixed.is-scrolled{
  background: var(--t-header-sticky-bg) !important;
  color: var(--t-header-sticky-text) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.10);
}

/* Header layout helpers (best-effort) */
[data-theme-header].th-hl-minimal .center-nav{ display:none !important; }

/* Grid-based header (desktop): make logo alignment deterministic */
[data-theme-header].th-hl-centered .header-desktop-row{ grid-template-columns:1fr auto 1fr; }
[data-theme-header].th-hl-centered .header-desktop-row .header-logo{ grid-column:2; justify-self:center; }
[data-theme-header].th-hl-centered .header-desktop-row .center-nav{ grid-column:1; justify-self:start; }
[data-theme-header].th-hl-centered .header-desktop-row .right.row{ grid-column:3; justify-self:end; }

[data-theme-header].th-hl-right .header-desktop-row .header-logo{ grid-column:3; justify-self:end; }
[data-theme-header].th-hl-right .header-desktop-row .right.row{ grid-column:1; justify-self:start; }
[data-theme-header].th-hl-right .header-desktop-row .center-nav{ grid-column:2; justify-self:center; }

.btn, .btn-primary{ background: var(--t-primary) !important; border-color: var(--t-primary) !important; }
.btn-outline{ color: var(--t-primary) !important; border-color: var(--t-primary) !important; background: transparent !important; }
a, .link, .text-primary{ color: var(--t-primary); }