/*----------------------------------------------------------------------------
    Taxflix – projektspezifische Styles (Ticket #2310)
    Grundlage ist das deubnerpublish-Design. Hier wird nur per CSS angepasst,
    Farben kommen aus dem Theme (deubnerpublish themes/theme-taxflix.css).
    Wird nach allen Paket-Stylesheets geladen (config produkt.productCSS).
----------------------------------------------------------------------------*/

/* Schriften lokal, wie in dp_post-bote abgelegt */
@import url("fonts/Poppins/style.css");
@import url("fonts/OpenSans/open-sans.css");

:root {
    --tfx-font-text:        'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
    --tfx-font-headline:    'Poppins', "Helvetica Neue", Helvetica, Arial, sans-serif;
    /* Hover zu Dunkeltürkis (CD nennt keinen eigenen Wert) */
    --tfx-tuerkis-hover:    #476e6e;
    /* Eckenradien laut CD: kleine Elemente 6-8, Buttons 8-12, Karten 12-16, Flächen 16-24 */
    --tfx-radius-klein:     8px;
    --tfx-radius-button:    10px;
    --tfx-radius-karte:     14px;
    --tfx-radius-flaeche:   20px;
}

/*----------------------------------------------------------------------------
    Typografie: Open Sans für Fließtext, Poppins für Überschriften, Navigation, Buttons
----------------------------------------------------------------------------*/
body {
    font-family: var(--tfx-font-text);
    color: var(--tfx-grau-dunkel);
    background: var(--tfx-tuerkis-hell);
}
h1, h2, h3, h4, h5, h6,
.navbar, .nav-link, .btn, .breadcrumb, .dropdown-menu {
    font-family: var(--tfx-font-headline);
}
h1, h2, h3 {
    font-weight: 700;
    color: var(--color-primary-dark);
}
::selection {
    background: var(--color-primary);
    color: #000;
}

/* Links und Flächen mit weißer Schrift in Dunkeltürkis: auf Türkis #79bcbc wäre weiße bzw. türkise
   Schrift auf Weiß zu kontrastarm */
a {
    color: var(--color-primary-dark);
}
a:focus, a:hover {
    color: var(--tfx-tuerkis-hover);
}
.color,
.coloractive,
.btn-primary {
    background: var(--color-primary-dark) !important;
    border-color: var(--color-primary-dark) !important;
}
.color:hover,
.btn-primary:hover {
    background: var(--tfx-tuerkis-hover) !important;
    border-color: var(--tfx-tuerkis-hover) !important;
}
.color-invert {
    color: var(--color-primary-dark) !important;
}

/* Aktionsfarbe Orange für Bestell-Buttons (CTA) */
.bestellbutton {
    background: var(--tfx-orange) !important;
    border-color: var(--tfx-orange) !important;
    color: #000 !important;
}
.bestellbutton:hover,
.bestellbutton:focus {
    background: var(--tfx-orange-dark) !important;
    border-color: var(--tfx-orange-dark) !important;
    color: #fff !important;
}

/*----------------------------------------------------------------------------
    Kopfbereich, Logo, Navigation
----------------------------------------------------------------------------*/
.headerline {
    background: var(--tfx-grau-hell);
}
h1.logo, div.logo {
    background: url("images/taxflix-logo.png") no-repeat left center / contain transparent;
    border-radius: 0;
    width: 220px;
    height: 56px;
    margin: 0 10px 0 0;
}
.sitename {
    color: var(--color-primary-dark);
    text-transform: none;
}
.navbar .container-fluid {
    background: var(--color-primary-dark);
}
.navbar .nav-link.color {
    color: #fff !important;
}
.navbar .nav-link.color:hover,
.navbar .nav-link.coloractive {
    background: var(--tfx-tuerkis-hover) !important;
}

