/* ==========================================================================
   Cinematic Modules (Smart Filter, Slide-in Reserve Cart)
   IMEI styles moved to the standalone Cinematic IMEI Diagnostic plugin.
   ========================================================================== */

:root {
    --ice-cyan: #38bdf8;
    --ice-blue-glow: rgba(56, 189, 248, 0.25);
    --dark-glass-bg: rgba(11, 15, 25, 0.82);
    --card-border: rgba(56, 189, 248, 0.18);
}

/* --- ۲. Smart Archive Filter --- */
.smart-archive-filter-bar {
    background: var(--dark-glass-bg);
    border: 1px solid var(--card-border);
    backdrop-filter: blur(16px);
    border-radius: 16px;
    padding: 16px 20px;
    margin-bottom: 30px;
    position: sticky;
    top: 80px;
    z-index: 40;
    direction: rtl;
}
.filter-groups-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
}
.filter-pill-group {
    display: flex;
    align-items: center;
    gap: 8px;
}
.group-label {
    font-size: 0.85rem;
    color: #94a3b8;
    font-weight: 600;
}
.filter-chip {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #cbd5e1;
    padding: 6px 14px;
    border-radius: 30px;
    font-size: 0.8rem;
    cursor: pointer;
    transition: all 0.25s ease;
}
.filter-chip:hover {
    background: rgba(56, 189, 248, 0.12);
    border-color: var(--ice-cyan);
    color: #fff;
}
.filter-chip.active {
    background: var(--ice-cyan);
    border-color: var(--ice-cyan);
    color: #04121e;
    font-weight: 800;
    box-shadow: 0 0 12px var(--ice-blue-glow);
}

/* --- ۳. Slide-in Reserve Mini-Cart --- */
/* ==========================================================================
   03. SLIDE-IN RESERVE MINI-CART
   --------------------------------------------------------------------------
   Premium White / Ice Blue Edition
   ========================================================================== */

