/* webnologie template overrides – 1:1-Kopie von template_bdo.css (gleiches
   rotes Farbschema), nur das Logo ist ein anderes (App\Support\Branding).
   Loaded after cockpit.css when template=webnologie (Domain steuerberater.webnologie.at).
   Änderungen an template_bdo.css hier nachziehen (diff beider Dateien = nur
   diese Kopfzeilen + "body.ae-tpl-webnologie" statt "body.ae-tpl-bdo"). */

:root {
  --primary: #e10920;
  /* rgba(var(--primary-rgb), X) braucht dieses RGB-Tripel separat, siehe
     public/css/cockpit.css – ohne diese Zeile blieben alle dort auf
     rgba(var(--primary-rgb), X) umgestellten Box-Shadows/Hintergründe teal. */
  --primary-rgb: 177, 18, 38;
  /* Dunklere Variante von --primary/--secondary (dieselbe Verdunkelungsrate
     wie cockpit.css' --primary-dark/--secondary-dark ggü. --primary/--secondary),
     genutzt u.a. für die Chatbot-Akzentfarbe (--cb-akzent-dark). Ohne diese
     Zeilen blieben dort die alten teal/gold-Dunkeltöne stehen. */
  --primary-dark: #9c1021;
  --secondary-dark: #9c1021;
  --secondary: #e10920;
  --color-primary: #e10920;
  --color-primary-content: #ffffff;
  --income-primary: #e10920;

  --teal: #9c1021;


  /* Zweitfarbe des Pulse-Logos (Blau im „se", Rot im „p") – dieselbe wie
     AppTheme.secondary in der App. --secondary selbst bleibt hier bewusst rot
     (sehr viele Elemente hängen daran); das Blau wird gezielt dort gesetzt,
     wo im Standard-Template Gold als Hervorhebung dient. */
  --pulse-blau: #0B48DE;
  --pulse-blau-dark: #0837AB;

}


div.aside .sidebar-toggle-btn:hover,
div.aside .menue_toggle:hover,
div.aside .nav > li > a.nav-link:hover,
div.aside .nav > .nav-item > a.nav-link:hover,
div.aside .nav > li.active > a.nav-link,
div.aside .nav > .nav-item.active > a.nav-link,
div.aside .nav .nav .nav-link:hover,
.ck-user-row:hover,
.ck-user-row:focus-visible,
.ck-notif-row:hover {
  background-color: rgba(177, 18, 38, 0.08) !important;
  color: var(--primary) !important;
}

div.aside .nav > li > a.nav-link.active,
div.aside .nav > .nav-item > a.nav-link.active,
div.aside .nav > li.active > a.nav-link,
div.aside .nav > .nav-item.active > a.nav-link,
div.aside .nav .nav .nav-link.active,
.ck-notif-row {
  background-color: rgba(177, 18, 38, 0.10) !important;
  border-color: rgba(177, 18, 38, 0.24) !important;
  color: #8f1022 !important;
}

div.aside .sidebar-toggle-btn:hover,
div.aside .nav > li > a.nav-link:hover .icon-menu,
div.aside .nav > .nav-item > a.nav-link:hover .icon-menu,
div.aside .nav > li > a.nav-link.active .icon-menu,
div.aside .nav > .nav-item > a.nav-link.active .icon-menu,
div.aside .nav .nav .nav-link:hover,
div.aside .nav .nav .nav-link.active,
.ck-user-row:hover .ck-user-name,
.ck-user-row:focus-visible .ck-user-name,
.ck-avatar,
.ck-notif-row,
.ck-wishbox-title {
  color: var(--primary) !important;
}


.ck-avatar {
  background: rgba(177, 18, 38, 0.12) !important;
}

.ck-wishbox {
  background: linear-gradient(135deg, rgba(177, 18, 38, 0.10), rgba(177, 18, 38, 0.03)) !important;
  border-color: rgba(177, 18, 38, 0.22) !important;
}

.ck-wishbox:hover {
  background: rgba(177, 18, 38, 0.16) !important;
  border-color: rgba(177, 18, 38, 0.34) !important;
}

.btn-primary,
a.btn-primary,
button.btn-primary,
.btn-success,
a.btn-success,
button.btn-success,
.ck-header-right .command-bar .btn-primary,
.ck-header-right .command-bar .dropdown-toggle.btn-primary {
  background: var(--primary) !important;
  border-color: var(--primary) !important;
  color: #fff !important;
  box-shadow: 0 8px 24px rgba(177, 18, 38, 0.22) !important;
}

