/* Ürün Karşılaştırma — kart köşesindeki ikon buton (favori kalbinin solunda) */
.compare-btn {
    position: absolute; top: 14px; right: 64px; z-index: 4;
    width: 44px; height: 44px; padding: 0;
    display: flex; align-items: center; justify-content: center;
    border-radius: 999px; border: 1px solid rgba(15,23,42,.12);
    background: rgba(255, 255, 255, .96);
    color: #64748b; cursor: pointer;
    box-shadow: 0 10px 24px rgba(15,23,42,.14);
    transition: transform .2s ease, box-shadow .2s ease, color .15s ease;
}
.compare-btn:hover { color: #2563eb; transform: translateY(-1px); box-shadow: 0 14px 30px rgba(15,23,42,.18); }
.compare-btn.is-loading { opacity: .6; pointer-events: none; }
.compare-btn svg { width: 20px; height: 20px; }
.compare-btn.is-active { color: #2563eb; border-color: #bfdbfe; background: #eff6ff; }
.category-card__media:not(:has(.favorite-toggle)) .compare-btn { right: 14px; }

.category-card__media .compare-btn { top: 10px; right: 56px; width: 36px; height: 36px; }
.category-card__media .compare-btn svg { width: 17px; height: 17px; }
.category-card__media:not(:has(.favorite-toggle)) .compare-btn { right: 10px; }
@media (max-width: 760px) {
    .category-card__media .compare-btn { top: 8px; right: 46px; width: 30px; height: 30px; }
    .category-card__media .compare-btn svg { width: 14px; height: 14px; }
    .category-card__media:not(:has(.favorite-toggle)) .compare-btn { right: 8px; }
}

/* Ürün detay sayfası galeri kapağı — favori kalp ikonunun solunda */
.single-gallery__stage .compare-btn { top: 18px; right: 68px; }
.single-gallery__stage:not(:has(.favorite-toggle)) .compare-btn { right: 18px; }

/* Anlık geri bildirim (ör. "en fazla 4 ürün") */
.compare-toast {
    position: fixed; left: 50%; bottom: 84px; transform: translate(-50%, 10px);
    background: #0f172a; color: #fff; padding: 11px 18px; border-radius: 10px;
    font-size: 13.5px; font-weight: 600; box-shadow: 0 12px 28px rgba(15, 23, 42, .25);
    opacity: 0; transition: opacity .2s ease, transform .2s ease; z-index: 300; max-width: 90vw; text-align: center;
}
.compare-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

/* Sitenin altında sabit duran karşılaştırma çubuğu */
.compare-float-bar {
    position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%);
    display: flex; align-items: center; gap: 12px;
    background: #0f172a; color: #fff; padding: 10px 12px 10px 16px; border-radius: 999px;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .28); z-index: 150;
}
.compare-float-bar[hidden] { display: none; }
.compare-float-icon { display: flex; color: #93c5fd; }
.compare-float-text { font-size: 13.5px; font-weight: 600; white-space: nowrap; }
.compare-float-cta {
    display: inline-flex; align-items: center; padding: 8px 16px; border-radius: 999px;
    background: #fff; color: #0f172a; text-decoration: none; font-size: 13px; font-weight: 700; white-space: nowrap;
}
.compare-float-cta:hover { background: #e2e8f0; }
.compare-float-clear-form { margin: 0; }
.compare-float-clear {
    display: flex; align-items: center; justify-content: center;
    width: 26px; height: 26px; padding: 0; border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .25); background: transparent;
    color: #cbd5e1; font-size: 16px; line-height: 1; cursor: pointer;
}
.compare-float-clear:hover { background: rgba(255, 255, 255, .12); color: #fff; }
@media (max-width: 480px) {
    .compare-float-bar { bottom: 12px; max-width: calc(100vw - 24px); }
}

/* Header/drawer linkindeki sayı rozeti */
.compare-badge {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 16px; height: 16px; padding: 0 4px; margin-left: 4px;
    border-radius: 999px; background: #f1890a; color: #fff;
    font-size: 10px; font-weight: 800; line-height: 1;
}
.compare-badge.is-empty { display: none; }

/* Karşılaştırma sayfası */
.compare-page { padding-bottom: 8px; }
.compare-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.compare-head h1 { margin: 0; }
.compare-empty-hint { max-width: 340px; font-size: 13px !important; }

.compare-table-wrap { overflow-x: auto; border: 1px solid #e6e6e6; border-radius: 14px; background: #fff; box-shadow: 0 10px 30px rgba(28, 24, 21, .08); padding: 15px; }
.compare-table { border-collapse: separate; border-spacing: 0; width: 100%; min-width: 640px; background: #fff; }
.compare-table th, .compare-table td { padding: 12px 16px; text-align: left; border-bottom: 1px solid #f1f5f9; font-size: 13.5px; }
.compare-table tbody tr:last-child th, .compare-table tbody tr:last-child td { border-bottom: none; }

.compare-label-cell {
    position: sticky; left: 0; z-index: 1;
    width: 130px; min-width: 130px; background: #fafafa;
    font-weight: 600; color: #475569; font-size: 13px;
    border-right: 1px solid #f1f5f9;
}
thead .compare-label-cell { background: #fff; z-index: 3; }

.compare-product-cell {
    position: relative; width: 200px; min-width: 200px; vertical-align: top;
    background: #fff; border-left: 1px solid #f1f5f9;
}
.compare-product-link { display: block; text-decoration: none; color: inherit; }
.compare-product-cell img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 8px; background: #f1f5f9; margin-bottom: 8px; }
.compare-product-name {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    font-size: 13.5px; font-weight: 600; color: #0f172a; line-height: 1.35; min-height: 2.7em;
}
.compare-product-price { margin: 6px 0 10px; font-size: 14px; font-weight: 700; color: #0f172a; }
.compare-goto-btn {
    display: inline-flex; align-items: center; justify-content: center; width: 100%; box-sizing: border-box;
    min-height: 38px; border-radius: 10px; border: 1px solid #e2e8f0;
    background: #fff; color: #334155; font-size: 13px; font-weight: 600; text-decoration: none;
    transition: background .15s ease, border-color .15s ease;
}
.compare-goto-btn:hover { background: #f8fafc; border-color: #cbd5e1; }

.compare-col-remove {
    position: absolute; top: 8px; right: 8px; left: auto;
    width: 26px; height: 26px; border-radius: 50%;
    background: #f1890a; border: 1px solid #f1890a; color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 15px; line-height: 1; cursor: pointer;
}
.compare-col-remove:hover { background: #d5730a; border-color: #d5730a; color: #fff; }

.compare-stock-badge { display: inline-flex; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.compare-stock-badge.in-stock { background: #dcfce7; color: #15803d; }
.compare-stock-badge.out-of-stock { background: #fee2e2; color: #b91c1c; }

.compare-empty-state {
    display: grid; gap: 14px; place-items: center; padding: 52px 24px;
    border: 1px dashed #d6d3d1; border-radius: 24px; background: #fff; color: #374151; text-align: center;
}

@media (max-width: 640px) {
    .compare-head { flex-direction: column; align-items: flex-start; gap: 10px; }
    .compare-label-cell { width: 96px; min-width: 96px; font-size: 12px; padding: 10px; }
    .compare-product-cell { width: 160px; min-width: 160px; padding: 10px; }
    .compare-table th, .compare-table td { padding: 10px; }
}