.slidein-cart-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.22);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 9998;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.35s ease, visibility 0.35s ease;
}
.slidein-cart-overlay.active {
    opacity: 1;
    visibility: visible;
}
.slidein-mini-cart {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 420px;
    max-width: 90vw;
    background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(248,251,253,.97) 55%, rgba(241,248,252,.98) 100%);
    color: #0f172a;
    border-right: 1px solid rgba(14,165,233,.16);
    box-shadow: 20px 0 60px rgba(15,23,42,.14), 5px 0 25px rgba(14,165,233,.06);
    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);
    z-index: 9999;
    transform: translateX(-100%);
    transition: transform .4s cubic-bezier(.16,1,.3,1);
    display: flex;
    flex-direction: column;
    direction: rtl;
    overflow: hidden;
}
.slidein-mini-cart.active { transform: translateX(0); }
.slidein-mini-cart::before {
    content: "";
    position: absolute;
    top: -160px;
    left: -180px;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(56,189,248,.13) 0%, rgba(56,189,248,.05) 38%, transparent 72%);
    filter: blur(20px);
    pointer-events: none;
    z-index: -1;
}
.cart-drawer-header {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    border-bottom: 1px solid rgba(15,23,42,.07);
    background: rgba(255,255,255,.72);
    box-shadow: 0 1px 0 rgba(255,255,255,.9);
    flex-shrink: 0;
}
.cart-header-title { display:flex; align-items:center; gap:10px; }
.cart-header-title h3 {
    margin: 0;
    color: #0f172a;
    font-size: 1.15rem;
    font-weight: 850;
    line-height: 1.4;
}
.cart-count-badge {
    min-width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center;
    background:linear-gradient(135deg,#38bdf8,#0ea5e9); color:#fff; font-size:.72rem; font-weight:900;
    border-radius:999px; padding:2px 7px; box-shadow:0 4px 12px rgba(14,165,233,.22);
}
.cart-close-btn {
    width:36px; height:36px; display:flex; align-items:center; justify-content:center;
    background:rgba(241,245,249,.85); border:1px solid rgba(15,23,42,.08); border-radius:10px;
    color:#64748b; font-size:1.6rem; cursor:pointer; line-height:1; transition:all .2s ease;
}
.cart-close-btn:hover { background:rgba(239,68,68,.08); border-color:rgba(239,68,68,.18); color:#ef4444; transform:rotate(90deg); }
.reserve-timer-banner {
    position:relative;
    background:linear-gradient(90deg,rgba(239,68,68,.055),rgba(245,158,11,.08));
    border-bottom:1px solid rgba(239,68,68,.14);
    padding:11px 20px; display:flex; align-items:center; gap:10px; flex-shrink:0;
}
.timer-icon {
    width:32px; height:32px; display:flex; align-items:center; justify-content:center;
    background:rgba(245,158,11,.10); border:1px solid rgba(245,158,11,.16); border-radius:9px; flex-shrink:0;
}
.timer-info { display:flex; align-items:center; flex-wrap:wrap; gap:4px; color:#64748b; font-size:.72rem; line-height:1.5; }
.reserve-timer-banner strong { color:#dc2626; font-family:monospace; font-size:1.05rem; font-weight:900; margin-right:5px; }
.cart-drawer-body {
    flex:1; overflow-y:auto; padding:20px;
    background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(248,251,253,.55));
    scrollbar-width:thin; scrollbar-color:rgba(14,165,233,.25) transparent;
}
.cart-drawer-body::-webkit-scrollbar { width:5px; }
.cart-drawer-body::-webkit-scrollbar-track { background:transparent; }
.cart-drawer-body::-webkit-scrollbar-thumb { background:rgba(14,165,233,.25); border-radius:999px; }
.mini-cart-item {
    display:flex; gap:12px; align-items:center; background:rgba(255,255,255,.88);
    border:1px solid rgba(14,165,233,.10); padding:12px; border-radius:14px; margin-bottom:12px;
    position:relative; box-shadow:0 8px 24px rgba(15,23,42,.055), inset 0 1px 0 rgba(255,255,255,.95);
    transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.mini-cart-item:hover { transform:translateY(-1px); border-color:rgba(14,165,233,.20); box-shadow:0 12px 28px rgba(15,23,42,.08); }
.mini-cart-item .item-thumb img {
    width:60px; height:60px; object-fit:cover; border-radius:10px;
    border:1px solid rgba(15,23,42,.07); background:#f8fafc; box-shadow:0 4px 12px rgba(15,23,42,.07);
}
.item-details { min-width:0; flex:1; }
.item-details h5 { margin:0 0 4px; color:#0f172a; font-size:.9rem; font-weight:750; line-height:1.5; }
.item-stock-badge { font-size:.72rem; color:#0284c7; margin-bottom:4px; }
.item-price { font-weight:850; color:#059669; font-size:.92rem; }
.btn-remove-item {
    position:absolute; top:8px; left:8px; width:25px; height:25px; display:flex; align-items:center; justify-content:center;
    color:#94a3b8; font-size:1.15rem; text-decoration:none; border-radius:7px; transition:all .2s ease;
}
.btn-remove-item:hover { color:#ef4444; background:rgba(239,68,68,.07); }
.cart-drawer-footer {
    position:relative; padding:20px; border-top:1px solid rgba(15,23,42,.08); background:rgba(255,255,255,.94);
    box-shadow:0 -8px 25px rgba(15,23,42,.04); flex-shrink:0;
}
.cart-subtotal-row { display:flex; justify-content:space-between; align-items:center; font-size:.95rem; color:#475569; margin-bottom:15px; }
.cart-total-amount { font-weight:900; color:#0284c7; font-size:1.18rem; }
.cart-actions-column { display:flex; flex-direction:column; gap:10px; }
.btn-cart-checkout {
    display:flex; align-items:center; justify-content:center;
    background:linear-gradient(135deg,#38bdf8 0%,#0ea5e9 50%,#0284c7 100%);
    color:#fff; text-align:center; padding:14px; min-height:50px; border-radius:13px; font-weight:800; font-size:.86rem;
    text-decoration:none; border:1px solid rgba(2,132,199,.16);
    box-shadow:0 10px 25px rgba(14,165,233,.24), inset 0 1px 0 rgba(255,255,255,.35); transition:all .25s ease;
}
.btn-cart-checkout:hover { color:#fff; transform:translateY(-2px); box-shadow:0 14px 30px rgba(14,165,233,.30); }
.btn-cart-view {
    display:flex; align-items:center; justify-content:center; min-height:42px; color:#475569;
    background:rgba(248,250,252,.85); border:1px solid rgba(15,23,42,.08); border-radius:11px;
    font-size:.82rem; font-weight:650; text-decoration:none; transition:all .2s ease;
}
.btn-cart-view:hover { color:#0284c7; background:rgba(239,248,252,.95); border-color:rgba(14,165,233,.20); }
@media (max-width:768px) {
    .slidein-mini-cart { width:100vw; max-width:100vw; border-right:none; }
    .cart-drawer-header { padding:17px; }
    .cart-drawer-body { padding:15px; }
    .cart-drawer-footer { padding:16px; }
    .reserve-timer-banner { padding:10px 16px; }
    .timer-info { font-size:.68rem; }
}
