/* Amorce v2 — CSS complémentaire à Tailwind */ /* Reset body */ body { font-family: 'Inter', 'Roboto', sans-serif; color: #1A2332; background-color: #F8FAFB; } /* Scrollbar discrète */ ::-webkit-scrollbar { width: 6px; height: 6px; } ::-webkit-scrollbar-thumb { background: #B0BEC5; border-radius: 3px; } ::-webkit-scrollbar-track { background: transparent; } /* Cartes KPI */ .kpi-card { transition: transform 0.15s ease, box-shadow 0.15s ease; } .kpi-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); } /* Tables */ .q-table th { font-weight: 600; color: #1A2332; background: #F8FAFB; } /* Bouton login gradient */ .login-btn { background: linear-gradient(135deg, #2EB8A0 0%, #1A8FB5 100%) !important; box-shadow: 0 2px 8px rgba(46, 184, 160, 0.3); } /* ── Responsive : éléments visibles partout par défaut ── */ .mobile-nav-btn { display: none !important; } .mobile-spacer { display: none !important; } .desktop-nav { display: flex !important; } .desktop-nav-label { display: block !important; } /* ── Dialogues : scroll interne si contenu dépasse l'écran ── */ .q-dialog .q-card { max-height: 85vh !important; overflow-y: auto !important; overflow-x: hidden !important; } .q-dialog__inner--minimized { padding: 16px !important; } /* ── Couleurs Quasar pré-chargées (évite le flash bleu par défaut) ── */ /* body + !important : nécessaire pour primer sur les styles inline que Quasar JS pose sur à l'initialisation (bleu par défaut). */ body { --q-primary: #2EB8A0 !important; --q-secondary: #24A3AC !important; --q-accent: #1A8FB5 !important; --q-dark: #1A2332 !important; --q-positive: #2EB8A0 !important; --q-negative: #E53935 !important; --q-info: #1A8FB5 !important; --q-warning: #FB8C00 !important; } /* ── Responsive mobile (<768px) ── */ @media (max-width: 767px) { /* Afficher hamburger + spacer, masquer tabs desktop */ .mobile-nav-btn { display: inline-flex !important; } .mobile-spacer { display: flex !important; } .desktop-nav { display: none !important; } .desktop-nav-label { display: none !important; } /* Dialogues plein écran sur mobile */ .q-dialog__inner--minimized > div { max-width: 100vw !important; width: 100vw !important; max-height: 100vh !important; margin: 0 !important; border-radius: 0 !important; } /* Drawer notifications plein écran */ .q-drawer--right { width: 100vw !important; } /* Masquer complètement le volet notifications quand fermé sur mobile, évite le micro-flash lors du toggle du hamburger menu. */ .q-drawer--right.q-layout--prevent-focus { display: none !important; } /* Tables : scroll horizontal */ .q-table__container { overflow-x: auto !important; } /* Réduire le padding header */ .q-header .q-toolbar { padding-left: 8px !important; padding-right: 8px !important; } } /* ── Responsive tablette (768-1023px) ── */ @media (max-width: 1023px) and (min-width: 768px) { .q-dialog__inner--minimized > div { max-width: 90vw !important; } }