.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover,
.btn-success:hover,
a.btn-success:hover,
button.btn-success:hover,
.ck-header-right .command-bar .btn-primary:hover,
.ck-header-right .command-bar .dropdown-toggle.btn-primary:hover {
  background: #8f1022 !important;
  border-color: #8f1022 !important;
  box-shadow: 0 10px 28px rgba(143, 16, 34, 0.28) !important;
}

.ck-header-right .command-bar .btn-default:hover,
.ck-header-right .command-bar .btn-outline-default:hover,
.ck-header-right .command-bar .btn-link:not(.btn-primary):hover {
  border-color: rgba(177, 18, 38, 0.34) !important;
  color: var(--primary) !important;
}

nav a:hover,
.prompt-chip:hover,
.btn-icon-only:hover,
.expense-hub__upload-card:hover,
.expense-hub__filter-tab:hover,
.upload-zone-full:hover {
  background-color: rgba(177, 18, 38, 0.06) !important;
  color: var(--primary) !important;
}

nav a.active,
.filter-tab.active,
.expense-hub__filter-tab.is-active {
  background-color: rgba(177, 18, 38, 0.10) !important;
  border-color: rgba(177, 18, 38, 0.28) !important;
  color: var(--primary) !important;
}

.btn-quick-add,
.btn-action-primary,
.expense-hub__btn--primary,
.expense-upload-modal__primary,
.beleg-review-modal__secondary,
.assistant-spotlight__submit,
.sidebar-toggle-btn:hover,
.wizard-primary-btn,
.wizard-choice-btn.is-selected,
.beleg-add-row-btn:hover {
  background: var(--primary) !important;
  border-color: var(--primary) !important;
  box-shadow: 0 8px 24px rgba(177, 18, 38, 0.22) !important;
  color: #fff !important;
}

.btn-outline-sm:hover,
.btn-action-outline:hover,
.expense-hub__copy:hover,
.expense-hub__btn--outline:hover,
.expense-upload-modal__dropzone:hover,
.expense-upload-modal__dropzone.is-dragover,
.beleg-review-modal__ghost-link,
.beleg-review-modal__close,
.info-icon,
.header-link,
.logo-sub,
.expense-hub__meta-note,
.beleg-review-modal__eyebrow {
  color: var(--primary) !important;
}

.btn-outline-sm:hover,
.btn-action-outline:hover,
.expense-hub__copy,
.expense-hub__btn--outline,
.expense-upload-modal__dropzone,
.beleg-review-modal__ghost-link,
.beleg-review-modal__close,
.info-icon {
  border-color: rgba(177, 18, 38, 0.24) !important;
}

.input-wrapper:focus-within,
.expense-upload-modal__dropzone.is-dragover,
.beleg-editor-search input:focus,
.wizard-search-input:focus,
.platform-card__action:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 6px rgba(177, 18, 38, 0.10) !important;
}

.ai-spotlight,
.email-autopilot-card,
.burn-rate,
.expense-hub__mail-card,
.expense-hub__upload-card,
.beleg-review-modal__preview,
.wishbox-card {
  background: linear-gradient(135deg, rgba(177, 18, 38, 0.07), rgba(255, 255, 255, 0.98)) !important;
  border-color: rgba(177, 18, 38, 0.18) !important;
  box-shadow: 0 14px 40px rgba(177, 18, 38, 0.10) !important;
}

.item-icon,
.expense-hub__icon,
.sub-logo,
.tools-hub__icon--teal,
.tools-hub__icon--green {
  background: rgba(177, 18, 38, 0.12) !important;
  color: var(--primary) !important;
}

.status-open,
.expense-hub .status-open,
.status-pending,
.expense-hub .status-pending {
  background: rgba(177, 18, 38, 0.10) !important;
  color: #8f1022 !important;
  border-color: rgba(177, 18, 38, 0.20) !important;
}

.beleg-review-modal__meta span,
.expense-upload-modal__ghost-link,
.expense-upload-modal__secondary {
  background: rgba(177, 18, 38, 0.08) !important;
  color: #8f1022 !important;
}

.nav-badge,
.badge.rounded-pill.bg-primary,
.badge.bg-primary,
.filter-count.urgent,
.status-missing,
.expense-hub .status-missing {
  background: #e10920 !important;
  color: #fff !important;
  border-color: #e10920 !important;
}



.fly-scope .f-btn:is(input[type=checkbox],input[type=radio]):checked {
    background: #e10920;
    
}