/*----------------------------------------------------------------------------
    Formen: abgerundete Ecken
----------------------------------------------------------------------------*/
.btn {
    border-radius: var(--tfx-radius-button);
}
.btn-sm {
    border-radius: var(--tfx-radius-klein);
}
.form-control, .form-select, .dropdown-menu, .badge, .alert, .list-group {
    border-radius: var(--tfx-radius-klein);
}
.input-group > .form-control:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.input-group > .btn:last-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.card, .modal-content, .accordion {
    border-radius: var(--tfx-radius-karte);
}
.card > .card-img-top, .card > img:first-child,
.card > a:first-child > .card-img-top, .card > a:first-child > img {
    /* Nutzer-Fund 02.11.2026: Karten mit verlinktem Bild (z.B. Dateien ohne dokumenttyp=download,
       die zum Dokument verlinken) hatten eckige statt abgerundete obere Ecken — die urspruengliche
       Selektor-Fassung (".card > .card-img-top") griff nur, wenn das Bild DIREKTES Kind der Karte
       ist, nicht wenn es zusaetzlich in <a> gewrappt ist. */
    border-top-left-radius: var(--tfx-radius-karte);
    border-top-right-radius: var(--tfx-radius-karte);
}

/*----------------------------------------------------------------------------
    Footer
----------------------------------------------------------------------------*/
.footercontainer {
    background: var(--tfx-grau-hell);
}
/* Taxflix-Footer (deubnerpublish layouts.snippets.footer_taxflix): höher als der Standard-Footer,
   deshalb im Seitenfluss statt absolut mit festem margin-bottom am body; bleibt per Flex trotzdem unten */
body:has(.tfx-footer) {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    margin-bottom: 0 !important;
}
.tfx-footer {
    position: static;
    margin-top: auto;
    padding-top: 10px;
}
.tfx-footer .tfx-concierge {
    margin: 10px 0;
}
.tfx-footer .nav-link {
    color: var(--tfx-grau-dunkel);
    padding: 4px 16px 4px 0;
}
.tfx-footer .nav-link:hover {
    color: var(--color-primary-dark);
}
a.tfx-logofooter {
    display: block;
    width: 160px;
    height: 40px;
    margin: 15px 0 0 0;
    background: url("images/taxflix-logo.png") no-repeat left center / contain;
    text-indent: -9999px;
    overflow: hidden;
}
.tfx-footer .copyright {
    margin: 8px 0 10px 0;
    font-family: var(--tfx-font-text);
    font-style: normal;
}

/*----------------------------------------------------------------------------
    Rechtstexte (static/impressum, static/datenschutz, static/agb)
----------------------------------------------------------------------------*/
.tfx-rechtstext {
    background: #fff;
    border-radius: var(--tfx-radius-flaeche);
    padding: 30px;
}
.tfx-rechtstext h1 {
    margin-bottom: 1.5rem;
}
.tfx-rechtstext h2 {
    font-size: 1.25rem;
    margin-top: 1.75rem;
}
.tfx-rechtstext p, .tfx-rechtstext li {
    line-height: 1.6;
}
@media (max-width: 575.98px) {
    .tfx-rechtstext {
        padding: 16px;
        border-radius: var(--tfx-radius-karte);
    }
}

/*----------------------------------------------------------------------------
    Concierge-Box (static/snippets/concierge-box), nach videos.taxflix.live/impressum
----------------------------------------------------------------------------*/
.tfx-concierge {
    display: block;
    position: relative;
    background: #fff;
    padding: 20px;
    margin-top: 1px;
    margin-bottom: 20px;
    border: 1px solid #ececec;
    overflow: hidden;
    text-align: left;
}
.tfx-concierge-img {
    display: inline-block;
    width: 100%;
    max-width: 150px;
}
.tfx-concierge-img img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    border-radius: 150px;
}
.tfx-concierge h2 {
    margin: 0 0 20px 0;
    padding-top: 0;
    font-family: var(--tfx-font-headline);
    font-size: 26px;
    line-height: 36px;
    font-weight: 700;
    color: var(--color-primary) !important;
    text-transform: none;
}
.tfx-concierge p {
    font-size: 14px;
}
.tfx-social-media a {
    text-decoration: none;
}
.tfx-social-media .tfx-circle {
    display: inline-block;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    font-size: 17px;
    border-radius: 34px;
    margin: 0 4px 4px 0;
    background: #587f9e;
    color: #fff;
    transition-duration: 300ms;
}
.tfx-social-media .tfx-circle::before {
    vertical-align: -0.125em;
}
.tfx-social-media .tfx-circle:hover {
    transition-duration: 300ms;
    opacity: .8;
}
.tfx-social-media .tfx-globe,
.tfx-social-media .tfx-envelope,
.tfx-social-media .tfx-phone {
    background: var(--color-primary);
    color: #000;
}
.tfx-social-media .tfx-instagram {
    background: #ed4956;
    color: #fff;
}
.tfx-social-media .tfx-linkedin {
    background: #0077b5;
    color: #fff;
}
@media (max-width: 767.98px) {
    .tfx-concierge:not(.tfx-concierge-kompakt) .tfx-concierge-img {
        margin-bottom: 15px;
    }
}
/* kompakte Variante (z. B. im Footer) */
.tfx-concierge-kompakt {
    padding: 12px 15px;
    border-radius: var(--tfx-radius-karte);
}
.tfx-concierge-kompakt .tfx-concierge-img {
    max-width: 80px;
}
.tfx-concierge-kompakt h2 {
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 6px;
}
.tfx-concierge-kompakt p {
    font-size: 13px;
    margin-bottom: 8px;
}
.tfx-concierge-kompakt .tfx-social-media .tfx-circle {
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 15px;
}

