/*
 * BAISO – Admin-Vereinheitlichung & Abgrenzung (Quick-Win, REVERSIBEL)
 * ---------------------------------------------------------------------------
 * Rückbau in einem Schritt: im aktiven Template
 *   config/admin.baiso.de/template/page/default.html
 * die Klasse "baiso-admin-unify" vom <body> entfernen (oder diese Datei/den
 * <link> löschen) -> alle Regeln hier greifen dann nicht mehr.
 *
 * Alles ist unter body.baiso-admin-unify gescoped und additiv; es wird nichts
 * am bestehenden merged.css/baiso.css geändert.
 * ---------------------------------------------------------------------------
 */

/* --- Design-Tokens (eine Quelle fuer Marke + Admin-Akzent) --- */
:root {
    /* Marke (Kunde + Admin gemeinsam) */
    --baiso-primary:       #ee213e;   /* verbindlicher Rotton (De-facto im merged.css) */
    --baiso-primary-hover: #cc102a;
    --baiso-ink:           #333333;
    --baiso-bg-muted:      #f2f2f2;
    --baiso-space:         20px;

    /* NUR Admin: Abgrenzungs-/Signalfarbe */
    --admin-accent:        #14505c;   /* Petrol/Slate */

    /* gemeinsame Content-/Header-Breite (Vorgabe ~80%, wie Kundenbereich) */
    --baiso-content-width: 80%;
}

/* =========================================================================
 * Abgrenzung 1 – Akzentleiste ganz oben (volle Breite)
 * ========================================================================= */
body.baiso-admin-unify {
    border-top: 5px solid var(--admin-accent);
}

/* =========================================================================
 * Abgrenzung 2 – "Adminbereich"-Badge im Header (Markup im Template)
 * ========================================================================= */
body.baiso-admin-unify .baiso-admin-badge {
    display: inline-block;
    margin-left: 12px;
    padding: 3px 12px;
    background: var(--admin-accent);
    color: #fff;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 3px;
    vertical-align: middle;
    white-space: nowrap;
}

/* =========================================================================
 * Abgrenzung 3 – Favicon (SVG) + Abgrenzung 4 – <title>-Praefix
 *   werden im Template gesetzt (kein CSS noetig).
 * ========================================================================= */

/* =========================================================================
 * Breite – Header UND Content auf gemeinsame Breite (~80%, zentriert)
 *   Damit Kopfzeile (Logo/Logout/Nav) und Inhalt buendig sind.
 *   !important, weil Bootstrap/merged.css die .container-Breite setzen.
 * ========================================================================= */
