/* ============================================================
   Barock Academy – Einheitliches Design-System (Phase 1)
   Marken-Primärfarbe app-weit + einheitliche Status-Farben.
   Konservativ: überschreibt nur Farben/Buttons, keine Layouts.
   ============================================================ */

:root {
    --barock-primary: #0f5a8a;
    --barock-primary-rgb: 15, 90, 138;
    --barock-primary-dark: #0c476d;
    --barock-primary-light: #e7eef4;
    --barock-accent: #19b59b;

    /* Einheitliche Status-Farben (app-weit) */
    --status-offen: #d97706;       /* offen / pending */
    --status-genehmigt: #059669;   /* genehmigt / approved */
    --status-abgelehnt: #dc2626;   /* abgelehnt / rejected */
    --status-gestartet: #2563eb;   /* gestartet / started */
    --status-gesendet: #0891b2;    /* versendet / sent */
    --status-entwurf: #6b7280;     /* entwurf / draft */
    --status-followup: #7c3aed;    /* folgekontakt / followup */
}

/* ---- Primärfarbe app-weit (überschreibt AdminLTE / Bootstrap 4) ---- */
.btn-primary {
    background-color: var(--barock-primary);
    border-color: var(--barock-primary);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary:not(:disabled):not(.disabled):active {
    background-color: var(--barock-primary-dark) !important;
    border-color: var(--barock-primary-dark) !important;
}
.btn-primary:focus {
    box-shadow: 0 0 0 .2rem rgba(var(--barock-primary-rgb), .35);
}
.btn-outline-primary {
    color: var(--barock-primary);
    border-color: var(--barock-primary);
}
.btn-outline-primary:hover {
    background-color: var(--barock-primary);
    border-color: var(--barock-primary);
    color: #fff;
}
.bg-primary,
.badge-primary {
    background-color: var(--barock-primary) !important;
}
.text-primary { color: var(--barock-primary) !important; }
.border-primary { border-color: var(--barock-primary) !important; }

a { color: var(--barock-primary); }
a:hover { color: var(--barock-primary-dark); }

.page-item.active .page-link {
    background-color: var(--barock-primary);
    border-color: var(--barock-primary);
}
.page-link { color: var(--barock-primary); }
.custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--barock-primary);
    border-color: var(--barock-primary);
}
.form-control:focus {
    border-color: rgba(var(--barock-primary-rgb), .5);
    box-shadow: 0 0 0 .2rem rgba(var(--barock-primary-rgb), .15);
}

/* Sidebar: aktiver Punkt in Markenfarbe */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar .nav-treeview > .nav-item > .nav-link.active {
    background-color: var(--barock-primary);
    color: #fff;
}

/* ---- Einheitliche Status-Badges (überall nutzbar) ---- */
.badge-status {
    color: #fff;
    font-weight: 600;
    border-radius: .35rem;
    padding: .35em .6em;
    font-size: .75rem;
    display: inline-block;
}
.badge-status-offen     { background: var(--status-offen); }
.badge-status-genehmigt { background: var(--status-genehmigt); }
.badge-status-abgelehnt { background: var(--status-abgelehnt); }
.badge-status-gestartet { background: var(--status-gestartet); }
.badge-status-gesendet  { background: var(--status-gesendet); }
.badge-status-entwurf   { background: var(--status-entwurf); }
.badge-status-followup  { background: var(--status-followup); }

/* ============================================================
   Bootstrap-5 → Bootstrap-4 Kompatibilitäts-Shim (Utilities)
   Damit BS5-Klassen in bestehenden Views unter BS4 korrekt aussehen.
   ============================================================ */