.header-brand.aside-show-expanded img{
    max-height: 50px
}


.ae-topbar-actions .btn-default:hover,
.ae-topbar-actions .btn-outline-default:hover,
.ae-topbar-actions .ae-default-action.btn-default:hover {
  border-color: #e10920 !important;
  color: #e10920 !important;
}

.ae-topbar-actions .btn-primary,
.ae-topbar-actions .ae-default-action.btn-primary,.bl-new-btn {
  background: #e10920 !important;
  border: 1px solid #e10920 !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(177,18,38,0.28) !important;
}
.bl-contact-btn,.bl-chip { /*outline red */
  border-color: #e10920 !important;
  color: #e10920 !important;
  background: rgba(177, 18, 38, 0.08) !important;
}

.tax-hub__savings {
    background: linear-gradient(135deg, var(--primary) 0%, #7f1d1d 100%);
    border-radius: 24px;
    box-shadow: 0 15px 40px rgba(177, 18, 38, 0.15);
    color: #FFFFFF;
    padding: 32px 38px;
}


.fly-scope .f-btn-primary {
    --f-btn-color: var(--primary)!important;
    --f-btn-fg: var(--color-primary-content)!important;
}



.form-signin .btn-primary:hover, .form-signin #button-login:hover, .form-signin #button-register:hover {
    background: #951526 !important;
    border-color: #951526 !important;
    box-shadow: 0 6px 20px rgba(149, 21, 38, 0.32) !important;
}

.ae-topbar-actions .btn-primary:hover, .ae-topbar-actions .ae-default-action.btn-primary:hover {
    background: #951526 !important;
    border-color: #951526 !important;
    box-shadow: 0 6px 18px rgba(149, 21, 38, 0.36) !important;
}

.income-hub__button {

    box-shadow: 0 8px 20px rgba(149, 21, 38, 0.22);
}

.catalog-action--primary, .catalog-action--primary:hover {
    background: var(--income-primary);
    color: #fff;
    box-shadow: 0 10px 22px rgba(149, 21, 38, 0.28);
}
.catalog-row__badge {
    background: var(--income-primary);

}
.catalog-panel--customers {
    border-top: 4px solid var(--income-primary);
}
.catalog-hub__summary-label, .catalog-hub__summary-meta, .catalog-row span, .catalog-panel__header p, .catalog-panel__empty, .catalog-hub__highlight-copy {
    color: #74808b;
}
.catalog-row__badge.catalog-row__badge--square {
  color: #fff;
}


.sd-tab.active {
    background: #f8e8e9!important;
    color: #8f1022!important;
}
.sd-tab.active .sd-tab-num {
    background: #8f1022!important;

}