body.baiso-admin-unify #page-header .container,
body.baiso-admin-unify #page-content .container {
    width: var(--baiso-content-width) !important;
    max-width: var(--baiso-content-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Hinweis: Navigation im Kundenbereich-Stil (helles Band, linksbuendig) wurde
 * bewusst NICHT umgesetzt – die bestehende Navbar (Bootstrap-Collapse) reagierte
 * darauf fehlerhaft (nur graue Leiste). Groesserer Umbau, spaeter separat. */

/* =========================================================================
 * Startseite – Boxen exakt im Kundenbereich-Stil (everblock* / baisoNews)
 *   Uebernommen aus dem Kundenbereich (Frontend), hier unter .baiso-admin-unify
 *   gescoped. Markup wird in config/admin.baiso.de/page/startpage.php erzeugt.
 * ========================================================================= */
body.baiso-admin-unify .everblockdivContainer {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    gap: 20px;
    width: 100%;
    margin-top: 20px;
    padding-bottom: 20px;
}
body.baiso-admin-unify .everblockdivContainer .everblockdiv {
    flex: 0 1 48%;
    max-width: 48%;
    width: 48%;
    margin: 0 0 20px 0;
    padding: 0;
    overflow: hidden;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #ddd;
    box-shadow: 0 4px 24px rgba(60, 60, 90, 0.08);
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.3s, transform 0.3s;
}
body.baiso-admin-unify .everblockdivContainer .everblockdiv:hover {
    box-shadow: 0 8px 32px rgba(60, 60, 90, 0.16);
    transform: scale(1.01);
}
body.baiso-admin-unify .everblockdivContainer .everblockdiv:last-child {
    flex: 0 1 97%;
    max-width: 97%;
    width: 97% !important;
    margin: 0 5px 20px 5px;
}
body.baiso-admin-unify .everblockdivContainer .everblockdiv .everblockh1 {
    font-weight: 500;
    width: 100%;
    max-width: 100%;
    border-radius: 5px;
    color: #fff;
    background-color: #c00d0e;
    border-color: #c00d0e;
    padding: 9.55px 20px;
    font-size: 1em !important;
    margin: 0;
    text-align: center;
    text-decoration: none;
    display: block;
}
body.baiso-admin-unify .everblockdivContainer .everblockdiv .everblockh1 a {
    color: inherit;
    text-decoration: none;
    display: block;
    transition: background-color 0.2s ease;
}
body.baiso-admin-unify .everblockdivContainer .everblockdiv .everblockh1:hover {
    background-color: #9c0b0b;
    color: #fff;
}
body.baiso-admin-unify .everblockdiv > div {
    background-color: #f8f9fa;
    padding: 18px 20px 16px 20px;
    border: none;
    box-shadow: none;
    border-radius: 0 0 12px 12px;
    font-size: 1.05em;
    min-height: 120px;
}
body.baiso-admin-unify .baisoNews {
    background: none;
    border-radius: 0;
    margin-bottom: 18px;
    padding-bottom: 0;
    box-shadow: none;
}
body.baiso-admin-unify .baisoNews:last-of-type {
    border-bottom: none;
    margin-bottom: 0;
}
body.baiso-admin-unify .baisoNews p:first-of-type {
    font-size: 0.92em;
    color: #666;
    margin: 0 0 4px 0;
}
body.baiso-admin-unify .baisoNews b {
    display: block;
    margin-bottom: 7px;
    font-size: 1.08em;
}
body.baiso-admin-unify .baisoNews a {
    text-decoration: none;
    color: #c00d0e;
    font-weight: 500;
    font-size: 1rem;
    transition: color 0.2s;
}
body.baiso-admin-unify .baisoNews a:hover {
    text-decoration: underline;
    color: #9c0b0b;
}
body.baiso-admin-unify .baisoNews p {
    margin: 0;
    line-height: 1.6;
    color: #333;
}
body.baiso-admin-unify .baisoNews p a {
    font-weight: normal;
    font-size: 0.98em;
}
body.baiso-admin-unify .everblockdiv > div > a {
    display: inline-block;
    text-decoration: none !important;
    color: #c00d0e !important;
    margin-top: 10px;
    font-size: 0.98em;
    font-weight: 500;
    transition: color 0.2s;
}
body.baiso-admin-unify .everblockdiv > div > a:hover {
    color: #9c0b0b;
    text-decoration: underline !important;
}
@media (max-width: 900px) {
    body.baiso-admin-unify .everblockdivContainer .everblockdiv,
    body.baiso-admin-unify .everblockdivContainer .everblockdiv:last-child {
        flex: 1 1 100%;
        max-width: 100%;
        width: 100% !important;
        margin: 0 0 20px 0;
    }
    body.baiso-admin-unify .everblockdivContainer {
        gap: 18px;
    }
}

/* =========================================================================
 * Tabellen-Aktionsbuttons (edit/delete/copy/pdf/print/up/down) im
 * Kundenbereich-Stil: weisser Hintergrund, Umrandung, Hover-Effekt,
 * einheitliche Icon-Groesse + Abstand. Die Icons selbst kommen weiter aus
 * tableview.css/baiso.css (::after) – hier nur Rahmen/Groesse/Hover.
 * Hohe Spezifitaet noetig, weil tableview.css per addCSS NACH dieser Datei
 * geladen wird (Quellreihenfolge -> Spezifitaet gewinnt).
 * ========================================================================= */
body.baiso-admin-unify .tabelview-editformbutton,
body.baiso-admin-unify .tabelview-deleteformbutton,
body.baiso-admin-unify .tabelview-copyformbutton,
body.baiso-admin-unify .tabelview-pdfformbutton,
body.baiso-admin-unify .tabelview-printformbutton,
body.baiso-admin-unify .tabelview-upformbutton,
body.baiso-admin-unify .tabelview-downformbutton {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    margin: 0 4px 0 0;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    cursor: pointer;
    vertical-align: middle;
    transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
}
body.baiso-admin-unify .tabelview-editformbutton:hover,
body.baiso-admin-unify .tabelview-deleteformbutton:hover,
body.baiso-admin-unify .tabelview-copyformbutton:hover,
body.baiso-admin-unify .tabelview-pdfformbutton:hover,
body.baiso-admin-unify .tabelview-printformbutton:hover,
body.baiso-admin-unify .tabelview-upformbutton:hover,
body.baiso-admin-unify .tabelview-downformbutton:hover {
    background: #f2f2f2;
    border-color: #c00d0e;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}
/* Icon (::after) einheitlich normieren/zentrieren, egal welche Basis-CSS aktiv ist */
body.baiso-admin-unify .tabelview-editformbutton::after,
body.baiso-admin-unify .tabelview-deleteformbutton::after,
body.baiso-admin-unify .tabelview-copyformbutton::after,
body.baiso-admin-unify .tabelview-printformbutton::after,
body.baiso-admin-unify .tabelview-upformbutton::after,
body.baiso-admin-unify .tabelview-downformbutton::after {
    margin: 0 !important;
    padding: 0 !important;
    width: 25px;
    height: 25px;
    background-size: 25px 25px !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    line-height: 0;
}

/* Aktionsspalte: keine Sortier-Pfeile (DataTables 2.x order-Icon) + kein Sortier-Cursor.
 * Die eigentliche Deaktivierung passiert per columnDefs (js/table.js, Klasse no-sort). */
body.baiso-admin-unify th.no-sort {
    cursor: default;
}
body.baiso-admin-unify th.no-sort .dt-column-order {
    display: none !important;
}

/* =========================================================================
 * DataTables-FOUC vermeiden (v. a. Betriebsanweisungen): die serverseitig
 * voll gerenderte Tabelle erst zeigen, wenn DataTables fertig ist. Die Klasse
 * .dt-ready wird in js/table.js im initComplete gesetzt (+ Timeout-Fallback,
 * damit die Tabelle nie dauerhaft verborgen bleibt). opacity statt display,
 * damit der Platz reserviert bleibt (kein zusaetzlicher Reflow).
 * ========================================================================= */
body.baiso-admin-unify .myDataTable {
    opacity: 0;
}
body.baiso-admin-unify .myDataTable.dt-ready {
    opacity: 1;
    transition: opacity 0.12s ease;
}
