/* ================================================================
   nuSport – Theme: Bayerischer Billardverband (BBV)
   ----------------------------------------------------------------
   Primärfarben aus Logo und Homepage (https://billardbayern.de/):
     Petrol        #1e7a8c = rgb(30, 122, 140)  — Links, Buttons
     Dunkel-Navy   #042551 = rgb(4, 37, 81)      — Header-Hintergrund
   Das Signalgrün des Logo-Rings wird bewusst nicht als UI-Farbe
   verwendet (Nutzerwunsch: Petrol statt giftigem Grün).
   ----------------------------------------------------------------
   Nur Farben, Schriften und visuelle Tokens – keine Layout-Regeln.
   ================================================================ */


/* ── 1. Verbandsfarben ─────────────────────────────────────────── */
:root {
    /* Petrol – BBV-Primärfarbe */
    --primary:        #1e7a8c;
    --primary-rgb:    30, 122, 140;
    --primary-light:  #d4edf1;

    /* Dunkleres Petrol für Hover-Zustände */
    --accent:         #155f6e;

    /* Header: dunkles Navy (professionell, guter Kontrast) */
    --header-bg:      #1e7a8c;
    --header-color:   #ffffff;

    /* Tab-Navigation: mittleres Petrol */
    --tabs-bg:        #1a6879;

    /* Hintergründe: neutral-hell */
    --bg:             #f5f7fa;
    --card:           #ffffff;

    /* Typografie */
    --text:           #1f2937;
    --text-muted:     #555555;
    --text-light:     #777777;

    /* Strukturelles */
    --border:         #e0e4ea;
    --radius:         8px;
    --shadow:         0 2px 10px rgba(30, 122, 140, 0.12);

    /* Schrift: System-Default */
    --font:           system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

    /* Links */
    --link-color:     var(--primary);
    --link-hover:     var(--accent);

    /* Oberfläche */
    --surface:        var(--card);
}


/* ── 2. Bootstrap-Variablen ────────────────────────────────────── */
:root {
    --bs-primary:                           var(--primary);
    --bs-primary-rgb:                       var(--primary-rgb);

    --bs-link-color:                        var(--link-color);
    --bs-link-color-rgb:                    var(--primary-rgb);
    --bs-link-hover-color:                  var(--link-hover);

    --bs-body-font-family:                  var(--font);
    --bs-body-color:                        var(--text);
    --bs-body-bg:                           var(--bg);

    --bs-border-color:                      var(--border);
    --bs-border-radius:                     var(--radius);
    --bs-border-radius-sm:                  calc(var(--radius) * 0.6);
    --bs-border-radius-lg:                  calc(var(--radius) * 1.4);

    --bs-card-bg:                           var(--card);
    --bs-card-border-color:                 var(--border);
    --bs-card-box-shadow:                   var(--shadow);

    --bs-table-striped-bg:                  var(--primary-light);
    --bs-table-hover-bg:                    rgba(var(--primary-rgb), 0.05);

    --bs-nav-tabs-border-color:             var(--border);
    --bs-nav-tabs-link-hover-border-color:  var(--border) var(--border) transparent;
    --bs-nav-tabs-link-active-color:        var(--primary);
    --bs-nav-tabs-link-active-bg:           var(--card);
    --bs-nav-tabs-link-active-border-color: var(--primary) var(--primary) var(--card);

    --bs-danger:                            #dc3545;
    --bs-danger-rgb:                        220, 53, 69;

    --bs-focus-ring-color:                  rgba(var(--primary-rgb), 0.25);
}


/* ── 3. Verbandslogo ────────────────────────────────────────────── */
/* BBV-Logo: 160×160 px (quadratisch, kreisförmig)                  */
/* Auf dem dunklen Navy-Header gut sichtbar – kein weißer Chip nötig */
#logo a::before {
    content:             "";
    display:             block;
    background-image:    url("../../img/logos/billardde/logo-bbv.png");
    background-size:     contain;
    background-repeat:   no-repeat;
    background-position: center center;
    width:               3rem;    /* quadratisches Logo */
    height:              3rem;
}



