/* ============================================================
   Dear Anne-C — Dark Elegant Theme
   Bootstrap 5.3 Override + Custom Variables
   ============================================================ */

:root {
    --color-bg-primary:     #0d0d0d;
    --color-bg-secondary:   #141414;
    --color-bg-card:        #1a1a1a;
    --color-bg-overlay:     rgba(0,0,0,.75);
    --color-accent:         #c4829a;
    --color-accent-hover:   #d4a0b5;
    --color-accent-muted:   rgba(196,130,154,.15);
    --color-text-primary:   #f0e8e8;
    --color-text-secondary: #a89898;
    --color-text-muted:     #6c6060;
    --color-border:         rgba(196,130,154,.2);
    --color-border-hover:   rgba(196,130,154,.5);
    --font-heading:         'Playfair Display', Georgia, serif;
    --font-body:            'Inter', system-ui, sans-serif;
    --card-radius:          12px;
    --transition:           .3s ease;
}

[data-bs-theme="dark"] {
    --bs-body-bg:        var(--color-bg-primary);
    --bs-body-color:     var(--color-text-primary);
    --bs-border-color:   var(--color-border);
    --bs-card-bg:        var(--color-bg-card);
    --bs-dropdown-bg:    var(--color-bg-secondary);
    --bs-modal-bg:       var(--color-bg-secondary);
    --bs-input-bg:       #1e1e1e;
    --bs-input-border-color: var(--color-border);
    --bs-input-focus-border-color: var(--color-accent);
}

/* ── Base ──────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--font-body); background:var(--color-bg-primary); color:var(--color-text-primary); line-height:1.6; padding-top:70px; }
h1,h2,h3,h4,h5 { font-family:var(--font-heading); }
a { color:var(--color-accent); text-decoration:none; transition:color var(--transition); }
a:hover { color:var(--color-accent-hover); }
img { max-width:100%; }

/* ── Navbar ───────────────────────────────────────────────── */
.da-navbar {
    background:rgba(13,13,13,.95);
    backdrop-filter:blur(12px);
    border-bottom:1px solid var(--color-border);
    transition:all var(--transition);
}
.da-brand {
    font-family:var(--font-heading);
    font-size:1.4rem;
    color:var(--color-accent)!important;
    letter-spacing:.5px;
}
.da-navbar .nav-link {
    color:var(--color-text-secondary)!important;
    font-size:.9rem;
    padding:.4rem .7rem;
    border-radius:6px;
    transition:all var(--transition);
}
.da-navbar .nav-link:hover { color:var(--color-accent)!important; background:var(--color-accent-muted); }
.cart-badge {
    top:-4px; right:-6px;
    background:var(--color-accent);
    color:#fff;
    border-radius:50%;
    width:18px; height:18px;
    font-size:.65rem;
    display:flex; align-items:center; justify-content:center;
}

