@import '../../../../vendor/filament/filament/resources/css/theme.css';

/* Le panneau /admin ne servait que la feuille de style précompilée de Filament :
   les classes Tailwind écrites dans nos propres gabarits (pages personnalisées,
   widgets, colonnes en HTML) n'étaient jamais compilées et se retrouvaient donc
   purgées — d'où les écrans « en HTML brut », sans marges ni encadrés.
   On balaie ici toutes les sources susceptibles de contenir des classes. */
@source '../../../../app/Filament/**/*.php';
@source '../../../../app/Support/**/*.php';
@source '../../../../app/Domaines/**/*.php';
@source '../../../../app/Livewire/**/*.php';
@source '../../../../resources/views/**/*.blade.php';
@source '../../../../vendor/filament/**/*.blade.php';
@source '../../../../vendor/filament/**/*.php';

@theme {
    --font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;
}

/* Densité de table : plus de dossiers visibles sans scroller, tout en gardant
   des zones cliquables confortables. */
.fi-ta-cell {
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
}

.fi-ta-header-cell {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

/* Le sigle de marque est injecté en SVG inline : il doit rester à la hauteur
   fixée par brandLogoHeight et s'agrandir sur l'écran de connexion. */
.fi-logo svg {
    height: 100%;
    width: auto;
}

/* Écran de connexion : logo agrandi mais dégagé du titre qui le suit. */
.fi-simple-layout-header .fi-logo svg,
.fi-simple-page .fi-logo svg {
    height: 3rem;
    margin: 0 auto 1.25rem;
}

/* Contrôle téléphone (v1.7.2) : l'écran ne défile jamais latéralement — ce
   qui déborde défile dans sa propre boîte (les tables savent déjà le faire)
   ou passe à la ligne. Le corps de page est cadenassé en dernier filet :
   sans lui, un seul mot trop long suffit à faire flotter tout l'écran. */
.fi-main {
    min-width: 0;
    max-width: 100%;
}

@media (max-width: 640px) {
    body {
        overflow-x: clip;
    }
}

/* Les cartes de statistiques portent des descriptions longues — soldes par
   associé, libellés d'échéance Forsa : elles se coupent au mot, jamais
   l'écran. */
.fi-wi-stats-overview-stat-description {
    overflow-wrap: anywhere;
}

/* Les graphiques restent dans leur carte, quelle que soit la largeur. */
.fi-wi-chart canvas {
    max-width: 100%;
}

/* L'éditeur de la messagerie respecte le sens d'écriture : un paragraphe
   commencé en arabe se lit de droite à gauche, sans rien changer aux blocs en
   français du même message. « plaintext » fait suivre à chaque bloc la langue
   de son premier caractère — c'est l'équivalent, à la saisie, du dir="auto"
   posé sur le message envoyé. */
.fi-fo-rich-editor [contenteditable] p,
.fi-fo-rich-editor [contenteditable] h2,
.fi-fo-rich-editor [contenteditable] h3,
.fi-fo-rich-editor [contenteditable] li,
.fi-fo-rich-editor [contenteditable] blockquote {
    unicode-bidi: plaintext;
}

/* v1.10.0 §A — la barre du haut du socle. Sous 640 px, « Saisie rapide » et
   « Opération complète » passent en icône seule (le libellé est masqué par
   font-size:0, l'icône garde sa taille) : la recherche et l'avatar restent
   accessibles sur iPhone. */
@media (max-width: 639px) {
    .socle-topbar-actions .fi-btn {
        font-size: 0;
        gap: 0;
        padding-inline: 0.55rem;
    }
}

/* v1.16.0 §A — la recherche des clients : ce qui a fait sortir un dossier
   (« Gérant ≈ Karim BENNANI »), violet quand c'est exact, ambre quand ce
   n'est qu'approché ; le mot trouvé surligné ; la correction au-dessus. */
.mobdie-pourquoi {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    padding: 2px 8px;
    border-radius: 7px;
    font-size: 12px;
    line-height: 1.35;
    font-weight: 700;
    background: #F3E9FD;
    color: #5E1FA6;
    white-space: normal;
}

.mobdie-pourquoi.approche {
    background: #FFF1DB;
    color: #7F4D00;
}

mark.mobdie-trouve {
    background: #FFE8A3;
    color: inherit;
    border-radius: 3px;
    padding: 0 1px;
}

.mobdie-correction {
    font-size: 12px;
    font-style: italic;
    color: #6B6577;
}

.dark .mobdie-pourquoi {
    background: rgba(147, 87, 230, 0.18);
    color: #D8B9FB;
}

.dark .mobdie-pourquoi.approche {
    background: rgba(255, 176, 32, 0.16);
    color: #FFD58A;
}

.dark mark.mobdie-trouve {
    background: rgba(255, 216, 99, 0.35);
}