/*
 * IP SYSCON Kundenportal — CMS Toolbar Custom Styles
 * Wird im Frontend-Template geladen, damit die DjangoCMS-Toolbar
 * auf allen Seiten korrekt gestyled wird.
 */

/* ===================================================================
   0. CSS-Variablen: Light-Mode erzwingen (überschreibt light-dark())
   =================================================================== */

div.cms {
    --dca-white: #ffffff;
    --dca-black: #1a1a1a;
    color-scheme: light;
}

/* ===================================================================
   1. Toolbar-Hintergrund: weiß mit grüner Unterkante
   =================================================================== */

div.cms .cms-toolbar {
    background-color: #ffffff !important;
}

div.cms .cms-toolbar:after {
    background: #509e2f !important;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.15) !important;
}


/* ===================================================================
   2. Toolbar-Menüpunkte
   =================================================================== */

/* Standard-Menülinks: dunkle Schrift */
div.cms .cms-toolbar-item-navigation li a {
    color: #1a1a1a !important;
}

div.cms .cms-toolbar-item-navigation li a:hover {
    color: #509e2f !important;
}

/* Aktiver/offener Menüpunkt: grüner Hintergrund */
div.cms .cms-toolbar-item-navigation .cms-toolbar-item-navigation-hover > a {
    background: #509e2f !important;
    color: #ffffff !important;
}

/* Wenn das LI den Hover-Zustand hat (Menü offen), muss das A auch beim
   eigenen :hover weiß bleiben — sonst grüne Schrift auf grünem Grund */
div.cms .cms-toolbar-item-navigation .cms-toolbar-item-navigation-hover > a:hover {
    background: #3a7a21 !important;
    color: #ffffff !important;
}

/* Dropdown-Menüs: weißer Hintergrund */
div.cms .cms-toolbar-item-navigation .cms-toolbar-item-navigation-hover ul {
    background-color: #ffffff !important;
    border-color: #e0e0e0 !important;
}

div.cms .cms-toolbar-item-navigation .cms-toolbar-item-navigation-hover ul li a {
    color: #1a1a1a !important;
}

div.cms .cms-toolbar-item-navigation .cms-toolbar-item-navigation-hover ul li a:hover {
    background: #e8f5e1 !important;
    color: #509e2f !important;
}

/* Deaktivierte Menüpunkte */
div.cms .cms-toolbar-item-navigation .cms-toolbar-item-navigation-disabled a {
    color: #999999 !important;
}


/* ===================================================================
   3. Toolbar-Buttons
   =================================================================== */

/* Action-Buttons (Veröffentlichen etc.) */
div.cms .cms-btn-action {
    background-color: #509e2f !important;
    border-color: #509e2f !important;
    color: #ffffff !important;
}

div.cms .cms-btn-action:hover,
div.cms .cms-btn-action:active,
div.cms .cms-btn-action:focus {
    background-color: #3a7a21 !important;
    border-color: #3a7a21 !important;
    color: #ffffff !important;
}

/* Normale Toolbar-Buttons */
div.cms .cms-toolbar .cms-btn {
    color: #1a1a1a !important;
}

div.cms .cms-toolbar .cms-btn:hover {
    color: #509e2f !important;
}

/* Mode-Switcher (Inhalt/Struktur Toggle) */
div.cms .cms-toolbar-item-cms-mode-switcher .cms-btn.cms-btn-active,
div.cms .cms-toolbar-item-cms-mode-switcher .cms-btn.cms-btn-active:active,
div.cms .cms-toolbar-item-cms-mode-switcher .cms-btn.cms-btn-active:focus {
    background-color: #e8f5e1 !important;
    border-color: #509e2f !important;
    color: #509e2f !important;
}

div.cms .cms-toolbar-item-cms-mode-switcher .cms-btn.cms-dropdown-toggle {
    background-color: #f5f5f5 !important;
    border-color: #e0e0e0 !important;
}


/* ===================================================================
   4. DjangoCMS Logo → IP SYSCON Logo
   =================================================================== */

/* Icon-Font ausblenden, eigenes Logo einsetzen */
div.cms .cms-toolbar-item-logo a {
    font-size: 0 !important;
    width: auto !important;
    padding: 0 12px !important;
    line-height: 46px !important;
}

div.cms .cms-toolbar-item-logo a::before {
    content: '' !important;
    display: inline-block !important;
    width: 120px !important;
    height: 34px !important;
    background: url('/static/IP-SYSCON-Kundenportal-positiv.png') no-repeat center / contain !important;
    vertical-align: middle !important;
    font-family: inherit !important;
    font-size: 0 !important;
}

/* "django CMS"-Text ausblenden */
div.cms .cms-toolbar-item-logo a span {
    display: none !important;
}


/* ===================================================================
   5. Toolbar Dropdown-Pfeile und Icons
   =================================================================== */

/* Dropdown-Pfeile in der Toolbar */
div.cms .cms-toolbar-item-navigation .cms-icon {
    color: #1a1a1a !important;
}

div.cms .cms-toolbar-item-navigation .cms-toolbar-item-navigation-hover .cms-icon {
    color: #ffffff !important;
}

/* Submenu-Pfeile */
div.cms .cms-toolbar-item-navigation .cms-toolbar-item-navigation-hover ul .cms-icon {
    color: #1a1a1a !important;
}


/* ===================================================================
   6. Dark-Mode-Toggle ausblenden
   =================================================================== */

div.cms .cms-toolbar-item-dark-mode-toggle {
    display: none !important;
}


/* ===================================================================
   7. Struktur-Modus Sidebar
   =================================================================== */

div.cms .cms-structure .cms-dragbar-title {
    color: #1a1a1a !important;
}

div.cms .cms-structure .cms-dragbar {
    border-left-color: #509e2f !important;
}

div.cms .cms-submenu-btn {
    color: #509e2f !important;
}