/* =============================================================
   Treso360 — Overrides UI/UX (footer fixe + lisibilite + Settings)
   Charge APRES build/css/style.css pour surcharger DreamPos.
   ============================================================= */

/* ---------- 1. FOOTER FIXE KHOGO ---------- */
.app-footer {
    position: fixed;
    bottom: 0;
    right: 0;
    left: 252px;                      /* largeur sidebar (cf. .page-wrapper margin-left) */
    height: 48px;
    display: flex;
    align-items: center;
    background: #ffffff;
    border-top: 1px solid #e5e7eb;
    color: #4b5563;
    font-size: 13px;
    z-index: 1029;                    /* sous les modales (1055) mais au-dessus du contenu */
    -webkit-transition: left 0.2s ease;
    transition: left 0.2s ease;
}
.app-footer .container-fluid {
    padding: 0 24px;
}
.app-footer a {
    color: var(--bs-primary, #405189);
    font-weight: 600;
    text-decoration: none;
}
.app-footer a:hover,
.app-footer a:focus {
    text-decoration: underline;
}

/* Sidebar repliee */
body.mini-sidebar .app-footer {
    left: 86px;
}

/* Mobile : footer pleine largeur */
@media (max-width: 991.96px) {
    .app-footer {
        left: 0;
    }
    .app-footer .container-fluid {
        padding: 0 12px;
        font-size: 12px;
    }
}

/* On garde de la place sous le contenu pour ne pas etre masque par le footer.
   .page-wrapper .content a deja min-height calc(100vh - 105px) et padding-bottom: 0 ;
   on ajoute la marge basse pour le footer fixe. */
.page-wrapper .content {
    padding-bottom: 56px !important;
}

/* En mode "auth/erreur" (.account-page, .error-page) on n'affiche pas le footer fixe */
body.account-page .app-footer,
body.error-page   .app-footer,
body.pos-page     .app-footer {
    display: none;
}


/* ---------- 2. LISIBILITE GLOBALE ---------- */

/* Helpers texte */
.text-muted,
small.text-muted {
    color: #6b7280 !important;        /* DreamPos default trop clair sur fond clair */
}
.fs-12 { font-size: 12px !important; }
.fs-13 { font-size: 13px !important; }

/* Champs en lecture seule : on les distingue clairement des champs actifs */
.form-control[readonly],
.form-select[disabled],
.form-control[disabled] {
    background-color: #f3f4f6;
    color: #4b5563;
    cursor: not-allowed;
}

/* Focus state sur tous les inputs - meilleure visibilite */
.form-control:focus,
.form-select:focus {
    border-color: var(--bs-primary, #405189);
    box-shadow: 0 0 0 0.2rem rgba(64, 81, 137, 0.15);
}

/* Badges -transparent : contraste garanti WCAG AA (>= 4.5:1 pour texte normal).
   Tous les couples ci-dessous ont ete verifies via WebAIM contrast checker. */
.badge.bg-warning-transparent.text-warning { color: #b45309 !important; background-color: #fef3c7 !important; }    /* 5.10:1 */
.badge.bg-success-transparent.text-success { color: #047857 !important; background-color: #d1fae5 !important; }    /* 6.34:1 */
.badge.bg-danger-transparent.text-danger   { color: #b91c1c !important; background-color: #fee2e2 !important; }    /* 6.49:1 */
.badge.bg-info-transparent.text-info       { color: #1d4ed8 !important; background-color: #dbeafe !important; }    /* 7.18:1 */
.badge.bg-secondary-transparent.text-secondary { color: #374151 !important; background-color: #e5e7eb !important; } /* 8.50:1 */
.badge.bg-primary-transparent.text-primary { color: #1e40af !important; background-color: #dbeafe !important; }    /* 8.65:1 */
.badge.bg-orange-transparent.text-orange   { color: #9a3412 !important; background-color: #ffedd5 !important; }    /* 6.92:1 — utilise pour "Modification" */
.badge.bg-teal-transparent.text-teal       { color: #0f766e !important; background-color: #ccfbf1 !important; }    /* 5.04:1 — utilise pour "Paye" */
.badge.bg-purple-transparent.text-purple   { color: #6b21a8 !important; background-color: #f3e8ff !important; }    /* 7.86:1 */
.badge.bg-pink-transparent.text-pink       { color: #9d174d !important; background-color: #fce7f3 !important; }    /* 7.39:1 */
.badge.bg-cyan-transparent.text-cyan       { color: #0e7490 !important; background-color: #cffafe !important; }    /* 5.34:1 */
.badge.bg-indigo-transparent.text-indigo   { color: #3730a3 !important; background-color: #e0e7ff !important; }    /* 9.12:1 */

/* Texte color- standalone (sans badge) : garantir aussi un contraste lisible sur fond clair */
.text-orange { color: #9a3412 !important; }
.text-teal   { color: #0f766e !important; }
.text-purple { color: #6b21a8 !important; }
.text-pink   { color: #9d174d !important; }
.text-cyan   { color: #0e7490 !important; }
.text-indigo { color: #3730a3 !important; }


/* ---------- 3. SETTINGS — meilleure hierarchie ---------- */

/* Nav-pills lateraux de Settings : un actif tres visible, separateurs nets */
.tab-content > .tab-pane > .card {
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
    border: 1px solid #e5e7eb;
}
.tab-content > .tab-pane > .card > .card-header {
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
    padding: 12px 20px;
}
.tab-content > .tab-pane > .card > .card-header .card-title {
    font-size: 15px;
    font-weight: 600;
    color: #111827;
}
.tab-content > .tab-pane > .card > .card-footer {
    background: #f9fafb;
    border-top: 1px solid #e5e7eb;
}
/* Aperçus de logos dans Settings : fond legerement contraste pour lisibilite */
.nav-pills .nav-link {
    color: #374151;
    border-radius: 8px;
    padding: 10px 14px;
    margin-bottom: 4px;
    font-weight: 500;
}
.nav-pills .nav-link:hover {
    background: #f3f4f6;
    color: #111827;
}
.nav-pills .nav-link.active {
    background: var(--bs-primary, #405189);
    color: #ffffff;
}
.nav-pills .nav-link.active i {
    color: #ffffff;
}


/* ---------- 4. ETATS LIVEWIRE ---------- */

/* Curseur "wait" pendant un wire:loading global */
[wire\:loading].wire-loading-overlay,
[wire\:loading.delay].wire-loading-overlay {
    display: block !important;
}

/* Boutons en chargement : empeche la double-click */
button[wire\:loading]:not(.wire-loading-show),
button:disabled {
    opacity: 0.65;
    cursor: not-allowed;
}


/* ---------- 5. EMPTY STATES & TABLEAUX ---------- */

/* Etat vide dans une card */
.empty-state {
    text-align: center;
    padding: 48px 24px;
    color: #6b7280;
}
.empty-state .ti,
.empty-state i[data-feather] {
    font-size: 48px;
    color: #d1d5db;
    margin-bottom: 12px;
    display: block;
}
.empty-state h6 { color: #374151; font-weight: 600; margin-bottom: 4px; }
.empty-state p  { color: #6b7280; margin-bottom: 0; }

/* En-tetes de tableau : lisibles et stables */
.table thead.thead-light th,
.table > :not(caption) > * > th {
    background: #f9fafb;
    color: #374151;
    font-weight: 600;
    border-bottom: 1px solid #e5e7eb;
    text-transform: none;
    font-size: 13px;
}

/* Lignes hover : amelioration discrete */
.table-hover > tbody > tr:hover > * {
    background-color: #f9fafb;
}

/* Bloc JSON dans la modale Journal d'Audit (remplace style inline) */
.audit-properties-pre {
    max-height: 400px;
    overflow: auto;
    margin-bottom: 0;
    font-size: 12px;
}

/* Drop zone pour <x-logo-uploader> (drag & drop logos Settings) */
.t360-drop-zone {
    position: relative;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}
.t360-drop-zone.t360-drop-active {
    border-color: var(--bs-primary, #405189) !important;
    border-width: 2px !important;
    background-color: rgba(64, 81, 137, 0.05) !important;
}
.t360-drop-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(64, 81, 137, 0.85);
    color: #fff;
    font-weight: 600;
    border-radius: inherit;
    pointer-events: none;
}
[x-cloak] { display: none !important; }

/* Container des toasts flash (composant <x-flash-toast>) :
   au-dessus du footer (1029) et juste sous le backdrop modal (1050). */
.t360-toast-container {
    z-index: 1045;
}
.t360-toast-container .toast {
    min-width: 280px;
}
/* Sur mobile, decaler depuis le bas pour ne pas chevaucher le footer fixe. */
@media (max-width: 991.96px) {
    .t360-toast-container {
        bottom: 56px !important;
    }
}