.ob-step.is-active .ob-step-num { background: #8f1022!important; color: #fff; }
.ob-step.is-active .ob-step-body strong { color: #8f1022!important; }

.ob-btn--primary {
    background: #8f1022!important;
}

.ob-progress-bar {
    background: linear-gradient(90deg, #8f1022 0%, #c8243c 100%)!important;
}
.btn-outline-primary {
    border-color: #8f1022 !important;
    color: #8f1022 !important;
}

/* ── Buchungseditor (public/css/buchen.css) ──────────────────────────────
   buchen.css hat sein eigenes, auf .bk gescoptes Mini-Designsystem
   (--bk-green/--bk-green-go/--bk-green-soft, --bk-teal/--bk-teal-soft)
   statt der globalen --primary/--success-Variablen oben – die "Erfolg/
   Gebucht"-Farbe UND der teal-blaue Akzent (Experte/Schnell-Umschalter,
   Links, Fokus-Ringe, Split-Chips, Kontenplan-Badges, ...) blieben dort
   deshalb unverändert, obwohl .btn-primary/.btn-success im Rest der App
   schon auf BDO-Rot umgestellt sind. Selektor bewusst mit "body.ae-tpl-webnologie"
   statt nur ".bk" (höhere Spezifität als buchen.css' eigenes ".bk {}"),
   dadurch reicht die Custom-Property-Neudefinition ohne !important – buchen.css
   lädt zwar NACH dieser Datei im DOM, Spezifität schlägt aber Ladereihenfolge.
   Farben identisch zur bestehenden BDO-Palette oben (--primary/#8f1022-Hover),
   damit "Buchen & weiter" & Co. exakt wie die anderen Primary-Buttons wirken. */
/* .bk-modal (Konto-anlegen-Modal) hat seit dem Scope-Fix in buchen.css einen
   eigenen, vollständigen --bk-*-Variablensatz (unabhängig von .bk, siehe dort)
   – deshalb hier mit in den Selektor, sonst bliebe der "Anlegen"-Button dort
   grün statt rot. */
body.ae-tpl-webnologie .bk,
body.ae-tpl-webnologie .bk-modal {
    --bk-green-go:   #e10920;
    --bk-teal:       #e10920;
    --bk-teal-soft:  #f8e8e9;
}

/* Einzige Stelle in buchen.css, die die Hover-Farbe hart statt über eine
   Variable setzt (.bk-btn--go:hover) – braucht deshalb einen eigenen,
   höher-spezifischen Override statt automatisch über --bk-green-go mitzulaufen. */
body.ae-tpl-webnologie .bk-btn--go:hover:not(:disabled) {
    background: #8f1022;
}



.ae-modal-btn--success {
  background: #e10920 !important;
  border-color: #e10920 !important;
  color: #fff !important;
}
.ae-modal-btn--success:hover {
  background: #8f1022 !important;
  border-color: #8f1022 !important;
}

/* Umschalter = Bedienelement → Hauptfarbe */
.rl-toggle input:checked + .slider {
  background: #e10920 !important;
}


/* Animierter Border-Top der Hub-Karten (Einnahmen/Ausgaben/Steuern & SVS,
   siehe cockpit.css .income-hub__card--tabbed/.expense-hub__card/
   .tax-hub__card--tabbed/.border-primary-animation) ist dort als literale
   Farbe #449ea8 hartkodiert statt über var(--income-primary) – reagiert
   deshalb nicht automatisch auf den :root-Override oben und braucht einen
   eigenen Override mit denselben Selektoren (gleiche Ursache wie der
   frühere box-shadow-Bug bei .income-hub__button etc.). */
.income-hub__card--tabbed::before,
.income-hub__card--tabbed::after,
.expense-hub>.ae-tabs-row~.expense-hub__card::before,
.expense-hub>.ae-tabs-row~.expense-hub__card::after,
.border-primary-animation::before,
.border-primary-animation::after,
.tax-hub__card--tabbed::before,
.tax-hub__card--tabbed::after {
  background: var(--income-primary) !important;
}

/* ── „Nächste Zahlung" (SVS-/ESt-Details): Blau statt Rot ────────────────
   Im Standard-Template ist die Karte der nächsten Teilzahlung gold
   (var(--secondary)): Rahmen, Schatten, Fähnchen, Betrag und Status-Pille.
   Hier ist --secondary rot wie die Primärfarbe – die Karte hob sich dadurch
   nicht mehr als eigene Akzentfarbe ab. Die Variablen werden nur INNERHALB
   der Karte umgesetzt, alle Regeln aus cockpit.css greifen unverändert. */
.svs-hub__qc--aktuell {
  --secondary: var(--pulse-blau);
  --secondary-dark: var(--pulse-blau-dark);
}

/* ── Suche in der Topbar: neutral grau statt Primärfarben-Rahmen ──────────
   cockpit.css setzt den Rahmen auf var(--primary) – im roten Template wirkte
   das wie eine Fehlermarkierung. */
.ae-topbar-search {
  border-color: #D5D9DE;
}
.ae-topbar-search:hover {
  border-color: #B8BEC6;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
}
.ae-topbar-search:focus-visible {
  border-color: #9AA1AB;
  box-shadow: 0 0 0 3px rgba(15, 23, 42, 0.08);
}

/* ── Hover der Hub-Buttons: dunkleres Rot statt Türkis ────────────────────
   cockpit.css hat für .income-hub__button(:hover) die Hover-Farbe als
   literales Türkis (#007b86) hartkodiert statt über eine Variable. */
.income-hub__button:hover,
.income-hub__button--primary:hover {
  background: var(--primary-dark);
  border-color: var(--primary-dark);
  color: #fff;
  box-shadow: 0 8px 20px rgba(149, 21, 38, 0.28);
}

/* Farb-Variablen für Stellen, die ihr CSS per JavaScript schreiben (z. B. konto-auswahl.js):
   dort steht var(--ae-akzent-…, <Standard-Türkis>) – hier die roten Entsprechungen (Erfolgs-Grün --ae-ok-* bleibt grün). Alles andere an
   Grün/Türkis deckt css/template_rot_farben.css (php artisan branding:farben) und die
   Middleware RoteTemplateFarben (Inline-Attribute) ab. */
:root {
  --ae-akzent-bg: #fce5e7;
  --ae-akzent-fg: #9c1021;
}
