@import url('../css pages/global.css');

/* ═══════════════════════════════════════════════════
   VARIABLES & BASE
═══════════════════════════════════════════════════ */

body {
    font-family: 'Plus Jakarta Sans', sans-serif;
    background-color: var(--bg-main);
    color: var(--text-primary);
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* ═══════════════════════════════════════════════════
   DARK MODE - TEXTES
═══════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════
   DARK MODE - BACKGROUNDS
═══════════════════════════════════════════════════ */
body.dark-theme               { background-color: #0f172a !important; }

/* ═══════════════════════════════════════════════════
   DARK MODE - BORDERS
═══════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════
   DARK MODE - SPÉCIFIQUES
═══════════════════════════════════════════════════ */
body.dark-theme .glass-card {
    background-color: var(--glass-bg) !important;
    border-color: var(--glass-border) !important;
}

body.dark-theme .sitemap-card:hover { background-color: #27364b !important; }

body.dark-theme input {
    background-color: #1e293b !important;
    color: #f1f5f9 !important;
    border-color: #334155 !important;
}
body.dark-theme input::placeholder { color: #64748b !important; }
body.dark-theme input:focus        { border-color: #4f46e5 !important; }

body.dark-theme .link-card       { background: rgba(30,41,59,0.5); }
body.dark-theme .link-card:hover { background: #27364b; }

/* ═══════════════════════════════════════════════════
   STYLES GÉNÉRAUX
═══════════════════════════════════════════════════ */
.glass-card {
    background: var(--glass-bg);
    backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border);
    transition: all 0.3s ease;
}

.sitemap-card {
    transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.sitemap-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 25px -5px rgb(79 70 229 / 0.12);
}

.search-container:focus-within { transform: scale(1.01); }

@keyframes float {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50%       { transform: translateY(-20px) rotate(5deg); }
}

.bg-grain {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
    opacity: 0.02;
}

.blob-1 { background: var(--blob-1); transition: background 0.3s ease; }
.blob-2 { background: var(--blob-2); transition: background 0.3s ease; }

/* ═══════════════════════════════════════════════════
   SECTION TITLES
═══════════════════════════════════════════════════ */
.section-title {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 8px;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: #94a3b8;
    margin-bottom: 16px;
}

/* ═══════════════════════════════════════════════════
   LINK CARDS
═══════════════════════════════════════════════════ */
.link-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid transparent;
    background: rgba(255,255,255,0.5);
    transition: all 0.35s cubic-bezier(0.23, 1, 0.32, 1);
    text-decoration: none;
}

.link-card:hover {
    background: white;
    transform: translateY(-3px);
    box-shadow: 0 12px 20px -5px rgb(79 70 229 / 0.1);
}

.link-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.3s ease;
}

.link-card:hover .link-icon { transform: scale(1.1); }

/* ═══════════════════════════════════════════════════
   DARK PANEL LINKS
═══════════════════════════════════════════════════ */
.dark-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    color: #94a3b8;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.2s;
}

.dark-link:last-child { border-bottom: none; }
.dark-link:hover      { color: #a5b4fc; }

.dark-link i.arrow {
    font-size: 9px;
    opacity: 0;
    transform: translateX(-6px);
    transition: all 0.2s;
}
.dark-link:hover i.arrow { opacity: 1; transform: translateX(0); }

/* ═══════════════════════════════════════════════════
   NO RESULTS
═══════════════════════════════════════════════════ */
#no-results { display: none; }