/* =============================================================
   Indico Customization — wertpapierfirmen.org
   Konsolidiert aus corporate-identity.css + style.css
   
   Corporate Colors:
     Rot    : rgba(153,14,41,1)   = #990e29
     Grau   : rgba(160,165,168,1) = #a0a5a8
     Blau   : rgba(0,69,137,1)    = #004589
     Petrol : rgba(0,104,128,1)   = #006880
   ============================================================= */

/* ── 1. SCHRIFTEN ─────────────────────────────────────────── */
@font-face {
    font-family: "TheSansC5-Light";
    src: url("https://wertpapierfirmen.org/fileadmin/bwf-verband.de/sitedesign/Style/fonts/TheSansC5-3_Light/TheSansC5-3_Light.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "TheSansC5-Bold";
    src: url("https://wertpapierfirmen.org/fileadmin/bwf-verband.de/sitedesign/Style/fonts/TheSansC5-7_Bold/TheSansC5-3_Bold.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "TheSansC5-Bold-Italic";
    src: url("https://wertpapierfirmen.org/fileadmin/bwf-verband.de/sitedesign/Style/fonts/TheSansC5-7iBoldItalic/TheSansC5-7iBoldItalic.woff2") format("woff2");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

/* ── 2. CSS VARIABLEN (Corporate Colors) ─────────────────── */
:root {
    --color-red:        rgba(153, 14, 41, 1);
    --color-red-50:     rgba(153, 14, 41, 0.5);
    --color-red-30:     rgba(153, 14, 41, 0.33);
    --color-grey:       rgba(160, 165, 168, 1);
    --color-grey-50:    rgba(160, 165, 168, 0.5);
    --color-grey-30:    rgba(160, 165, 168, 0.33);
    --color-blue:       rgba(0, 69, 137, 1);
    --color-blue-50:    rgba(0, 69, 137, 0.5);
    --color-blue-30:    rgba(0, 69, 137, 0.33);
    --color-petrol:     rgba(0, 104, 128, 1);
    --color-petrol-50:  rgba(0, 104, 128, 0.5);
    --color-petrol-30:  rgba(0, 104, 128, 0.33);
    --font-light:       "TheSansC5-Light", Verdana, sans-serif;
    --font-bold:        "TheSansC5-Bold", Verdana, sans-serif;
    --font-bold-italic: "TheSansC5-Bold-Italic", Verdana, sans-serif;
    --font-features:    "kern" 1, "liga" 1, "calt" 1, "locl" 1;
}

/* ── 3. TYPOGRAFIE ───────────────────────────────────────── */
body, p, div, td, th, li, span, input, select, textarea, button {
    font-family: var(--font-light) !important;
    font-feature-settings: var(--font-features);
}

p {
    font-weight: 100;
    font-size: 1rem;
    line-height: 1.65rem;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-bold) !important;
    color: var(--color-red);
}

h1 { margin-bottom: 2rem; }

article h2 {
    font-family: var(--font-bold-italic) !important;
    font-weight: 100;
    font-size: 1.3rem;
    line-height: 2rem;
}

/* ── 4. LINKS ────────────────────────────────────────────── */
a, p a {
    color: var(--color-red) !important;
    text-decoration: underline;
}
a:hover {
    color: rgba(100, 9, 27, 1) !important;
}

/* ── 5. INDICO HEADER & NAVIGATION ───────────────────────── */
#header {
    background-color: #ffffff !important;
    border-bottom: 2px solid var(--color-red-30) !important;
}

.toolbar, .toolbars {
    border-bottom: 1px solid var(--color-red-30) !important;
}

/* ── 6. BUTTONS ──────────────────────────────────────────── */
[type=button], [type=reset], [type=submit], button,
.i-button.accept, .i-button.highlight,
.btn-custom {
    background: var(--color-red) !important;
    border: none !important;
    color: white !important;
    font-size: 1.2rem;
    border-radius: 5px;
    padding: .3rem 1rem;
    margin-top: 1rem;
}
[type=button]:hover, [type=reset]:hover, [type=submit]:hover, button:hover,
.i-button.accept:hover, .i-button.highlight:hover,
.btn-custom:hover {
    background: var(--color-grey) !important;
    color: var(--color-red) !important;
}

.btn-custom-light { background: var(--color-red-50) !important; color: white !important; }
.btn-custom-light:hover { background: var(--color-grey) !important; color: var(--color-red) !important; }

.btn-petrol { background: var(--color-petrol) !important; color: white !important; }
.btn-petrol:hover { background: var(--color-grey) !important; color: var(--color-red) !important; }

.btn-petrol-light { background: var(--color-petrol-50) !important; color: white !important; }
.btn-petrol-light:hover { background: var(--color-grey) !important; color: var(--color-red) !important; }

.btn-blue { background: var(--color-blue) !important; color: white !important; }
.btn-blue:hover { background: var(--color-grey) !important; color: var(--color-red) !important; }

.btn-blue-light { background: var(--color-blue-50) !important; color: white !important; }
.btn-blue-light:hover { background: var(--color-grey) !important; color: var(--color-red) !important; }

.btn-custom-grey { background: rgba(151,153,155,1) !important; color: white !important; }
.btn-custom-grey:hover { background: var(--color-grey) !important; color: var(--color-red) !important; }

/* ── 7. HILFSKLASSEN (Corporate Color Backgrounds) ───────── */
.red-bg    { background: var(--color-red); }
.red-bg-50 { background: var(--color-red-50); }
.red-bg-30 { background: var(--color-red-30); }

.grey-bg    { background: var(--color-grey); }
.grey-bg-50 { background: var(--color-grey-50); }
.grey-bg-30 { background: var(--color-grey-30); }

.blue-bg    { background: var(--color-blue); }
.blue-bg-50 { background: var(--color-blue-50); }
.blue-bg-30 { background: var(--color-blue-30); }

.petrol-bg    { background: var(--color-petrol); }
.petrol-bg-50 { background: var(--color-petrol-50); }
.petrol-bg-30 { background: var(--color-petrol-30); }

/* ── 8. TABELLEN ─────────────────────────────────────────── */
table thead th, .i-table thead th {
    background-color: rgba(153,14,41,0.08) !important;
    color: var(--color-red) !important;
    border-bottom: 2px solid var(--color-red-30) !important;
}

/* ── 9. TRENNLINIEN / BORDERS ────────────────────────────── */
hr, .separator, article, .border-bottom {
    border-color: var(--color-red-30) !important;
}

article {
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--color-red-30) !important;
}

/* ── 10. REGISTRIERUNGSFORMULAR ──────────────────────────── */
.regform-section-title {
    color: var(--color-red) !important;
    border-bottom: 2px solid var(--color-red-30) !important;
    font-family: var(--font-bold) !important;
}

/* ── 11. DATUM / METADATEN ───────────────────────────────── */
.date, .event-date, .item-date {
    color: var(--color-grey) !important;
}

/* ── 12. ACCORDION ───────────────────────────────────────── */
.accordion-button:not(.collapsed) {
    color: unset;
    background-color: var(--color-grey-30);
    box-shadow: inset 0 -1px 0 rgb(0 0 0 / 13%);
}

/* ── 13. FOOTER ──────────────────────────────────────────── */
#footer, footer {
    border-top: 1px solid var(--color-red-30) !important;
    text-align: center;
    font-weight: 100;
    color: #212529;
    padding: 1rem;
    margin-top: auto;
}
footer a, #footer a { color: #212529; }
footer a:hover, #footer a:hover { color: #212529; text-decoration: none; }