/* SOS-NIGER-HOLDING - styles personnalisés */

body { font-family: 'Inter', system-ui, -apple-system, sans-serif; }

/* Line clamp utility */
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Scrollbar personnalisée */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* Animations */
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.animate-fadeIn { animation: fadeIn 0.4s ease-out; }

/* Transitions globales */
a, button { transition: all 0.2s ease; }

/* Focus accessibilité global */
*:focus-visible { outline: 2px solid #0ea5e9; outline-offset: 2px; }

/* ============================================================
   Navbar publique — liens desktop
   ============================================================ */
.snh-nav-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 0.85rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;            /* gray-700 */
    border-radius: 0.5rem;
    transition: color .2s ease, background-color .2s ease;
}
.dark .snh-nav-link { color: #d1d5db; }

/* Soulignement animé (hover + active) */
.snh-nav-link::after {
    content: '';
    position: absolute;
    left: 0.85rem;
    right: 0.85rem;
    bottom: 0.25rem;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, #0284c7, #06b6d4); /* primary-600 -> cyber-500 */
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .3s cubic-bezier(.4,0,.2,1);
}
.snh-nav-link:hover { color: #0284c7; }
.dark .snh-nav-link:hover { color: #22d3ee; }
.snh-nav-link:hover::after { transform: scaleX(0.6); }

/* État actif (page courante) */
.snh-nav-link--active {
    color: #0284c7 !important;
    background: linear-gradient(180deg, rgba(2,132,199,0.06), rgba(6,182,212,0.04));
}
.dark .snh-nav-link--active {
    color: #22d3ee !important;
    background: linear-gradient(180deg, rgba(34,211,238,0.10), rgba(34,211,238,0.04));
}
.snh-nav-link--active::after { transform: scaleX(1); }

/* Focus clavier — anneau visible et net */
.snh-nav-link:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #0ea5e9;
    border-radius: 0.5rem;
}
.dark .snh-nav-link:focus-visible {
    box-shadow: 0 0 0 2px #0f172a, 0 0 0 4px #22d3ee;
}

/* CTA "Investir" */
.snh-nav-cta {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #ffffff;
    background: linear-gradient(90deg, #0284c7, #06b6d4);
    border-radius: 0.5rem;
    box-shadow: 0 4px 12px -2px rgba(2,132,199,0.35);
    transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.snh-nav-cta:hover { transform: translateY(-1px); box-shadow: 0 6px 18px -2px rgba(2,132,199,0.5); opacity: 0.95; }
.snh-nav-cta:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #f97316; } /* accent-500 */

/* Boutons icône (thème, langue, menu mobile) */
.snh-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    border-radius: 0.5rem;
    color: #4b5563;            /* gray-600 */
    transition: background-color .2s ease, color .2s ease;
}
.dark .snh-icon-btn { color: #d1d5db; }
.snh-icon-btn:hover { background-color: #f3f4f6; color: #0284c7; }
.dark .snh-icon-btn:hover { background-color: #1f2937; color: #22d3ee; }
.snh-icon-btn:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #0ea5e9; }
.dark .snh-icon-btn:focus-visible { box-shadow: 0 0 0 2px #0f172a, 0 0 0 4px #22d3ee; }

/* ============================================================
   Navbar mobile — liste empilée
   ============================================================ */
.snh-nav-mobile {
    display: block;
    padding: 0.6rem 0.85rem;
    font-size: 0.9rem;
    font-weight: 500;
    color: #374151;
    border-radius: 0.5rem;
    border-left: 3px solid transparent;
    transition: background-color .2s, color .2s, border-color .2s;
}
.dark .snh-nav-mobile { color: #e5e7eb; }
.snh-nav-mobile:hover {
    background-color: #f9fafb;
    color: #0284c7;
}
.dark .snh-nav-mobile:hover { background-color: #1f2937; color: #22d3ee; }

.snh-nav-mobile--active {
    color: #0284c7 !important;
    background: linear-gradient(90deg, rgba(2,132,199,0.08), transparent);
    border-left-color: #f97316; /* accent-500 */
    font-weight: 600;
}
.dark .snh-nav-mobile--active {
    color: #22d3ee !important;
    background: linear-gradient(90deg, rgba(34,211,238,0.12), transparent);
    border-left-color: #f97316;
}

.snh-nav-mobile:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px #0ea5e9;
}
.dark .snh-nav-mobile:focus-visible {
    box-shadow: 0 0 0 2px #0f172a, 0 0 0 4px #22d3ee;
}

/* Brand (logo) focus */
.snh-nav-brand:focus-visible {
    outline: none;
    border-radius: 0.75rem;
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px #f97316;
}
.dark .snh-nav-brand:focus-visible {
    box-shadow: 0 0 0 2px #0f172a, 0 0 0 4px #f97316;
}

/* ============================================================
   Sidebar Admin — liens avec état actif + focus clavier
   ============================================================ */
.snh-admin-link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.55rem 0.85rem;
    border-radius: 0.5rem;
    color: #d1d5db;               /* gray-300 */
    font-size: 0.875rem;
    border-left: 3px solid transparent;
    transition: background-color .2s, color .2s, border-color .2s, transform .2s;
}
.snh-admin-link:hover {
    background-color: rgba(31, 41, 55, .85); /* gray-800 */
    color: #ffffff;
    transform: translateX(2px);
}
.snh-admin-link svg {
    flex-shrink: 0;
    color: #9ca3af;
    transition: color .2s, transform .2s;
}
.snh-admin-link:hover svg { color: #22d3ee; transform: scale(1.1); }

/* Lien actif — bordure accent orange + fond dégradé + texte blanc */
.snh-admin-link--active {
    color: #ffffff !important;
    background: linear-gradient(90deg, rgba(6,182,212,0.18) 0%, rgba(245,158,11,0.08) 60%, transparent 100%);
    border-left-color: #f59e0b;   /* accent-500 */
    font-weight: 600;
}
.snh-admin-link--active svg {
    color: #f59e0b !important;
}
.snh-admin-link--active::after {
    content: '';
    position: absolute;
    right: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 9999px;
    background: #f59e0b;
    box-shadow: 0 0 0 3px rgba(245,158,11,0.25);
}

/* Focus clavier — anneau bien visible sur fond sombre */
.snh-admin-link:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px #0f172a, 0 0 0 4px #22d3ee;
}

/* Brand focus dans sidebar */
.snh-admin-brand:focus-visible {
    outline: none;
    border-radius: 0.75rem;
    box-shadow: 0 0 0 2px #0f172a, 0 0 0 4px #f59e0b;
}