/* KaliteMall - Kombini Gör V1.1 */
:root {
  --km-combo-green: #234B38;
  --km-combo-green-dark: #173326;
  --km-combo-rose: #B98263;
  --km-combo-soft: #F3E7DF;
  --km-combo-cream: #F6F3ED;
  --km-combo-text: #1D2A24;
  --km-combo-muted: #69736d;
  --km-combo-line: rgba(35, 75, 56, .14);
}

.km-combo-entry {
  width: 100%;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
  margin: 14px 0;
  padding: 11px 14px;
  border: 1px solid var(--km-combo-line);
  border-radius: 16px;
  background: linear-gradient(135deg, #fff 0%, var(--km-combo-cream) 100%);
  color: var(--km-combo-text);
  cursor: pointer;
  text-align: left;
  box-shadow: 0 6px 20px rgba(29, 42, 36, .05);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.km-combo-entry:hover {
  transform: translateY(-1px);
  border-color: rgba(35, 75, 56, .28);
  box-shadow: 0 10px 26px rgba(29, 42, 36, .09);
}
.km-combo-entry-images { display:flex; align-items:center; min-width:82px; }
.km-combo-entry-images img {
  width: 38px; height: 48px; object-fit: cover; border-radius: 9px;
  border: 2px solid #fff; background:#fff; margin-left:-12px;
  box-shadow: 0 3px 10px rgba(0,0,0,.09);
}
.km-combo-entry-images img:first-child { margin-left:0; }
.km-combo-entry-copy { display:flex; flex-direction:column; min-width:0; }
.km-combo-entry-copy strong { font-size:16px; line-height:1.2; color:var(--km-combo-green); }
.km-combo-entry-copy span { font-size:12.5px; color:var(--km-combo-muted); margin-top:3px; }
.km-combo-entry-arrow {
  width:36px; height:36px; border-radius:50%; display:grid; place-items:center;
  background:var(--km-combo-green); color:#fff; font-size:19px;
}

.km-combo-lock { overflow:hidden !important; }
.km-combo-modal {
  position:fixed; inset:0; z-index:2147482000;
  display:flex; align-items:center; justify-content:center;
  padding:24px; background:rgba(17, 27, 22, .58);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .2s ease, visibility .2s ease;
  backdrop-filter:blur(3px);
}
.km-combo-modal.is-open { opacity:1; visibility:visible; pointer-events:auto; }
.km-combo-dialog {
  position:relative; width:min(1180px, 96vw); max-height:90vh; overflow:auto;
  background:#fff; border-radius:24px; padding:28px;
  box-shadow:0 28px 80px rgba(0,0,0,.25);
}
.km-combo-close {
  position:absolute; right:18px; top:16px; width:38px; height:38px;
  border:0; border-radius:50%; background:var(--km-combo-cream);
  color:var(--km-combo-text); font-size:28px; line-height:1; cursor:pointer;
}
.km-combo-head { padding-right:50px; margin-bottom:20px; }
.km-combo-eyebrow {
  display:inline-block; font-size:11px; font-weight:700; letter-spacing:.09em;
  text-transform:uppercase; color:var(--km-combo-rose); margin-bottom:6px;
}
.km-combo-head h2 { margin:0; color:var(--km-combo-green); font-size:27px; line-height:1.2; }
.km-combo-head p { margin:7px 0 0; color:var(--km-combo-muted); font-size:13.5px; }
.km-combo-grid {
  display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:14px;
}
.km-combo-card {
  min-width:0; border:1px solid var(--km-combo-line); border-radius:18px;
  background:#fff; overflow:hidden;
}
.km-combo-card.is-current { border-color:rgba(185,130,99,.55); background:#fffdfb; }
.km-combo-card-image-wrap { position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--km-combo-cream); }
.km-combo-card-image { width:100%; height:100%; display:block; object-fit:cover; }
.km-combo-card-role {
  position:absolute; left:9px; top:9px; padding:5px 8px; border-radius:999px;
  background:rgba(255,255,255,.93); color:var(--km-combo-green);
  font-size:10.5px; font-weight:700; box-shadow:0 2px 8px rgba(0,0,0,.08);
}
.km-combo-card-body { padding:12px; }
.km-combo-card-name {
  min-height:40px; color:var(--km-combo-text); font-size:13px; line-height:1.45;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.km-combo-card-meta { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:9px; }
.km-combo-card-meta span { font-size:11.5px; color:var(--km-combo-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.km-combo-card-meta strong { font-size:12.5px; white-space:nowrap; color:var(--km-combo-text); }
.km-combo-card-link, .km-combo-current-badge {
  display:flex; align-items:center; justify-content:center; min-height:34px; margin-top:11px;
  border-radius:10px; font-size:12px; font-weight:700; text-decoration:none;
}
.km-combo-card-link { background:var(--km-combo-green); color:#fff !important; }
.km-combo-card-link:hover { background:var(--km-combo-green-dark); }
.km-combo-current-badge { background:var(--km-combo-soft); color:#8a5f49; }
.km-combo-footer {
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  margin-top:20px; padding-top:18px; border-top:1px solid var(--km-combo-line);
}
.km-combo-total { display:flex; flex-direction:column; }
.km-combo-total span { font-size:11px; color:var(--km-combo-muted); }
.km-combo-total strong { margin-top:2px; color:var(--km-combo-text); font-size:21px; }
.km-combo-refresh {
  border:0; border-radius:12px; padding:12px 17px; background:var(--km-combo-soft);
  color:var(--km-combo-green); font-weight:700; cursor:pointer;
}
.km-combo-refresh:hover { background:#ead8cc; }
.km-combo-v1-note { margin-top:12px; font-size:10.5px; color:#879089; text-align:right; }

@media (max-width: 960px) {
  .km-combo-grid { grid-template-columns:repeat(3, minmax(0,1fr)); }
}
@media (max-width: 640px) {
  .km-combo-modal { padding:0; align-items:flex-end; }
  .km-combo-dialog { width:100%; max-height:92vh; border-radius:22px 22px 0 0; padding:20px 14px 18px; }
  .km-combo-head h2 { font-size:22px; }
  .km-combo-grid {
    display:flex; gap:11px; overflow-x:auto; scroll-snap-type:x mandatory;
    padding-bottom:6px; margin-right:-14px; padding-right:14px;
  }
  .km-combo-card { flex:0 0 72%; scroll-snap-align:start; }
  .km-combo-footer { align-items:stretch; flex-direction:column; }
  .km-combo-total { width:100%; }
  .km-combo-refresh { width:100%; }
  .km-combo-v1-note { text-align:left; }
  .km-combo-entry { grid-template-columns:auto 1fr auto; gap:10px; padding:10px; }
  .km-combo-entry-images { min-width:68px; }
  .km-combo-entry-images img { width:32px; height:42px; margin-left:-10px; }
  .km-combo-entry-copy strong { font-size:15px; }
  .km-combo-entry-copy span { font-size:11.5px; }
}

/* V1.1 - seçim, beden/numara ve sepete ekleme */
.km-combo-toolbar {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin:-4px 0 12px; padding:0 2px;
}
.km-combo-toolbar span { font-size:12px; color:var(--km-combo-muted); font-weight:600; }
.km-combo-toolbar button {
  border:1px solid rgba(35,75,56,.18); background:#fff; color:var(--km-combo-green);
  border-radius:999px; padding:7px 11px; font-size:11px; font-weight:700; cursor:pointer;
}
.km-combo-pick {
  position:absolute; right:9px; top:9px; width:28px; height:28px; border-radius:9px;
  display:grid; place-items:center; background:rgba(255,255,255,.96); box-shadow:0 2px 8px rgba(0,0,0,.10);
  cursor:pointer; z-index:2;
}
.km-combo-pick input { position:absolute; opacity:0; pointer-events:none; }
.km-combo-pick span {
  width:20px; height:20px; display:grid; place-items:center; border-radius:6px;
  background:var(--km-combo-green); color:#fff; font-size:13px; font-weight:800;
}
.km-combo-pick input:not(:checked) + span { background:#fff; color:transparent; border:1px solid rgba(35,75,56,.32); }
.km-combo-card.is-unselected { opacity:.52; }
.km-combo-card.is-unselected .km-combo-card-image { filter:grayscale(.2); }
.km-combo-card-actions {
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px; align-items:center; margin-top:11px;
}
.km-combo-size-select, .km-combo-size-fixed {
  min-width:0; min-height:34px; border:1px solid rgba(35,75,56,.20); border-radius:9px;
  background:#fff; color:var(--km-combo-text); font-size:11.5px; font-weight:600;
}
.km-combo-size-select { width:100%; padding:0 28px 0 9px; cursor:pointer; }
.km-combo-size-fixed { display:flex; align-items:center; padding:0 10px; }
.km-combo-size-fixed.is-error { color:#a43b32; border-color:rgba(164,59,50,.35); }
.km-combo-size-select.has-error {
  border-color:#b24a3d; box-shadow:0 0 0 2px rgba(178,74,61,.12); background:#fff9f7;
}
.km-combo-card-actions .km-combo-card-link {
  min-height:34px; margin-top:0; padding:0 11px; white-space:nowrap;
}
.km-combo-footer-actions { display:flex; gap:9px; align-items:center; }
.km-combo-add {
  border:0; border-radius:12px; padding:12px 18px; min-height:42px;
  background:var(--km-combo-green); color:#fff; font-size:12px; font-weight:800; cursor:pointer;
  box-shadow:0 6px 18px rgba(35,75,56,.14);
}
.km-combo-add:hover { background:var(--km-combo-green-dark); }
.km-combo-add:disabled, .km-combo-refresh:disabled { opacity:.55; cursor:wait; }
.km-combo-add.is-success { background:var(--km-combo-green-dark); }
.km-combo-cart-status {
  min-height:17px; margin-top:10px; padding:0 2px; text-align:right; font-size:11.5px; color:var(--km-combo-muted);
}
.km-combo-cart-status.is-working { color:#7c684d; }
.km-combo-cart-status.is-success { color:var(--km-combo-green); font-weight:700; }
.km-combo-cart-status.is-error { color:#a43b32; font-weight:600; }
.km-combo-cart-frame {
  position:fixed !important; left:-10000px !important; top:-10000px !important;
  width:2px !important; height:2px !important; opacity:.01 !important; pointer-events:none !important;
  border:0 !important; z-index:-1 !important;
}

@media (max-width: 640px) {
  .km-combo-toolbar { margin-top:0; }
  .km-combo-card-actions { grid-template-columns:1fr; }
  .km-combo-card-actions .km-combo-card-link { width:100%; }
  .km-combo-footer-actions { width:100%; flex-direction:column; }
  .km-combo-footer-actions .km-combo-refresh, .km-combo-footer-actions .km-combo-add { width:100%; }
  .km-combo-cart-status { text-align:left; }
}
