/* FAMED AI OS — Dashboard Styles */

/* Alpine.js cloak — hide elements until Alpine initializes */
[x-cloak] { display: none !important; }

/* Smooth scrollbar */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #C3D0D9; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #8FA6B5; }

/* Active pulse */
@keyframes pulse-dot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(0.85); }
}
.pulse-dot { animation: pulse-dot 2.5s ease-in-out infinite; }

/* Table row hover */
tbody tr { transition: background-color 0.1s ease; }

/* Smooth page transitions */
[x-show] { transition: opacity 0.15s ease; }

/* V5.22.1 — Mobile optimizations */
@media (max-width: 767px) {
    table th, table td {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }
    /* V5.65.3 — Anti débordement horizontal mobile.
       Les items flex/grid de Tailwind ont min-width:auto par défaut : un tableau
       large refusait de rétrécir et poussait toute la page (scroll latéral parasite,
       débordement ~49px à 375px). On autorise le rétrécissement pour que les tableaux
       défilent DANS leur carte (overflow-x-auto) au lieu de déborder la page.
       Les classes min-w-* explicites de Tailwind gardent priorité (classe > tag). */
    main { min-width: 0; }
    main * { min-width: 0; }
    /* Défilement tactile fluide pour les conteneurs de tableaux */
    .overflow-x-auto { -webkit-overflow-scrolling: touch; }
}

/* Barres d'onglets/filtres : masquer scrollbar horizontal */
.tab-scrollbar-hidden::-webkit-scrollbar { display: none; }
.tab-scrollbar-hidden { -ms-overflow-style: none; scrollbar-width: none; }

/* ====================================================== */
/* V5.60.10 — Refonte UX : coloré, vivant, moderne        */
/* ====================================================== */

/* KPI Cards — fond coloré avec gradient subtil */
.kpi-card {
    position: relative;
    overflow: hidden;
    border: none !important;
}
.kpi-card::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -30%;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    opacity: 0.08;
    pointer-events: none;
    transition: transform 0.4s ease, opacity 0.4s ease;
}
.kpi-card:hover::before {
    transform: scale(1.3);
    opacity: 0.14;
}