/* ── Buttons ──────────────────────────────────────────────── */
.btn-accent {
    background:var(--color-accent);
    color:#fff;
    border:none;
    border-radius:8px;
    font-weight:500;
    transition:all var(--transition);
}
.btn-accent:hover { background:var(--color-accent-hover); color:#fff; transform:translateY(-1px); box-shadow:0 4px 16px rgba(196,130,154,.3); }
.btn-outline-accent {
    border:1px solid var(--color-accent);
    color:var(--color-accent);
    border-radius:8px;
    font-weight:500;
    transition:all var(--transition);
}
.btn-outline-accent:hover { background:var(--color-accent); color:#fff; }
.text-accent { color:var(--color-accent)!important; }

/* ── Cards ────────────────────────────────────────────────── */
.da-card {
    background:var(--color-bg-card);
    border:1px solid var(--color-border);
    border-radius:var(--card-radius);
    transition:border-color var(--transition), box-shadow var(--transition);
}
.da-card:hover { border-color:var(--color-border-hover); }

/* ── Forms ────────────────────────────────────────────────── */
.form-control, .form-select {
    background:#1e1e1e;
    border-color:var(--color-border);
    color:var(--color-text-primary);
    border-radius:8px;
}
.form-control:focus, .form-select:focus {
    background:#1e1e1e;
    border-color:var(--color-accent);
    color:var(--color-text-primary);
    box-shadow:0 0 0 .2rem rgba(196,130,154,.25);
}
.form-control::placeholder { color:var(--color-text-muted); }
.form-label { color:var(--color-text-secondary); font-size:.9rem; }
.invalid-feedback { font-size:.82rem; }

/* ── Hero ─────────────────────────────────────────────────── */
.hero-section {
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    background:linear-gradient(135deg, #0d0d0d 0%, #1a0a10 50%, #0d0d0d 100%);
    margin-top:-70px;
}
.hero-section::before {
    content:'';
    position:absolute; inset:0;
    background:radial-gradient(ellipse at 60% 40%, rgba(196,130,154,.12) 0%, transparent 70%);
    pointer-events:none;
}
.hero-overlay { position:absolute; inset:0; background:var(--color-bg-overlay); }
.hero-section.has-hero-img .hero-overlay { background:rgba(0,0,0,.45); }
.hero-content { position:relative; z-index:1; padding:2rem; }
.hero-tag {
    display:inline-block;
    font-size:.8rem;
    letter-spacing:3px;
    text-transform:uppercase;
    color:var(--color-accent);
    border:1px solid var(--color-border);
    padding:.3rem 1rem;
    border-radius:20px;
}
.hero-title { font-size:clamp(2.5rem,6vw,5rem); font-weight:700; color:#fff; margin-bottom:1rem; }
.hero-subtitle { font-size:1.1rem; color:var(--color-text-secondary); max-width:540px; margin:0 auto; }
.hero-scroll-indicator {
    position:absolute; bottom:2rem; left:50%;
    transform:translateX(-50%);
    color:var(--color-text-muted);
    animation:bounce 2s infinite;
}
@keyframes bounce { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(8px)} }

/* ── Features ─────────────────────────────────────────────── */
.features-section { background:var(--color-bg-secondary); }
.feature-card {
    padding:2rem 1.5rem;
    background:var(--color-bg-card);
    border:1px solid var(--color-border);
    border-radius:var(--card-radius);
    transition:all var(--transition);
    height:100%;
}
.feature-card:hover { transform:translateY(-4px); border-color:var(--color-border-hover); box-shadow:0 8px 32px rgba(196,130,154,.1); }
.feature-icon { font-size:2.5rem; color:var(--color-accent); margin-bottom:1rem; }

/* ── CTA ──────────────────────────────────────────────────── */
.cta-card {
    background:linear-gradient(135deg, rgba(196,130,154,.1) 0%, transparent 100%);
    border:1px solid var(--color-border);
    border-radius:16px;
}

/* ── Page Hero ────────────────────────────────────────────── */
.page-hero { background:var(--color-bg-secondary); border-bottom:1px solid var(--color-border); }
.page-title { font-family:var(--font-heading); font-size:2.5rem; }

/* ── Gallery ──────────────────────────────────────────────── */
.album-card { cursor:pointer; overflow:hidden; background:var(--color-bg-card); border:1px solid var(--color-border); border-radius:var(--card-radius); transition:all var(--transition); }
.album-card:hover { transform:translateY(-4px); border-color:var(--color-border-hover); box-shadow:0 8px 24px rgba(0,0,0,.4); }
.album-thumb { width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .4s ease; }
.album-card:hover .album-thumb { transform:scale(1.05); }
.album-overlay { position:absolute; inset:0; background:rgba(0,0,0,0); transition:background var(--transition); display:flex; align-items:center; justify-content:center; }
.album-card:hover .album-overlay { background:rgba(0,0,0,.4); }
.album-overlay-icon { opacity:0; transition:opacity var(--transition); font-size:2rem; color:#fff; }
.album-card:hover .album-overlay-icon { opacity:1; }

/* ── Lightbox ─────────────────────────────────────────────── */
#lightbox {
    position:fixed; inset:0; z-index:9999;
    background:rgba(0,0,0,.95);
    display:flex; align-items:center; justify-content:center;
}
#lightbox img { max-width:90vw; max-height:90vh; object-fit:contain; border-radius:4px; }
.lb-close { position:absolute; top:1rem; right:1rem; font-size:2rem; color:#fff; cursor:pointer; background:none; border:none; opacity:.8; }
.lb-close:hover { opacity:1; }
.lb-nav { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.1); border:none; color:#fff; font-size:1.5rem; width:48px; height:48px; border-radius:50%; cursor:pointer; transition:background var(--transition); }
.lb-nav:hover { background:rgba(196,130,154,.4); }
.lb-prev { left:1rem; }
.lb-next { right:1rem; }

/* ── Video Cards ──────────────────────────────────────────── */
.video-card { overflow:hidden; background:var(--color-bg-card); border:1px solid var(--color-border); border-radius:var(--card-radius); cursor:pointer; transition:all var(--transition); }
.video-card:hover { transform:translateY(-4px); border-color:var(--color-border-hover); }
.video-thumb-wrap { position:relative; aspect-ratio:16/9; overflow:hidden; }
.video-thumb { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.video-card:hover .video-thumb { transform:scale(1.05); }
.video-duration { position:absolute; bottom:.5rem; right:.5rem; background:rgba(0,0,0,.8); color:#fff; font-size:.75rem; padding:.15rem .4rem; border-radius:4px; }
.video-play-overlay { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,0); transition:background var(--transition); }
.video-card:hover .video-play-overlay { background:rgba(0,0,0,.4); }
.video-play-icon { font-size:3rem; color:#fff; opacity:0; transition:opacity var(--transition); }
.video-card:hover .video-play-icon { opacity:1; }

/* ── Shop Cards ───────────────────────────────────────────── */
.product-card { background:var(--color-bg-card); border:1px solid var(--color-border); border-radius:var(--card-radius); overflow:hidden; transition:all var(--transition); }
.product-card:hover { transform:translateY(-4px); border-color:var(--color-border-hover); box-shadow:0 8px 24px rgba(0,0,0,.3); }
.product-img { width:100%; aspect-ratio:1; object-fit:cover; }
.product-price { font-family:var(--font-heading); font-size:1.3rem; color:var(--color-accent); }

/* ── Auth ─────────────────────────────────────────────────── */
.auth-page { background:radial-gradient(ellipse at center, #1a0a10 0%, var(--color-bg-primary) 70%); }
.auth-card { width:100%; max-width:460px; background:var(--color-bg-card); border:1px solid var(--color-border); border-radius:16px; padding:2.5rem; }
.auth-logo { font-family:var(--font-heading); font-size:1.8rem; color:var(--color-accent)!important; }
.logo-text { color:var(--color-accent); }

/* ── Dashboard ────────────────────────────────────────────── */
.dashboard-wrap { padding-top:2rem; }

/* ── Age Gate ─────────────────────────────────────────────── */
.age-gate-content { background:radial-gradient(ellipse at center, #1a0a10 0%, #0d0d0d 100%); border:none; }
.age-gate-inner { max-width:500px; margin:auto; padding:3rem 2rem; }
.age-gate-divider { width:60px; height:3px; background:var(--color-accent); margin:.5rem auto; border-radius:2px; }

/* ── Footer ───────────────────────────────────────────────── */
.da-footer { background:var(--color-bg-secondary); border-top:1px solid var(--color-border); }
.footer-title { font-size:.8rem; text-transform:uppercase; letter-spacing:2px; color:var(--color-text-muted); margin-bottom:1rem; }
.footer-links li { margin-bottom:.4rem; }
.footer-links a { color:var(--color-text-secondary); font-size:.9rem; transition:color var(--transition); }
.footer-links a:hover { color:var(--color-accent); }
.footer-social { font-size:1.3rem; color:var(--color-text-muted); transition:color var(--transition); }
.footer-social:hover { color:var(--color-accent); }

/* ── Toasts ───────────────────────────────────────────────── */
.toast { background:var(--color-bg-card); border:1px solid var(--color-border); color:var(--color-text-primary); }
.toast.toast-success { border-color:rgba(40,167,69,.5); }
.toast.toast-error   { border-color:rgba(220,53,69,.5); }

/* ── Table (admin, panier) ────────────────────────────────── */
.table { --bs-table-bg:transparent; --bs-table-border-color:var(--color-border); --bs-table-color:var(--color-text-primary); }
.table-hover > tbody > tr:hover { --bs-table-accent-bg:var(--color-accent-muted); }

/* ── Spinner text-accent ──────────────────────────────────── */
.text-accent.spinner-border, .spinner-border.text-accent { --bs-spinner-color:var(--color-accent); }

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width:768px) {
    body { padding-top:60px; }
    .hero-title { font-size:2.2rem; }
    .auth-card { padding:1.5rem; border-radius:12px; }
}