/* Container width -> 1450px and centered; prevent horizontal overflow */
.maxmag-wrap{max-width:1450px;width:100%;margin-left:auto;margin-right:auto;padding:10px 12px;font-family:inherit;overflow-x:hidden}

/* Filter bar */
.mm-filter-bar{display:flex;justify-content:flex-start;margin:6px 0 12px}
.mm-filter-trigger{display:inline-flex;gap:8px;align-items:center;border:1px solid #e5e7eb;background:#fff;border-radius:999px;padding:8px 12px;box-shadow:none}
.mm-filter-trigger i{color:#000;opacity:.9}

/* Grid */
.maxmag-grid{display:grid;grid-template-columns:repeat(var(--mm-cols,4),minmax(0,1fr));gap:16px}
@media (max-width:720px){ .maxmag-grid{grid-template-columns:1fr} }
.maxmag-loader{text-align:center;padding:16px;color:#777;display:none}
#maxmagSentinel{height:1px}

/* Card */
.mm-card{background:#fff;border-radius:14px;overflow:hidden;transition:transform .2s ease, box-shadow .2s ease;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.mm-card:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(0,0,0,.08)}
.mm-media{position:relative;display:block;aspect-ratio:3/4;background:#f7f7f7;overflow:hidden}
.mm-img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .25s ease}
.mm-gdots{display:none;justify-content:center;gap:6px;margin:6px 0 0}
.mm-gdots .gd{width:6px;height:6px;border-radius:50%}
@media (max-width:720px){ .mm-gdots{display:flex} .mm-gdots .gd{background:rgba(0,0,0,.35)} .mm-gdots .gd.active{background:rgba(0,0,0,.9)} }
.mm-info{padding:12px}
.mm-name{font-size:.95rem;line-height:1.35;margin:0 0 6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mm-price{font-weight:700;margin-bottom:6px}
.mm-variants{display:flex;gap:10px;align-items:center;white-space:nowrap;overflow:hidden;margin-bottom:8px}
.mm-sizes{display:flex;gap:6px}
.mm-size{font-size:.72rem;border:1px solid rgba(0,0,0,.12);border-radius:9px;padding:4px 8px;background:#fafafa}
.mm-colors{display:inline-flex;align-items:center}
.mm-color{width:20px;height:20px;border-radius:50%;background:var(--mmc,#95a5c5);border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.15)}
.mm-colors .mm-color + .mm-color{margin-left:-8px}
.mm-color.is-count{background:#946596;color:#fff;font-weight:700;display:inline-flex;align-items:center;justify-content:center;font-size:.7rem;width:24px;height:24px}
.mm-actions{display:flex;justify-content:flex-start;opacity:0;transform:translateY(6px);transition:all .2s ease}
.mm-card:hover .mm-actions{opacity:1;transform:none}
.btn{appearance:none;border:1px solid rgba(0,0,0,.12);background:#eaeaea;color:#fff;border-radius:999px;padding:8px 12px;font-size:.85rem;line-height:1;cursor:pointer;text-transform:uppercase}
.btn:hover{opacity:.9}

/* Bottom Sheet (Desktop) - keep narrowed */
.mm-sheet{position:fixed;inset:0;display:none;z-index:10000;background:rgba(0,0,0,.35)}
.mm-sheet.show{display:block}
.mm-sheet .sheet-inner{position:absolute;left:50%;right:auto;bottom:0;background:#fff;border-top-left-radius:16px;border-top-right-radius:16px;width:min(calc(100vw - 120px), var(--mm-panel-w,1200px));transform:translate(-50%, 100%);transition:transform .25s ease;padding:12px 14px;overflow-x:hidden}
.mm-sheet.show .sheet-inner{transform:translate(-50%, 0)}
.sheet-max{width:100%;max-width:none;margin:0 auto;position:relative}
.sheet-close{position:absolute;right:10px;top:8px;border:0;background:transparent;font-size:22px;cursor:pointer;color:#000}
.sheet-row.one-line{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;padding:6px 4px}
.chip{border-radius:999px;padding:8px 12px;background:#f5f5f5;border:1px solid #e5e7eb;cursor:pointer;min-height:36px;font-size:.9rem;white-space:nowrap}
.chip.sel{display:flex;align-items:center;justify-content:center}
.chip.sel select{border:0;background:transparent;outline:0;padding:4px 2px;width:auto;text-align:center;appearance:none;max-width:220px}
.chip.apply{background:#111;color:#fff}

/* Price toggle */
.chip.toggle{display:inline-flex;align-items:center;gap:10px;padding:6px 12px}
.chip.toggle .switch{width:38px;height:20px;background:#e5e7eb;border-radius:999px;position:relative;display:inline-block}
.chip.toggle .switch:after{content:'';position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.18);transition:left .2s}
.chip.toggle input{display:none}
.chip.toggle input:checked + .switch{background:#111}
.chip.toggle input:checked + .switch:after{left:20px}

/* Mobile left drawer */
@media (max-width:720px){
  .mm-sheet .sheet-inner{top:0;bottom:0;width:86%;left:0;transform:translateX(-100%);border-top-left-radius:0;border-top-right-radius:12px;border-bottom-right-radius:12px}
  .mm-sheet.show .sheet-inner{transform:translateX(0)}
  .sheet-max{width:calc(100% - 16px);max-width:none;margin:0}
  .sheet-row.one-line{flex-direction:column;align-items:flex-start;justify-content:flex-start}
}

/* Toast */
#mmToast{position:fixed;left:16px;bottom:16px;background:#fff;border:1px solid rgba(0,0,0,.08);box-shadow:0 0 0 1px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.12);border-radius:14px;padding:10px 12px;display:none;align-items:center;gap:10px;z-index:9999}
#mmToast .tick{width:22px;height:22px;border-radius:50%;background:#22c55e;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:700}


/* === MaxMağaza 1.2.0 Overflow Fixes === */
.maxmag-container, .maxmag-wrap{
  max-width:1450px;
  width:100%;
  margin-left:auto;
  margin-right:auto;
  padding-left:12px;
  padding-right:12px;
  box-sizing:border-box;
  overflow-x:clip;
}
@supports not (overflow: clip){ .maxmag-container, .maxmag-wrap{ overflow-x:hidden; } }

/* Grid children shouldn't cause overflow */
.maxmag-wrap *{ box-sizing:border-box; min-width:0; }

/* Variants line should wrap to avoid horizontal scroll */
.mm-variants{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; overflow:visible; }
.mm-sizes{ display:flex; gap:6px; flex-wrap:wrap; }
.mm-colors{ display:inline-flex; align-items:center; flex-wrap:nowrap; }

/* Product image stays within card */
.mm-media{ overflow:hidden; }
.mm-img{ width:100%; height:100%; object-fit:cover; display:block; }

/* Bottom sheet won't push layout */
.mm-sheet .sheet-inner{ max-width:min(100vw - 120px, var(--mm-panel-w,1100px)); }


/* === MaxMag 1.2.1: Strong horizontal overflow clamp === */
html.maxmag-html, body.maxmag-active{ overflow-x: hidden !important; }
.maxmag-container{ width:min(100%,1450px); margin-left:auto; margin-right:auto; padding-inline:12px; box-sizing:border-box; }
.maxmag-wrap{ width:100%; max-width:100%; overflow-x:hidden; }
.maxmag-grid{ overflow:hidden; }
.mm-card, .mm-info, .mm-variants, .mm-sizes, .mm-colors{ min-width:0; }
.mm-variants{ flex-wrap:wrap }
.mm-sheet{ contain:inline-size; } /* prevent fixed sheet from influencing layout calc */



/* === MaxMag 1.2.2 Horizontal Overflow Hard Fix === */
html.maxmag-html, body.maxmag-active { overflow-x: hidden !important; width: 100% !important; }
.maxmag-container { width: min(100%, 1450px); margin: 0 auto; padding-inline: 12px; box-sizing: border-box; overflow-x: hidden; }
.maxmag-wrap { width: 100%; max-width: 100%; overflow-x: hidden; }
.maxmag-grid { max-width: 100%; overflow: hidden; }
.mm-card, .mm-info, .mm-variants, .mm-sizes, .mm-colors, .mm-actions { max-width: 100%; min-width: 0; }
.mm-variants { flex-wrap: wrap; }
.mm-name, .mm-price { word-break: break-word; overflow-wrap: anywhere; }
.mm-sheet { position: fixed; left: 0; right: 0; top: 0; bottom: 0; }
.mm-sheet .sheet-inner { width: min(calc(100vw - 120px), var(--mm-panel-w,1100px)); max-width: 100%; }