/* ============================================================
   BACK-OFFICE MINIMAL - couche de normalisation DA
   Chargée sur tout le back-office (admin /app + espace client).
   Objectif : sobre, compact, user-friendly. Les pages ont des
   styles inline historiques surdimensionnés : les métriques
   (tailles, paddings) sont donc forcées en !important, comme
   le fait premium-theme.css côté boutique.
   ============================================================ */

/* ---------- 1. Titres : fini les 2.5rem pleine page ---------- */
.main-content h1,
.page-header h1,
.dashboard-header h1,
.order-number {
    font-size: 1.35rem !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    line-height: 1.3 !important;
}

.main-content h2 {
    font-size: 1.1rem !important;
    font-weight: 700 !important;
}

.main-content h3 {
    font-size: 1rem !important;
    font-weight: 700 !important;
}

/* Icônes dans les titres : alignées sur le texte, pas surdimensionnées */
.main-content h1 i,
.page-header h1 i,
.order-number i {
    font-size: 1.1rem !important;
}

.page-header {
    margin-bottom: 1.25rem !important;
}

/* ---------- 2. Boutons : compacts, coins discrets ---------- */
.main-content .btn,
.main-content button[type="submit"],
.main-content .btn-view,
.main-content .btn-primary,
.main-content .btn-secondary,
.main-content .btn-success,
.main-content .btn-danger,
.modal-card .btn,
.modal-content button[type="submit"] {
    padding: 0.45rem 0.9rem !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}

.main-content .btn:hover,
.main-content button[type="submit"]:hover {
    transform: none !important;
    box-shadow: none !important;
}

.main-content .btn i,
.main-content button[type="submit"] i {
    font-size: 0.8rem !important;
}

/* Petits boutons (menus actions, icônes) restent petits */
.main-content .btn-sm {
    padding: 0.3rem 0.65rem !important;
    font-size: 0.78rem !important;
}

/* ---------- 3. Cartes & sections : paddings raisonnables ---------- */
.main-content .card {
    border-radius: 8px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06) !important;
}

.main-content .card-header,
.main-content .filters-bar {
    padding: 0.9rem 1.1rem !important;
}

/* ---------- 4. KPI compacts ---------- */
.main-content .stat-card {
    padding: 0.9rem 1rem !important;
}

.main-content .stat-icon {
    width: 38px !important;
    height: 38px !important;
    font-size: 1.1rem !important;
    border-radius: 8px !important;
}

.main-content .stat-content p,
.main-content .stat-value {
    font-size: 1.2rem !important;
}

.main-content .stat-content h4,
.main-content .stat-label {
    font-size: 0.78rem !important;
}

.main-content .stats-grid {
    gap: 0.75rem !important;
    margin-bottom: 1.25rem !important;
}