/* ── 4. Elemente auf dunklem Navy-Header ────────────────────────── */
#header a,
#header button,
#hamburger-btn             { color: var(--header-color, #ffffff); }

/* Tab-Navigation auf blauem Hintergrund */
#tabs .nav-link            { color: rgba(255, 255, 255, 0.85); }
#tabs .nav-link:hover      { color: #ffffff; background: rgba(255, 255, 255, 0.1); }
#tabs .nav-link.active     { color: #ffffff; background: rgba(255, 255, 255, 0.15);
                             border-color: rgba(255,255,255,0.2) rgba(255,255,255,0.2) transparent; }


/* ── 5. Farbgebung struktureller Elemente ───────────────────────── */
a                              { color: var(--link-color); }
a:hover                        { color: var(--link-hover); }

legend                         { color: var(--primary); }

#sidebar strong                { color: var(--text-light); }
#sidebar a                     { color: var(--text); }
#sidebar a:hover,
#sidebar a.active              { background: var(--primary-light); color: var(--primary); }

nav[aria-label="breadcrumb"]   { background: rgba(0, 0, 0, 0.03); }
.breadcrumb-item,
.breadcrumb-item a             { font-size: 0.82rem; color: var(--text-light); }
.breadcrumb-item a:hover       { color: var(--primary); }
.breadcrumb-item.active        { color: var(--text-light); opacity: 0.75; }

#footer                        { color: var(--text-light); background: var(--card); }
#footer a                      { color: var(--primary); }

#breadcrumb                    { color: var(--text-light); background: #f0f2f5; border-color: var(--border); }

input[type="submit"],
button[type="submit"]          { background: var(--primary); color: #ffffff; }
input[type="submit"]:hover,
button[type="submit"]:hover    { background: var(--accent); color: #ffffff; }

input:focus,
select:focus,
textarea:focus                 { border-color: var(--primary) !important;
                                 box-shadow: 0 0 0 0.2rem rgba(var(--primary-rgb), 0.2) !important; }

th {
    background: var(--primary-light);
    border-bottom: 2px solid rgba(var(--primary-rgb), 0.35);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--text);
}

tr:hover td                    { background: rgba(var(--primary-rgb), 0.04); }



/* ── PDF-Links ──────────────────────────────────────────────── */
/* SVG-Farbe auf BBV-Petrol angepasst (%231e7a8c) */
.picto-pdf::before {
    content: "";
    display: inline-block;
    width: 0.95em;
    height: 0.95em;
    margin-right: 0.3em;
    vertical-align: -0.12em;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%231e7a8c' d='M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2M9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5v1.5z'/%3E%3Cpath fill='%231e7a8c' d='M4.603 14.087a.81.81 0 0 1-.438-.42c-.195-.388-.13-.776.08-1.102.198-.307.526-.568.897-.787a7.68 7.68 0 0 1 1.482-.645 19.7 19.7 0 0 0 1.062-2.227 7.27 7.27 0 0 1-.43-1.295c-.086-.4-.119-.796-.046-1.136.075-.354.274-.672.65-.823.192-.077.4-.12.602-.077a.7.7 0 0 1 .477.365c.088.164.12.356.127.538.007.188-.012.396-.047.614-.084.51-.27 1.134-.52 1.794a10.954 10.954 0 0 0 .98 1.686 5.75 5.75 0 0 1 1.334.05c.364.066.734.195.96.465.12.144.193.32.2.518.007.192-.047.382-.138.563a1.04 1.04 0 0 1-.354.416.856.856 0 0 1-.51.138c-.331-.014-.654-.196-.933-.417a5.71 5.71 0 0 1-.911-.95 11.65 11.65 0 0 0-1.997.406 11.31 11.31 0 0 1-1.02 1.51c-.292.35-.609.656-.927.787a.793.793 0 0 1-.58.029z'/%3E%3C/svg%3E");
}