/*----------------------------------------------------------------------------
    Bestehende Regeln
----------------------------------------------------------------------------*/
div.order_login table.order_login tr td.left div.stoerer { background: transparent url('images/60tageteste.png') no-repeat scroll right 10px; position: absolute; right: 0px; top: -50px; width: 130px; height: 130px; }

/*----------------------------------------------------------------------------
    Paywall-Text (#2443, resources/views/snippets/paywalltext.blade.php)
    Nach taxflix.live (Preismodell, Programm, Referenten), aber kleiner
----------------------------------------------------------------------------*/
.tfx-paywall {
    margin-bottom: 20px;
}
.tfx-paywall-abschnitt {
    background: #fff;
    border-radius: var(--tfx-radius-karte);
    padding: 20px;
    margin-bottom: 16px;
}
.tfx-paywall-ueberzeile {
    font-family: var(--tfx-font-headline);
    font-size: 1rem;
    color: #7a7a7a;
    text-decoration: overline;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.tfx-paywall .tfx-paywall-titel {
    font-size: 1.5rem;
    line-height: 1.25;
    margin: 2px 0 0 0;
    color: var(--tfx-grau-dunkel);
}
.tfx-paywall-strich {
    width: 48px;
    border-top: 6px solid var(--color-primary-dark);
    margin: 10px 0 12px 0;
}
.tfx-paywall-lead {
    font-size: 1.05rem;
    margin-bottom: 12px;
}
.tfx-paywall-preis {
    font-family: var(--tfx-font-headline);
    font-size: 4.5rem;
    font-weight: 700;
    line-height: 1;
    color: var(--tfx-orange);
}
.tfx-paywall-preis-text {
    font-size: .9rem;
    color: #7a7a7a;
}
.tfx-paywall-saeule {
    height: 100%;
    background: var(--tfx-orange);
    color: #000;
    border-radius: var(--tfx-radius-karte);
    padding: 12px 14px;
}
.tfx-paywall .tfx-paywall-saeule h3 {
    font-size: 1.05rem;
    font-weight: 700;
    color: #000;
    margin-bottom: 4px;
}
.tfx-paywall-saeule p {
    font-size: .9rem;
    margin: 0;
}
/* Download-Knopf wie "Zum Programm" auf taxflix.live: Rot-Orange, Versalien */
.tfx-btn-programm {
    background: var(--tfx-orange-dark);
    border-color: var(--tfx-orange-dark);
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.tfx-btn-programm:hover,
.tfx-btn-programm:focus {
    background: var(--color-primary-dark);
    border-color: var(--color-primary-dark);
    color: #fff;
}
.tfx-btn-programm .bi {
    margin-right: 6px;
}
.tfx-paywall-referenten {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 0;
}
.tfx-paywall-referenten li {
    background: var(--tfx-tuerkis-hell);
    border-radius: var(--tfx-radius-klein);
    padding: 3px 10px;
    font-size: .85rem;
}