.me-1{margin-right:.25rem!important}.me-2{margin-right:.5rem!important}.me-3{margin-right:1rem!important}.me-auto{margin-right:auto!important}
.ms-1{margin-left:.25rem!important}.ms-2{margin-left:.5rem!important}.ms-3{margin-left:1rem!important}.ms-auto{margin-left:auto!important}
.ps-1{padding-left:.25rem!important}.ps-2{padding-left:.5rem!important}.ps-3{padding-left:1rem!important}
.pe-1{padding-right:.25rem!important}.pe-2{padding-right:.5rem!important}.pe-3{padding-right:1rem!important}
.gap-1{gap:.25rem!important}.gap-2{gap:.5rem!important}.gap-3{gap:1rem!important}
.text-start{text-align:left!important}.text-end{text-align:right!important}
.fw-bold{font-weight:700!important}.fw-semibold{font-weight:600!important}
.rounded-3{border-radius:.5rem!important}
.form-label{display:inline-block;margin-bottom:.5rem;font-weight:500}
.row.g-2{margin-top:-.5rem;margin-right:-.25rem;margin-left:-.25rem}.row.g-2>[class*="col"]{padding-right:.25rem;padding-left:.25rem;margin-top:.5rem}
.row.g-3{margin-top:-1rem;margin-right:-.5rem;margin-left:-.5rem}.row.g-3>[class*="col"]{padding-right:.5rem;padding-left:.5rem;margin-top:1rem}
.btn-close{box-sizing:content-box;width:1em;height:1em;padding:.25em;color:#000;background:transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;border:0;border-radius:.25rem;opacity:.5;cursor:pointer}
.btn-close:hover{opacity:.85}

/* ============================================================
   Einheitliche Badges (Status-Farben app-weit) + Form-/Button-Standard
   ============================================================ */
.badge {
    font-weight: 600;
    border-radius: .35rem;
    padding: .35em .6em;
    font-size: .75rem;
    letter-spacing: .01em;
}
.badge-success   { background-color: var(--status-genehmigt) !important; color: #fff !important; }
.badge-danger    { background-color: var(--status-abgelehnt) !important; color: #fff !important; }
.badge-warning   { background-color: var(--status-offen)     !important; color: #fff !important; }
.badge-info      { background-color: var(--status-gesendet)  !important; color: #fff !important; }
.badge-secondary { background-color: var(--status-entwurf)   !important; color: #fff !important; }
.badge-primary   { background-color: var(--barock-primary)   !important; color: #fff !important; }
.badge-light     { color: #495057 !important; }

/* Buttons & Eingaben: einheitliche Rundung/Abstände */
.btn { border-radius: .375rem; font-weight: 500; }
.btn-group-sm > .btn, .btn-sm { border-radius: .3rem; }
.form-control, .custom-select { border-radius: .375rem; }
label, .form-label { font-weight: 500; color: #495057; }
.required::after { content: " *"; color: var(--status-abgelehnt); }

/* Karten: ruhiger, einheitlicher Header */
.card { border: 1px solid #e9ecef; border-radius: .5rem; }
.card-header { background-color: #fff; border-bottom: 1px solid #eef0f2; font-weight: 600; }

/* Wiederverwendbare, einheitliche Filter-Leiste */
.filter-bar {
    background: #f8f9fb;
    border: 1px solid #e9ecef;
    border-radius: .5rem;
    padding: 1rem 1.25rem;
    margin-bottom: 1.25rem;
}
.filter-bar label { font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; color: #6c757d; font-weight: 600; }

/* ============================================================
   Saubere, helle Sidebar (passend zum aufgeräumten Dashboard)
   ============================================================ */
.main-sidebar {
    background: #ffffff !important;
    border-right: 1px solid #e8edf3;
    box-shadow: none !important;
}
.main-sidebar .brand-link {
    border-bottom: 1px solid #eef1f5;
    color: #1e293b !important;
    font-weight: 600;
    background: #ffffff;
}
.main-sidebar .brand-link:hover { color: var(--barock-primary) !important; }

/* Nav-Links: luftig, abgerundet, gedämpfte Schrift */
.sidebar-light-primary .nav-sidebar .nav-link {
    color: #475569;
    border-radius: 8px;
    margin: 2px 8px;
    padding: .6rem .85rem;
    font-weight: 500;
}
.sidebar-light-primary .nav-sidebar .nav-link p { font-size: .92rem; }
.sidebar-light-primary .nav-sidebar > .nav-item > .nav-link .nav-icon { color: #94a3b8; }

/* Hover dezent */
.sidebar-light-primary .nav-sidebar .nav-link:hover {
    background: #f1f5f9;
    color: var(--barock-primary);
}
.sidebar-light-primary .nav-sidebar .nav-link:hover .nav-icon { color: var(--barock-primary); }

/* Aktiver Punkt in Markenfarbe */
.sidebar-light-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-light-primary .nav-sidebar .nav-treeview > .nav-item > .nav-link.active {
    background: var(--barock-primary) !important;
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(var(--barock-primary-rgb), .25);
}
.sidebar-light-primary .nav-sidebar .nav-link.active .nav-icon { color: #fff !important; }

/* Geöffnete Gruppe dezent markieren */
.sidebar-light-primary .nav-sidebar > .nav-item.menu-is-opening > .nav-link,
.sidebar-light-primary .nav-sidebar > .nav-item.menu-open > .nav-link {
    background: #f1f5f9;
    color: var(--barock-primary);
}
.sidebar-light-primary .nav-sidebar > .nav-item.menu-open > .nav-link .nav-icon { color: var(--barock-primary); }

/* Untermenüs: feinere Schrift + Einrückung */
.nav-sidebar .nav-treeview .nav-link { font-size: .88rem; padding: .45rem .85rem .45rem 1rem; }

/* Sidebar-Suchfeld clean */
.sidebar .form-control-sidebar { background: #f1f5f9; border: 1px solid #e8edf3; color: #334155; }
.sidebar .form-control-sidebar::placeholder { color: #94a3b8; }

/* ============================================================
   Dark Mode (Body-Klasse .dark-mode) – übersteuert die hellen Overrides
   ============================================================ */
body.dark-mode { background: #1b1f24; }
body.dark-mode .content-wrapper,
body.dark-mode .bg-surface-secondary,
body.dark-mode main.bg-surface-secondary,
body.dark-mode .offers-index-page { background: #1b1f24 !important; }

body.dark-mode .main-header.navbar { background: #262b31 !important; border-bottom: 1px solid #3a4047 !important; }
body.dark-mode .navbar-light .nav-link, body.dark-mode .navbar-white .nav-link { color: #d7dbe0 !important; }

body.dark-mode .main-sidebar { background: #262b31 !important; border-right-color: #3a4047 !important; }
body.dark-mode .main-sidebar .brand-link { background: #262b31 !important; color: #fff !important; border-bottom-color: #3a4047 !important; }
body.dark-mode .sidebar-light-primary .nav-sidebar .nav-link { color: #c2c7cf; }
body.dark-mode .sidebar-light-primary .nav-sidebar .nav-link:hover { background: #31373e; color: #fff; }
body.dark-mode .sidebar-light-primary .nav-sidebar .nav-link:hover .nav-icon { color: #fff; }
body.dark-mode .sidebar-light-primary .nav-sidebar .nav-link .nav-icon { color: #8b94a0; }

body.dark-mode .card, body.dark-mode .card-header { background: #262b31 !important; color: #d7dbe0; border-color: #3a4047 !important; }
body.dark-mode .card-header { color: #fff; }
body.dark-mode .dashboard-card[class*="dashboard-card-"] { background: #262b31 !important; color: #d7dbe0 !important; border-color: #3a4047 !important; }
body.dark-mode .dashboard-card[class*="dashboard-card-"] .card-number,
body.dark-mode .dashboard-card[class*="dashboard-card-"] .card-title { color: #fff !important; }
body.dark-mode .dashboard-card[class*="dashboard-card-"] .card-icon { background: rgba(255,255,255,0.06) !important; }

body.dark-mode .table { color: #d7dbe0; }
body.dark-mode .table thead th { background: #2c323a; color: #aeb6c0; border-color: #3a4047; }
body.dark-mode .table td, body.dark-mode .table th { border-color: #3a4047; }
body.dark-mode .table-hover tbody tr:hover { background: #2c323a; }

body.dark-mode .form-control, body.dark-mode .custom-select { background: #1f242a; border-color: #3a4047; color: #d7dbe0; }
body.dark-mode .form-control::placeholder { color: #7c8694; }
body.dark-mode .text-muted, body.dark-mode .text-dark { color: #95a0ac !important; }
body.dark-mode .modal-content, body.dark-mode .dropdown-menu { background: #262b31; color: #d7dbe0; border-color: #3a4047; }
body.dark-mode .dropdown-item { color: #d7dbe0; }
body.dark-mode .dropdown-item:hover { background: #31373e; color: #fff; }
body.dark-mode .close { color: #d7dbe0; text-shadow: none; }
body.dark-mode .filter-bar { background: #20262c; border-color: #3a4047; }

/* Darkmode-Umschalter-Button */
.barock-darkmode-btn { background: transparent; border: 0; color: #64748b; font-size: 1.1rem; padding: .4rem .65rem; border-radius: 8px; line-height: 1; }
.barock-darkmode-btn:hover { background: #f1f5f9; color: var(--barock-primary); }
body.dark-mode .barock-darkmode-btn { color: #f1c40f; }
body.dark-mode .barock-darkmode-btn:hover { background: #31373e; color: #ffd95a; }

/* === Dark Mode: Dashboard-Widgets (.card-3d), innere helle Panels, FullCalendar === */
body.dark-mode .card-3d {
    background: #262b31 !important;
    border: 1px solid #3a4047 !important;
    color: #d7dbe0 !important;
    box-shadow: none !important;
}
body.dark-mode .card-3d h4, body.dark-mode .card-3d h5, body.dark-mode .card-3d h6,
body.dark-mode .card-3d .systems-title, body.dark-mode .card-3d .requests-title,
body.dark-mode .card-3d .request-title, body.dark-mode .card-3d strong { color: #e9edf2 !important; }
body.dark-mode .card-3d .request-card,
body.dark-mode .card-3d [style*="f6f8fb"],
body.dark-mode [style*="background: #f8f6f3"],
body.dark-mode .card-3d .editor-wrapper,
body.dark-mode .card-3d .modern-editor { background: #2c323a !important; border-color: #3a4047 !important; color: #d7dbe0 !important; }

/* Dashboard-Statuskacheln: gedämpfter Text heller */
body.dark-mode .dashboard-card[class*="dashboard-card-"] .card-label,
body.dark-mode .dashboard-card[class*="dashboard-card-"] .card-description,
body.dark-mode .dashboard-card[class*="dashboard-card-"] .meta-item { color: #9aa5b1 !important; }

/* FullCalendar dunkel */
body.dark-mode .fc { color: #d7dbe0; }
body.dark-mode .fc .fc-scrollgrid,
body.dark-mode .fc td, body.dark-mode .fc th { border-color: #3a4047 !important; }
body.dark-mode .fc .fc-col-header-cell-cushion,
body.dark-mode .fc .fc-daygrid-day-number { color: #c2c7cf; }
body.dark-mode .fc .fc-daygrid-day { background: #22272d; }
body.dark-mode .fc .fc-day-today { background: rgba(var(--barock-primary-rgb), .18) !important; }
body.dark-mode .fc .fc-toolbar-title { color: #e9edf2; }
body.dark-mode .fc .fc-button { background: #2c323a; border-color: #3a4047; color: #d7dbe0; }
body.dark-mode .fc .fc-button:hover { background: #363d45; }
body.dark-mode .fc-theme-standard .fc-popover { background: #262b31; border-color: #3a4047; }

/* ============================================================
   Submenu expand/collapse chevron + NESTED-OVERFLOW FIX.
   The chevron is a hardcoded <i> in menu-item-treeview-menu.blade.php,
   positioned absolutely at the right edge of its row.

   THE BUG (took a while to find): nested submenu <ul.nav-treeview> carried
   margin-left + padding-left (the indent that draws the little green line)
   but kept full width, so each nested level extended ~28px past the
   sidebar's right edge. `.sidebar` has overflow-x:hidden, so the
   right-aligned chevron landed in the clipped area and was invisible —
   only on nested rows (top-level rows don't overflow). Fix: stop the UL
   from shifting the rows out, and move the indent onto the link's own
   padding, which keeps every row — and its chevron — inside the sidebar
   at every depth.
   ============================================================ */

.nav-sidebar .nav-item.has-treeview > .nav-link {
    font-weight: 600;
}

/* Keep nested submenus (and their right-edge chevron) inside the sidebar. */
.main-sidebar .nav-sidebar .nav-treeview {
    margin-left: 0 !important;
    padding-left: 0 !important;
}
.main-sidebar .nav-sidebar .nav-treeview .nav-link {
    padding-left: 1.6rem !important;   /* visual indent, no overflow */
    padding-right: 2rem !important;    /* room for the chevron */
}
/* Second indent level a touch deeper, still inside the sidebar. */
.main-sidebar .nav-sidebar .nav-treeview .nav-treeview .nav-link {
    padding-left: 2.4rem !important;
}