.kpi-emerald { background: linear-gradient(135deg, #EEFBF3 0%, #D5F5E3 100%); }
.kpi-emerald::before { background: #3D9B73; }

.kpi-amber { background: linear-gradient(135deg, #FFF8E1 0%, #FFECB3 100%); }
.kpi-amber::before { background: #F59E0B; }

.kpi-blue { background: linear-gradient(135deg, #EBF5FF 0%, #DBEAFE 100%); }
.kpi-blue::before { background: #3B82F6; }

.kpi-violet { background: linear-gradient(135deg, #F3E8FF 0%, #E9D5FF 100%); }
.kpi-violet::before { background: #8B5CF6; }

/* Status badges — pill style avec couleurs vives */
.status-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px;
    border-radius: 9999px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.status-pill:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}
.status-pill::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Couleurs par statut */
.status-nouveau { background: #F1F5F9; color: #475569; }
.status-nouveau::before { background: #94A3B8; }

.status-extraction { background: #F3E8FF; color: #7C3AED; }
.status-extraction::before { background: #8B5CF6; }

.status-sourcing { background: #DBEAFE; color: #2563EB; }
.status-sourcing::before { background: #3B82F6; }

.status-offre-prete { background: #CFFAFE; color: #0E7490; }
.status-offre-prete::before { background: #06B6D4; }

.status-offre-envoyee { background: #E0E7FF; color: #4338CA; }
.status-offre-envoyee::before { background: #6366F1; }

.status-po-recu { background: #FEF3C7; color: #B45309; }
.status-po-recu::before { background: #F59E0B; }

.status-commande { background: #E0E7FF; color: #3730A3; }
.status-commande::before { background: #4F46E5; }

.status-en-preparation { background: #FCE7F3; color: #BE185D; }
.status-en-preparation::before { background: #EC4899; }

.status-partiellement-expedie { background: #FEF9C3; color: #A16207; }
.status-partiellement-expedie::before { background: #EAB308; }

.status-expedie { background: #FFEDD5; color: #C2410C; }
.status-expedie::before { background: #F97316; }

.status-en-transit { background: #FFF7ED; color: #EA580C; }
.status-en-transit::before { background: #FB923C; }

.status-livre { background: #D1FAE5; color: #065F46; }
.status-livre::before { background: #10B981; }

.status-annule { background: #FEE2E2; color: #DC2626; }
.status-annule::before { background: #EF4444; }
.status-perdu { background: #E5E7EB; color: #374151; }   /* V5.226 */
.status-perdu::before { background: #6B7280; }

.status-archive { background: #F3F4F6; color: #6B7280; }
.status-archive::before { background: #9CA3AF; }

/* Tables — lignes alternées + hover vivant */
.table-modern tbody tr:nth-child(even) {
    background-color: rgba(241, 245, 249, 0.5);
}
.table-modern tbody tr:hover {
    background-color: rgba(219, 234, 254, 0.3) !important;
}
.table-modern thead th {
    background-color: #F8FAFC;
    border-bottom: 2px solid #E2E8F0;
}

/* Sidebar — compteur badge */
.nav-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9999px;
    font-size: 10px;
    font-weight: 700;
    background: rgba(255,255,255,0.12);
    color: rgba(255,255,255,0.7);
    margin-left: auto;
}

/* Section cards — ombre plus prononcée */
.card-elevated {
    box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.03);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.card-elevated:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 8px 24px rgba(0,0,0,0.05);
}

/* ====================================================== */
/* V5.60.11 — Pills pour toutes les vues                   */
/* ====================================================== */

/* Shipment status pills */
.status-ship-delivered { background: #D1FAE5; color: #065F46; }
.status-ship-delivered::before { background: #10B981; }

.status-ship-transit { background: #FFF7ED; color: #EA580C; }
.status-ship-transit::before { background: #FB923C; }

.status-ship-shipped { background: #FFEDD5; color: #C2410C; }
.status-ship-shipped::before { background: #F97316; }

.status-ship-default { background: #F1F5F9; color: #475569; }
.status-ship-default::before { background: #94A3B8; }

/* Product request status pills */
.status-req-en-attente { background: #F1F5F9; color: #475569; }
.status-req-en-attente::before { background: #94A3B8; }

.status-req-offre-envoyee { background: #E0F2FE; color: #0369A1; }
.status-req-offre-envoyee::before { background: #38BDF8; }

.status-req-devis-recu { background: #CFFAFE; color: #0E7490; }
.status-req-devis-recu::before { background: #06B6D4; }

.status-req-prix-trouve { background: #D1FAE5; color: #065F46; }
.status-req-prix-trouve::before { background: #10B981; }

.status-req-prix-estime { background: #FEF3C7; color: #B45309; }
.status-req-prix-estime::before { background: #F59E0B; }

.status-req-non-trouve { background: #FEE2E2; color: #DC2626; }
.status-req-non-trouve::before { background: #EF4444; }

.status-req-commande { background: #E0E7FF; color: #4338CA; }
.status-req-commande::before { background: #6366F1; }

.status-req-en-production { background: #F3E8FF; color: #7C3AED; }
.status-req-en-production::before { background: #8B5CF6; }

.status-req-expedie { background: #FFEDD5; color: #C2410C; }
.status-req-expedie::before { background: #F97316; }

.status-req-livre { background: #D1FAE5; color: #065F46; }
.status-req-livre::before { background: #10B981; }

/* Email type pills */
.status-email-rfq { background: #DBEAFE; color: #2563EB; }
.status-email-rfq::before { background: #3B82F6; }

.status-email-po { background: #FEF3C7; color: #B45309; }
.status-email-po::before { background: #F59E0B; }

.status-email-quote-supplier { background: #CFFAFE; color: #0E7490; }
.status-email-quote-supplier::before { background: #06B6D4; }

.status-email-order-confirm { background: #E0E7FF; color: #4338CA; }
.status-email-order-confirm::before { background: #6366F1; }

.status-email-tracking { background: #FFEDD5; color: #C2410C; }
.status-email-tracking::before { background: #F97316; }

.status-email-shipping-doc { background: #FFEDD5; color: #C2410C; }
.status-email-shipping-doc::before { background: #F97316; }

.status-email-invoice { background: #F3E8FF; color: #7C3AED; }
.status-email-invoice::before { background: #8B5CF6; }

.status-email-payment { background: #D1FAE5; color: #065F46; }
.status-email-payment::before { background: #10B981; }

.status-email-general { background: #F1F5F9; color: #475569; }
.status-email-general::before { background: #94A3B8; }

/* Activity type pills */
.status-act-approval { background: #D1FAE5; color: #065F46; }
.status-act-approval::before { background: #10B981; }

.status-act-quote { background: #DBEAFE; color: #2563EB; }
.status-act-quote::before { background: #3B82F6; }

.status-act-price-edit { background: #FEF3C7; color: #B45309; }
.status-act-price-edit::before { background: #F59E0B; }

.status-act-mark-sent { background: #E0E7FF; color: #4338CA; }
.status-act-mark-sent::before { background: #6366F1; }

.status-act-status-change { background: #F3F4F6; color: #6B7280; }
.status-act-status-change::before { background: #9CA3AF; }

.status-act-pipeline { background: #F3E8FF; color: #7C3AED; }
.status-act-pipeline::before { background: #8B5CF6; }

.status-act-revalidation { background: #FFEDD5; color: #C2410C; }
.status-act-revalidation::before { background: #F97316; }

.status-act-discount { background: #FEF3C7; color: #92400E; }
.status-act-discount::before { background: #D97706; }