/* ====================================================================
   THEME-BOOTSTRAP.CSS — Neumorphism Override for Bootstrap 5
   Desenvolvedor TI
   
   Ordem de carregamento (em index.html):
   1. bootstrap.min.css
   2. style.css           (tokens/variáveis Neu)
   3. theme-bootstrap.css (este arquivo — sobrescreve o BS)
   4. components.css      (componentes puramente Neu)
   ==================================================================== */

/* ══════════════════════════════════════════════════════════════════
   0. NAVBAR — FIX: Garantir que dropdowns absolutos não sejam cortados
      Bootstrap aplica overflow implícito que quebra position:absolute
      em elementos filhos. Ordem: body > nav > .container > .navbar-collapse
   ══════════════════════════════════════════════════════════════════ */

/* Impede que qualquer antepassado crie contexto de clip para os dropdowns */
.navbar,
.navbar-custom,
.navbar > .container,
.navbar > .container-fluid,
.navbar-collapse,
.navbar-nav,
.nav-item,
.nav-item-drop {
    overflow: visible !important;
}

/* O dropdown precisa sair do fluxo e flutuar acima de tudo */
.neu-dropdown {
    overflow: visible !important;
    z-index: 9999 !important;
}

/* ══════════════════════════════════════════════════════════════════
   1. BODY & ROOT
   ══════════════════════════════════════════════════════════════════ */

body {
    background: var(--bg) !important;
    color: var(--text-main) !important;
    font-family: 'Inter', system-ui, sans-serif !important;
    -webkit-font-smoothing: antialiased;
}

/* ══════════════════════════════════════════════════════════════════
   2. BOTÕES (btn)
      Transforma todos os .btn em botões neumórficos.
   ══════════════════════════════════════════════════════════════════ */

.btn {
    border-radius: var(--radius-full) !important;
    font-weight: 600 !important;
    font-size: 0.88rem !important;
    padding: 0.6rem 1.5rem !important;
    border: none !important;
    box-shadow: var(--neu-shadow-sm) !important;
    transition: var(--transition) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.45rem !important;
    letter-spacing: 0.01em;
}

.btn:hover   { transform: translateY(-2px); }
.btn:active  { transform: translateY(0) scale(0.98) !important; }
.btn:focus   { box-shadow: var(--neu-shadow-sm), 0 0 0 3px rgba(108,99,255,.2) !important; outline: none !important; }

/* Primary */
.btn-primary {
    background: var(--accent-gradient) !important;
    color: #fff !important;
    box-shadow: 4px 4px 12px rgba(108,99,255,.4), -2px -2px 8px var(--shadow-light) !important;
}
.btn-primary:hover {
    box-shadow: 6px 6px 18px rgba(108,99,255,.55), -3px -3px 10px var(--shadow-light) !important;
    color: #fff !important;
}

/* Secondary */
.btn-secondary {
    background: var(--bg) !important;
    color: var(--text-main) !important;
    box-shadow: var(--neu-shadow-sm) !important;
}
.btn-secondary:hover { box-shadow: var(--neu-shadow) !important; color: var(--accent); }