/* ---------- 5. Tableaux : denses et lisibles ---------- */
.main-content table th {
    padding: 0.6rem 0.75rem !important;
    font-size: 0.78rem !important;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.main-content table td {
    padding: 0.6rem 0.75rem !important;
    font-size: 0.88rem !important;
}

/* ---------- 6. Badges sobres ---------- */
.main-content .status-badge,
.main-content .payment-badge,
.main-content .reminder-badge,
.main-content .type-badge,
.main-content .role-badge,
.main-content .level-badge {
    padding: 0.2rem 0.55rem !important;
    font-size: 0.74rem !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    border-radius: 4px !important;
}

/* ---------- 7. Formulaires compacts ---------- */
.main-content .form-group label {
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    margin-bottom: 0.3rem !important;
}

.main-content input[type="text"],
.main-content input[type="email"],
.main-content input[type="number"],
.main-content input[type="password"],
.main-content input[type="tel"],
.main-content input[type="url"],
.main-content input[type="date"],
.main-content select,
.main-content textarea,
.main-content .filter-select,
.main-content .search-input {
    padding: 0.5rem 0.75rem !important;
    font-size: 0.9rem !important;
    border-radius: 6px !important;
}

/* ---------- 8. Breadcrumb discret ---------- */
.breadcrumb-container {
    padding: 0.45rem 0.75rem !important;
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}

.breadcrumb {
    font-size: 0.82rem !important;
}

/* ---------- 9. Modals ---------- */
.modal-card h3,
.modal-content .modal-title {
    font-size: 1.05rem !important;
}

/* ---------- 10. Moins de vide au-dessus du contenu ---------- */
.dashboard-container .main-content {
    padding-top: 0.75rem !important;
}

/* ---------- 11. Garantie de contraste des boutons (anti « blanc sur blanc ») ----------
   Tailwind (chargé en CDN) applique un preflight « [type='submit'],[type='button'],
   button { background-color: transparent } ». À spécificité égale mais injecté APRÈS,
   il écrase le fond des boutons de formulaire (ex. <button type="submit" class="btn
   btn-primary">) → fond transparent + texte blanc = illisible. On (re)pose donc fond
   ET texte de chaque variante en !important. Scopé au back-office (.main-content). */
.main-content .btn-primary,
.main-content button.btn-primary {
    background: var(--red, #5c924e) !important;
    color: #ffffff !important;
}

.main-content .btn-success,
.main-content button.btn-success {
    background: var(--success, #22c55e) !important;
    color: #ffffff !important;
}

.main-content .btn-danger,
.main-content button.btn-danger {
    background: var(--danger, #ef4444) !important;
    color: #ffffff !important;
}

.main-content .btn-warning,
.main-content button.btn-warning {
    background: var(--warning, #5c924e) !important;
    color: #ffffff !important;
}

/* Boutons « clairs » : fond blanc => texte foncé garanti (jamais blanc) */
.main-content .btn-secondary,
.main-content button.btn-secondary,
.main-content .btn-light,
.main-content .btn-outline {
    background: #ffffff !important;
    color: #2c2b2f !important;
    border: 1px solid #d7d7d3 !important;
}

.main-content .btn-secondary:hover,
.main-content button.btn-secondary:hover,
.main-content .btn-light:hover,
.main-content .btn-outline:hover {
    background: #f4f4f3 !important;
    color: #1f1e21 !important;
}

/* Filet de sécurité générique : tout bouton/submit du back-office qui se
   retrouverait à fond transparent garde au moins un texte foncé lisible.
   (Les variantes ci-dessus, plus spécifiques, gardent leur texte blanc.) */
.main-content button[type="submit"]:not([class*="btn-"]),
.main-content .btn:not([class*="btn-"]) {
    color: #2c2b2f;
}

/* ---------- 12. Harmonisation des listes non migrées sur le socle ----------
   Aligne les tables et paginations « maison » (orders, abandoned-carts,
   promo-codes…) sur le rendu standard du socle DashboardList, sans toucher
   au markup ni au JS des pages. Scopé pour ne PAS affecter les pages déjà
   migrées (qui utilisent .table et des boutons .btn). */

/* Tables de liste « maison » → même rendu que .table du socle */
.main-content .orders-table,
.main-content .carts-table,
.main-content .promo-table {
    width: 100% !important;
    border-collapse: collapse !important;
}

.main-content .orders-table th,
.main-content .carts-table th,
.main-content .promo-table th {
    background: var(--gray-light, #f8f9fa) !important;
    color: var(--ink-2, #121821) !important;
    border-bottom: 1px solid #f0f0f0 !important;
    font-weight: 600 !important;
}

.main-content .orders-table td,
.main-content .carts-table td,
.main-content .promo-table td {
    border-bottom: 1px solid #f0f0f0 !important;
}

.main-content .orders-table tbody tr:hover,
.main-content .carts-table tbody tr:hover,
.main-content .promo-table tbody tr:hover {
    background: var(--red-lighter, #F0F7F2) !important;
}

/* Paginations « maison » (boutons nus, sans classe .btn) → look .btn-secondary.
   Le :not(.btn) protège les paginations du socle (qui utilisent des .btn). */
.main-content .pagination button:not(.btn) {
    padding: 0.4rem 0.85rem !important;
    border: 1px solid #d7d7d3 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    color: #2c2b2f !important;
    font-weight: 600 !important;
}

.main-content .pagination button:not(.btn):hover:not(:disabled) {
    background: var(--red, #5c924e) !important;
    border-color: var(--red, #5c924e) !important;
    color: #ffffff !important;
}

.main-content .pagination button:not(.btn).active {
    background: var(--red, #5c924e) !important;
    border-color: var(--red, #5c924e) !important;
    color: #ffffff !important;
}

.main-content .pagination button:not(.btn):disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* Filtres « maison » regroupés en barre : même carte que .dashboard-search-section */
.main-content .filters-card,
.main-content .period-filter-section {
    border-radius: 8px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06) !important;
}