/* Success */
.btn-success {
    background: linear-gradient(135deg,#22c55e,#16a34a) !important;
    color: #fff !important;
    box-shadow: 4px 4px 12px rgba(34,197,94,.4), -2px -2px 8px var(--shadow-light) !important;
}
.btn-success:hover { box-shadow: 6px 6px 18px rgba(34,197,94,.5) !important; color: #fff !important; }

/* Danger */
.btn-danger {
    background: linear-gradient(135deg,#ff6584,#ff4560) !important;
    color: #fff !important;
    box-shadow: 4px 4px 12px rgba(255,69,96,.4), -2px -2px 8px var(--shadow-light) !important;
}
.btn-danger:hover { box-shadow: 6px 6px 18px rgba(255,69,96,.55) !important; color: #fff !important; }

/* Warning */
.btn-warning {
    background: linear-gradient(135deg,#f97316,#ea580c) !important;
    color: #fff !important;
    box-shadow: 4px 4px 12px rgba(249,115,22,.4), -2px -2px 8px var(--shadow-light) !important;
}
.btn-warning:hover { box-shadow: 6px 6px 18px rgba(249,115,22,.5) !important; color: #fff !important; }

/* Info */
.btn-info {
    background: linear-gradient(135deg,#0ea5e9,#0284c7) !important;
    color: #fff !important;
    box-shadow: 4px 4px 12px rgba(14,165,233,.4), -2px -2px 8px var(--shadow-light) !important;
}
.btn-info:hover { box-shadow: 6px 6px 18px rgba(14,165,233,.5) !important; color: #fff !important; }

/* Light */
.btn-light {
    background: var(--bg-light) !important;
    color: var(--text-main) !important;
    box-shadow: var(--neu-shadow-sm) !important;
}
.btn-light:hover { box-shadow: var(--neu-shadow) !important; }

/* Dark */
.btn-dark {
    background: var(--text-main) !important;
    color: var(--bg) !important;
    box-shadow: var(--neu-shadow-sm) !important;
}

/* Link */
.btn-link {
    background: transparent !important;
    color: var(--accent) !important;
    box-shadow: none !important;
    text-decoration: none !important;
}
.btn-link:hover { color: var(--accent); text-decoration: underline !important; transform: none !important; }

/* Outline variants — Neumorphic inset style */
.btn-outline-primary, .btn-outline-secondary, .btn-outline-success,
.btn-outline-danger, .btn-outline-warning, .btn-outline-info {
    background: var(--bg) !important;
    box-shadow: var(--neu-shadow-inset-sm) !important;
}

.btn-outline-primary { color: var(--accent) !important; border: none !important; }
.btn-outline-secondary { color: var(--text-muted) !important; border: none !important; }
.btn-outline-success { color: #16a34a !important; border: none !important; }
.btn-outline-danger { color: var(--accent-2) !important; border: none !important; }
.btn-outline-warning { color: #ea580c !important; border: none !important; }
.btn-outline-info { color: #0284c7 !important; border: none !important; }

.btn-outline-primary:hover  { background: var(--accent-soft) !important; box-shadow: var(--neu-shadow-sm) !important; }
.btn-outline-secondary:hover { background: var(--bg) !important; box-shadow: var(--neu-shadow-sm) !important; }
.btn-outline-success:hover  { background: rgba(34,197,94,.1) !important; box-shadow: var(--neu-shadow-sm) !important; }
.btn-outline-danger:hover   { background: rgba(255,101,132,.1) !important; box-shadow: var(--neu-shadow-sm) !important; }
.btn-outline-warning:hover  { background: rgba(249,115,22,.1) !important; box-shadow: var(--neu-shadow-sm) !important; }
.btn-outline-info:hover     { background: rgba(14,165,233,.1) !important; box-shadow: var(--neu-shadow-sm) !important; }

/* Sizes */
.btn-sm { padding: 0.4rem 1rem !important; font-size: 0.8rem !important; }
.btn-lg { padding: 0.8rem 2rem !important; font-size: 1rem !important; }

/* Disabled */
.btn:disabled, .btn.disabled {
    opacity: 0.45 !important;
    pointer-events: none !important;
    transform: none !important;
    box-shadow: var(--neu-shadow-inset-sm) !important;
}

/* Button Group */
.btn-group > .btn { border-radius: 0 !important; }
.btn-group > .btn:first-child { border-radius: var(--radius-full) 0 0 var(--radius-full) !important; }
.btn-group > .btn:last-child  { border-radius: 0 var(--radius-full) var(--radius-full) 0 !important; }

/* ══════════════════════════════════════════════════════════════════
   3. CARDS (.card)
   ══════════════════════════════════════════════════════════════════ */

.card {
    background: var(--bg) !important;
    border: none !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--neu-shadow) !important;
    transition: var(--transition);
    overflow: hidden;
}

.card:hover { box-shadow: var(--neu-shadow-lg) !important; transform: translateY(-2px); }

.card-header {
    background: transparent !important;
    border-bottom: 1px solid rgba(0,0,0,.07) !important;
    padding: 1.1rem 1.35rem 0.9rem !important;
    font-weight: 700;
    color: var(--text-main);
}

.card-footer {
    background: transparent !important;
    border-top: 1px solid rgba(0,0,0,.07) !important;
    padding: 0.9rem 1.35rem 1.1rem !important;
}

.card-body { padding: 1.35rem !important; }
.card-title { font-weight: 700 !important; color: var(--text-main) !important; }
.card-subtitle { color: var(--text-muted) !important; }
.card-text { color: var(--text-muted) !important; font-size: 0.9rem !important; line-height: 1.7 !important; }

.card-img-top { border-radius: 0 !important; }

/* Card variants */
.card.card-flat {
    box-shadow: var(--neu-shadow-inset-sm) !important;
    background: var(--bg) !important;
}
.card.card-flat:hover { box-shadow: var(--neu-shadow-inset-sm) !important; transform: none !important; }

.card.card-accent    { border-left: 4px solid var(--accent) !important; }
.card.card-success   { border-left: 4px solid #22c55e !important; }
.card.card-danger    { border-left: 4px solid var(--accent-2) !important; }
.card.card-warning   { border-left: 4px solid #f97316 !important; }
.card.card-info      { border-left: 4px solid #0ea5e9 !important; }

/* ══════════════════════════════════════════════════════════════════
   4. BADGE
   ══════════════════════════════════════════════════════════════════ */

.badge {
    border-radius: var(--radius-full) !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    padding: 0.3rem 0.7rem !important;
    box-shadow: 2px 2px 6px rgba(0,0,0,.1) !important;
    letter-spacing: 0.03em;
}

.bg-primary   { background: var(--accent-gradient) !important; }
.bg-secondary { background: var(--text-light) !important; color: var(--bg) !important; }
.bg-success   { background: linear-gradient(135deg,#22c55e,#16a34a) !important; }
.bg-danger    { background: linear-gradient(135deg,#ff6584,#ff4560) !important; }
.bg-warning   { background: linear-gradient(135deg,#f97316,#ea580c) !important; color: #fff !important; }
.bg-info      { background: linear-gradient(135deg,#0ea5e9,#0284c7) !important; }
.bg-light     { background: var(--bg-light) !important; color: var(--text-main) !important; box-shadow: var(--neu-shadow-sm) !important; }
.bg-dark      { background: var(--text-main) !important; color: var(--bg) !important; }

/* ══════════════════════════════════════════════════════════════════
   5. ALERTS (.alert)
   ══════════════════════════════════════════════════════════════════ */

.alert {
    border: none !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--neu-shadow-sm) !important;
    padding: 1rem 1.25rem !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 0.75rem !important;
    position: relative;
    overflow: hidden;
}

.alert::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    border-radius: 4px 0 0 4px;
}

.alert-primary   { background: var(--accent-soft) !important;         color: var(--accent) !important; }
.alert-primary::before   { background: var(--accent); }
.alert-success   { background: rgba(34,197,94,.12) !important;        color: #16a34a !important; }
.alert-success::before   { background: #22c55e; }
.alert-danger    { background: rgba(255,101,132,.12) !important;       color: var(--accent-2) !important; }
.alert-danger::before    { background: var(--accent-2); }
.alert-warning   { background: rgba(249,115,22,.12) !important;       color: #ea580c !important; }
.alert-warning::before   { background: #f97316; }
.alert-info      { background: rgba(14,165,233,.12) !important;       color: #0284c7 !important; }
.alert-info::before      { background: #0ea5e9; }
.alert-secondary { background: var(--bg) !important;                  color: var(--text-muted) !important; }
.alert-secondary::before { background: var(--text-light); }
.alert-light     { background: var(--bg-light) !important;            color: var(--text-main) !important; }
.alert-dark      { background: rgba(0,0,0,.06) !important;            color: var(--text-main) !important; }

.alert-heading { font-weight: 700 !important; }

.btn-close { filter: none !important; background: none !important; opacity: 0.5; }
.btn-close::before { content: '✕'; font-size: 0.85rem; color: currentColor; }
.btn-close:hover { opacity: 1; }

/* ══════════════════════════════════════════════════════════════════
   6. FORM CONTROLS
   ══════════════════════════════════════════════════════════════════ */

.form-control, .form-select {
    background: var(--bg) !important;
    border: none !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--neu-shadow-inset-sm) !important;
    color: var(--text-main) !important;
    font-family: inherit !important;
    font-size: 0.92rem !important;
    padding: 0.65rem 1rem !important;
    transition: box-shadow 0.25s ease, color 0.2s !important;
}

.form-control:focus, .form-select:focus {
    background: var(--bg) !important;
    border: none !important;
    box-shadow: var(--neu-shadow-inset), 0 0 0 3px rgba(108,99,255,.18) !important;
    color: var(--text-main) !important;
    outline: none !important;
}

.form-control::placeholder { color: var(--text-light) !important; }

.form-control:disabled, .form-select:disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

.form-control.is-valid,  .form-select.is-valid  {
    box-shadow: var(--neu-shadow-inset-sm), 0 0 0 2px rgba(34,197,94,.35) !important;
    background-image: none !important;
}
.form-control.is-invalid, .form-select.is-invalid {
    box-shadow: var(--neu-shadow-inset-sm), 0 0 0 2px rgba(255,101,132,.4) !important;
    background-image: none !important;
}

.valid-feedback   { color: #16a34a !important; font-size: .8rem !important; }
.invalid-feedback { color: var(--accent-2) !important; font-size: .8rem !important; }

.form-label {
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    color: var(--text-muted) !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    margin-bottom: 0.45rem !important;
}

.form-text { color: var(--text-light) !important; font-size: 0.78rem !important; }

/* Input Group */
.input-group .form-control { border-radius: var(--radius) !important; }
.input-group-text {
    background: var(--bg) !important;
    border: none !important;
    box-shadow: var(--neu-shadow-inset-sm) !important;
    color: var(--text-muted) !important;
    font-size: 0.9rem !important;
    border-radius: var(--radius) !important;
}

/* Floating labels */
.form-floating > label { color: var(--text-light) !important; font-size: 0.88rem !important; }
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label {
    color: var(--accent) !important;
}

/* Form check (checkbox + radio via BS) */
.form-check-input {
    background-color: var(--bg) !important;
    border: none !important;
    box-shadow: var(--neu-shadow-inset-sm) !important;
    cursor: pointer;
    transition: background .2s, box-shadow .2s;
}

.form-check-input:checked {
    background-color: var(--accent) !important;
    box-shadow: 2px 2px 6px rgba(108,99,255,.4) !important;
}

.form-check-input:focus { box-shadow: var(--neu-shadow-inset-sm), 0 0 0 3px rgba(108,99,255,.2) !important; }

.form-check-label { font-size: 0.9rem !important; color: var(--text-main) !important; }

/* Switch */
.form-switch .form-check-input {
    border-radius: var(--radius-full) !important;
    background-image: none !important;
    width: 2.8em !important;
    position: relative;
}

.form-switch .form-check-input::after {
    content: '';
    position: absolute;
    top: 2px; left: 2px;
    width: 14px; height: 14px;
    background: var(--bg);
    border-radius: 50%;
    box-shadow: var(--neu-shadow-sm);
    transition: transform .25s ease;
}

.form-switch .form-check-input:checked { background-color: var(--accent) !important; }
.form-switch .form-check-input:checked::after { transform: translateX(18px); }

/* Range */
.form-range::-webkit-slider-runnable-track {
    background: var(--bg) !important;
    box-shadow: inset 2px 2px 5px var(--shadow-dark), inset -2px -2px 4px var(--shadow-light);
    border-radius: var(--radius-full);
    height: 6px;
}
.form-range::-webkit-slider-thumb {
    background: var(--bg) !important;
    box-shadow: var(--neu-shadow-sm) !important;
    border: none !important;
    width: 20px; height: 20px;
    border-radius: 50%;
    margin-top: -7px;
    transition: box-shadow .2s;
}
.form-range::-webkit-slider-thumb:hover { box-shadow: var(--neu-shadow) !important; }

/* ══════════════════════════════════════════════════════════════════
   7. TABLE
   ══════════════════════════════════════════════════════════════════ */

.table {
    color: var(--text-main) !important;
    border-color: rgba(0,0,0,.06) !important;
}

.table > :not(caption) > * > * {
    background-color: transparent !important;
    border-bottom-color: rgba(0,0,0,.06) !important;
    padding: 0.85rem 1rem !important;
    vertical-align: middle !important;
}

.table thead th {
    font-size: 0.74rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .07em !important;
    color: var(--text-light) !important;
    border-bottom: 1px solid rgba(0,0,0,.07) !important;
}

.table-hover > tbody > tr:hover > * {
    background-color: var(--accent-soft) !important;
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: rgba(0,0,0,.025) !important;
}

.table-bordered > :not(caption) > * > * {
    border-width: 1px !important;
    border-color: rgba(0,0,0,.06) !important;
}

.table-responsive {
    border-radius: var(--radius-lg);
    box-shadow: var(--neu-shadow);
    overflow: hidden;
}

/* ══════════════════════════════════════════════════════════════════
   8. MODAL (Bootstrap)
   ══════════════════════════════════════════════════════════════════ */

.modal-content {
    background: var(--bg) !important;
    border: none !important;
    border-radius: var(--radius-xl) !important;
    box-shadow: var(--neu-shadow-lg), 0 20px 50px rgba(0,0,0,.18) !important;
    overflow: hidden;
}

.modal-header {
    background: transparent !important;
    border-bottom: 1px solid rgba(0,0,0,.07) !important;
    padding: 1.3rem 1.5rem 1rem !important;
}

.modal-footer {
    background: transparent !important;
    border-top: 1px solid rgba(0,0,0,.07) !important;
    padding: 1rem 1.5rem 1.3rem !important;
}

.modal-body { padding: 1.25rem 1.5rem !important; }
.modal-title { font-weight: 700 !important; color: var(--text-main) !important; }

.modal-backdrop { backdrop-filter: blur(5px) !important; background: rgba(0,0,0,.3) !important; }

/* ══════════════════════════════════════════════════════════════════
   9. DROPDOWN
   ══════════════════════════════════════════════════════════════════ */

.dropdown-menu {
    background: var(--bg) !important;
    border: none !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--neu-shadow-lg) !important;
    padding: 0.5rem !important;
}

.dropdown-item {
    border-radius: var(--radius) !important;
    color: var(--text-main) !important;
    font-size: .88rem !important;
    padding: 0.55rem 0.85rem !important;
    transition: background .15s;
}

.dropdown-item:hover, .dropdown-item:focus {
    background: var(--accent-soft) !important;
    color: var(--accent) !important;
}

.dropdown-item.active, .dropdown-item:active {
    background: var(--accent-gradient) !important;
    color: #fff !important;
}

.dropdown-divider { border-color: rgba(0,0,0,.08) !important; margin: 0.4rem 0.5rem !important; }
.dropdown-header  { color: var(--text-light) !important; font-size: 0.7rem !important; font-weight: 700 !important; letter-spacing: .08em !important; text-transform: uppercase !important; }

/* ══════════════════════════════════════════════════════════════════
   10. NAV TABS & PILLS
   ══════════════════════════════════════════════════════════════════ */

.nav-tabs {
    border: none !important;
    background: var(--bg);
    border-radius: var(--radius-lg);
    box-shadow: var(--neu-shadow-inset-sm);
    padding: 0.35rem;
    gap: 0.2rem;
    display: flex;
}

.nav-tabs .nav-link {
    border: none !important;
    border-radius: var(--radius) !important;
    color: var(--text-muted) !important;
    font-weight: 600 !important;
    font-size: 0.88rem !important;
    padding: 0.55rem 1.1rem !important;
    transition: var(--transition) !important;
    background: transparent !important;
}

.nav-tabs .nav-link:hover { color: var(--accent) !important; background: var(--accent-soft) !important; }
.nav-tabs .nav-link.active {
    background: var(--bg) !important;
    box-shadow: var(--neu-shadow-sm) !important;
    color: var(--accent) !important;
}

.nav-pills .nav-link {
    border-radius: var(--radius-full) !important;
    color: var(--text-muted) !important;
    font-weight: 600 !important;
    font-size: .88rem !important;
    transition: var(--transition) !important;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background: var(--accent-gradient) !important;
    box-shadow: 3px 3px 10px rgba(108,99,255,.4) !important;
}

.tab-content > .tab-pane { padding-top: 1.25rem; }

/* ══════════════════════════════════════════════════════════════════
   11. PROGRESS
   ══════════════════════════════════════════════════════════════════ */

.progress {
    background: var(--bg) !important;
    box-shadow: var(--neu-shadow-inset-sm) !important;
    border-radius: var(--radius-full) !important;
    overflow: visible !important;
    height: 10px !important;
}

.progress-bar {
    border-radius: var(--radius-full) !important;
    background: var(--accent-gradient) !important;
    box-shadow: 2px 0 8px rgba(108,99,255,.4) !important;
    overflow: hidden;
}

.progress-bar.bg-success { background: linear-gradient(135deg,#22c55e,#16a34a) !important; box-shadow: 2px 0 8px rgba(34,197,94,.4) !important; }
.progress-bar.bg-danger  { background: var(--accent-gradient2) !important; box-shadow: 2px 0 8px rgba(255,101,132,.4) !important; }
.progress-bar.bg-warning { background: linear-gradient(135deg,#f97316,#ea580c) !important; box-shadow: 2px 0 8px rgba(249,115,22,.4) !important; }
.progress-bar.bg-info    { background: linear-gradient(135deg,#0ea5e9,#0284c7) !important; box-shadow: 2px 0 8px rgba(14,165,233,.4) !important; }

/* ══════════════════════════════════════════════════════════════════
   12. ACCORDION (Bootstrap)
   ══════════════════════════════════════════════════════════════════ */

.accordion { display: flex; flex-direction: column; gap: 0.5rem; }

.accordion-item {
    background: var(--bg) !important;
    border: none !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--neu-shadow-sm) !important;
    overflow: hidden;
    transition: box-shadow .25s;
}

.accordion-item.show, .accordion-item:has(.show) { box-shadow: var(--neu-shadow) !important; }

.accordion-header { background: transparent !important; }

.accordion-button {
    background: transparent !important;
    box-shadow: none !important;
    font-weight: 600 !important;
    color: var(--text-main) !important;
    font-size: 0.92rem !important;
    border: none !important;
    padding: 1rem 1.25rem !important;
}

.accordion-button:not(.collapsed) { color: var(--accent) !important; background: transparent !important; }
.accordion-button::after { filter: none !important; }
.accordion-button:not(.collapsed)::after { transform: rotate(-180deg); }

.accordion-body {
    background: transparent !important;
    padding: 0.25rem 1.25rem 1.25rem !important;
    font-size: 0.88rem !important;
    color: var(--text-muted) !important;
    line-height: 1.7 !important;
}

/* ══════════════════════════════════════════════════════════════════
   13. LIST GROUP
   ══════════════════════════════════════════════════════════════════ */

.list-group {
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--neu-shadow) !important;
    overflow: hidden;
    gap: 0.2rem;
    padding: 0.35rem;
    background: var(--bg);
    display: flex;
    flex-direction: column;
}

.list-group-item {
    background: transparent !important;
    border: none !important;
    border-radius: var(--radius) !important;
    color: var(--text-main) !important;
    font-size: .9rem !important;
    padding: 0.75rem 1rem !important;
    transition: background .15s;
}

.list-group-item:hover               { background: var(--accent-soft) !important; color: var(--accent) !important; }
.list-group-item.active              { background: var(--accent-gradient) !important; color: #fff !important; box-shadow: 3px 3px 8px rgba(108,99,255,.3); }
.list-group-item.list-group-item-primary { background: var(--accent-soft) !important; color: var(--accent) !important; }
.list-group-item.list-group-item-success { background: rgba(34,197,94,.1) !important; color: #16a34a !important; }
.list-group-item.list-group-item-danger  { background: rgba(255,101,132,.1) !important; color: var(--accent-2) !important; }
.list-group-item.list-group-item-warning { background: rgba(249,115,22,.1) !important; color: #ea580c !important; }

/* ══════════════════════════════════════════════════════════════════
   14. BREADCRUMB
   ══════════════════════════════════════════════════════════════════ */

.breadcrumb {
    background: var(--bg) !important;
    border-radius: var(--radius-full) !important;
    box-shadow: var(--neu-shadow-sm) !important;
    padding: 0.5rem 1.1rem !important;
    width: fit-content;
    margin-bottom: 0 !important;
}

.breadcrumb-item { font-size: .82rem !important; font-weight: 500 !important; }
.breadcrumb-item a { color: var(--text-muted) !important; text-decoration: none !important; }
.breadcrumb-item a:hover { color: var(--accent) !important; }
.breadcrumb-item.active { color: var(--text-main) !important; font-weight: 600 !important; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--text-light) !important; }

/* ══════════════════════════════════════════════════════════════════
   15. PAGINATION
   ══════════════════════════════════════════════════════════════════ */

.pagination { gap: 0.3rem !important; }

.page-item .page-link {
    background: var(--bg) !important;
    border: none !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--neu-shadow-sm) !important;
    color: var(--text-muted) !important;
    font-weight: 600 !important;
    font-size: .88rem !important;
    padding: 0.5rem 0.9rem !important;
    transition: var(--transition-fast) !important;
    min-width: 38px;
    text-align: center;
}

.page-item .page-link:hover { box-shadow: var(--neu-shadow) !important; color: var(--accent) !important; }
.page-item.active .page-link {
    background: var(--accent-gradient) !important;
    color: #fff !important;
    box-shadow: 3px 3px 8px rgba(108,99,255,.4) !important;
}
.page-item.disabled .page-link { opacity: .4 !important; }

/* ══════════════════════════════════════════════════════════════════
   16. TOAST (Bootstrap)
   ══════════════════════════════════════════════════════════════════ */

.toast {
    background: var(--bg) !important;
    border: none !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--neu-shadow-lg) !important;
}

.toast-header {
    background: transparent !important;
    border-bottom: 1px solid rgba(0,0,0,.07) !important;
    color: var(--text-main) !important;
    font-weight: 600 !important;
}

.toast-body { color: var(--text-muted) !important; font-size: .88rem !important; }

/* ══════════════════════════════════════════════════════════════════
   17. SPINNER
   ══════════════════════════════════════════════════════════════════ */

.spinner-border {
    border-color: var(--shadow-dark) !important;
    border-right-color: var(--accent) !important;
    box-shadow: var(--neu-shadow-sm);
}

.spinner-grow { background-color: var(--accent) !important; }

/* ══════════════════════════════════════════════════════════════════
   18. TOOLTIP & POPOVER
   ══════════════════════════════════════════════════════════════════ */

.tooltip-inner {
    background: var(--text-main) !important;
    color: var(--bg) !important;
    border-radius: var(--radius) !important;
    font-size: .78rem !important;
    font-weight: 500 !important;
    padding: 0.35rem 0.75rem !important;
}

.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before,
.bs-tooltip-top .tooltip-arrow::before { border-top-color: var(--text-main) !important; }
.bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before { border-bottom-color: var(--text-main) !important; }
.bs-tooltip-auto[data-popper-placement^=start] .tooltip-arrow::before  { border-left-color: var(--text-main) !important; }
.bs-tooltip-auto[data-popper-placement^=end] .tooltip-arrow::before    { border-right-color: var(--text-main) !important; }

.popover {
    background: var(--bg) !important;
    border: none !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--neu-shadow-lg) !important;
}
.popover-header { background: transparent !important; border-bottom: 1px solid rgba(0,0,0,.07) !important; font-weight: 700 !important; color: var(--text-main) !important; }
.popover-body   { color: var(--text-muted) !important; font-size: .88rem !important; }

/* ══════════════════════════════════════════════════════════════════
   19. OFFCANVAS
   ══════════════════════════════════════════════════════════════════ */

.offcanvas {
    background: var(--bg) !important;
    border: none !important;
    box-shadow: var(--neu-shadow-lg) !important;
}

.offcanvas-header {
    border-bottom: 1px solid rgba(0,0,0,.07) !important;
    padding: 1.25rem 1.5rem !important;
}

.offcanvas-title { font-weight: 700 !important; color: var(--text-main) !important; }

/* ══════════════════════════════════════════════════════════════════
   20. UTILITIES & OVERRIDES
   ══════════════════════════════════════════════════════════════════ */

.text-primary   { color: var(--accent)    !important; }
.text-secondary { color: var(--text-muted) !important; }
.text-success   { color: #16a34a !important; }
.text-danger    { color: var(--accent-2)  !important; }
.text-warning   { color: #ea580c !important; }
.text-info      { color: #0284c7 !important; }
.text-muted     { color: var(--text-muted) !important; }
.text-light     { color: var(--text-light) !important; }

.border        { border-color: rgba(0,0,0,.08) !important; }
.border-primary { border-color: var(--accent) !important; }

hr { border-color: rgba(0,0,0,.08) !important; opacity: 1 !important; }

.shadow       { box-shadow: var(--neu-shadow) !important; }
.shadow-sm    { box-shadow: var(--neu-shadow-sm) !important; }
.shadow-lg    { box-shadow: var(--neu-shadow-lg) !important; }
.shadow-none  { box-shadow: none !important; }

.rounded      { border-radius: var(--radius) !important; }
.rounded-sm   { border-radius: var(--radius-sm) !important; }
.rounded-lg   { border-radius: var(--radius-lg) !important; }
.rounded-pill { border-radius: var(--radius-full) !important; }

/* Link */
a { color: var(--accent); }
a:hover { color: var(--text-main); }

/* Code */
code {
    color: var(--accent) !important;
    background: var(--accent-soft) !important;
    padding: .1rem .4rem !important;
    border-radius: var(--radius-sm) !important;
    font-size: .85em !important;
}

/* Heading hierarchy */
h1,h2,h3,h4,h5,h6 {
    color: var(--text-main);
    font-family: 'Space Grotesk', sans-serif;
    letter-spacing: -0.02em;
}

/* ══════════════════════════════════════════════════════════════════
   21. FIX DARK THEME
   ══════════════════════════════════════════════════════════════════ */

[data-theme="dark"] .table { --bs-table-bg: transparent; }
[data-theme="dark"] .form-select option { background: var(--bg-dark); color: var(--text-main); }
