/*
Theme Name:   Fotoklub Hartkirchen
Theme URI:    https://fotoklub-hartkirchen.at
Description:  Child Theme für Fotoklub Hartkirchen – basiert auf Hello Elementor.
              Entwickelt von Nordlicht GmbH (studio-nordlicht.com).
Author:       Nordlicht GmbH
Author URI:   https://studio-nordlicht.com
Template:     hello-elementor
Version:      1.0.0
Requires at least: 6.2
Tested up to:      6.7
Requires PHP:      8.0
License:      Privat – Alle Rechte vorbehalten
Text Domain:  fotoklub-hartkirchen
Tags:         photography, community, elementor, child-theme
*/

/*
 ╔══════════════════════════════════════════════════════════════════╗
 ║  DESIGN TOKENS — Alle Design-Werte zentral hier setzen.         ║
 ║  Änderungen NUR in diesen Variablen → wirkt überall durch.      ║
 ╚══════════════════════════════════════════════════════════════════╝
*/
:root {

    /* ─── Farbpalette ─────────────────────────────────────────── */
    --fk-dark:           #111111;   /* Tiefschwarz  – Haupthintergrund */
    --fk-dark-soft:      #1C1C1C;   /* Dunkelgrau   – Cards, Sektionen */
    --fk-dark-muted:     #2A2A2A;   /* Mittelgrau   – Borders auf Dunkel */

    --fk-gold:           #C9A84C;   /* Warmgold     – Primärakzent */
    --fk-gold-light:     #DFC07A;   /* Goldton hell – Hover, Highlights */
    --fk-gold-dark:      #A8873C;   /* Goldton dunkel – Active States */

    --fk-warm-white:     #F8F5EF;   /* Warmes Weiß  – Helle Sections */
    --fk-white:          #FFFFFF;

    --fk-text-dark:      #1A1A1A;   /* Haupttext auf hellem Hintergrund */
    --fk-text-light:     #E8E4DC;   /* Haupttext auf dunklem Hintergrund */
    --fk-muted:          #7A7672;   /* Sekundärtext, Labels, Meta */
    --fk-border-dark:    #2E2E2E;   /* Rahmen / Trennlinien auf Dunkel */
    --fk-border-light:   #E0DDD6;   /* Rahmen / Trennlinien auf Hell */

    --fk-member:         #2D6A8A;   /* Mitgliederbereich – Akzentfarbe */
    --fk-member-dark:    #1D506A;   /* Mitgliederbereich – Hover */
    --fk-member-bg:      #F0F6FA;   /* Mitgliederbereich – Hintergrund */
    --fk-success:        #3A7D44;
    --fk-error:          #C0392B;

    /* ─── Typografie ───────────────────────────────────────────── */
    --fk-font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --fk-font-body:    'Lato', 'Helvetica Neue', Arial, sans-serif;

    --fk-size-xs:   0.6875rem;  /* 11px */
    --fk-size-sm:   0.875rem;   /* 14px */
    --fk-size-base: 1rem;       /* 16px */
    --fk-size-md:   1.125rem;   /* 18px */
    --fk-size-lg:   1.25rem;    /* 20px */
    --fk-size-xl:   1.5rem;     /* 24px */
    --fk-size-2xl:  2rem;       /* 32px */
    --fk-size-3xl:  2.625rem;   /* 42px */
    --fk-size-4xl:  3.5rem;     /* 56px */

    --fk-line-body:    1.7;
    --fk-line-heading: 1.2;

    /* ─── Abstände ─────────────────────────────────────────────── */
    --fk-sp-xs:  0.5rem;    /*  8px */
    --fk-sp-sm:  1rem;      /* 16px */
    --fk-sp-md:  2rem;      /* 32px */
    --fk-sp-lg:  4rem;      /* 64px */
    --fk-sp-xl:  6rem;      /* 96px */
    --fk-sp-2xl: 9rem;      /* 144px */

    /* ─── UI ────────────────────────────────────────────────────── */
    --fk-radius-sm:   4px;
    --fk-radius-md:   8px;
    --fk-radius-lg:   16px;
    --fk-radius-full: 9999px;
    --fk-transition:  0.28s ease;
    --fk-transition-slow: 0.5s ease;

    --fk-shadow-sm:  0 2px 8px rgba(0,0,0,0.10);
    --fk-shadow-md:  0 4px 24px rgba(0,0,0,0.14);
    --fk-shadow-lg:  0 8px 48px rgba(0,0,0,0.18);
    --fk-shadow-gold: 0 4px 20px rgba(201,168,76,0.25);

    --fk-container: 1240px;
    --fk-content:    780px;
}

/* ─── Elementor Global Color Bridge (Fallback, wird vom Kit überschrieben) ─ */
:root {
    --e-global-color-primary:   var(--fk-gold);
    --e-global-color-secondary: var(--fk-dark);
    --e-global-color-text:      var(--fk-text-dark);
    --e-global-color-accent:    var(--fk-member);
}

/* ─── Basis ─────────────────────────────────────────────────────────────── */
*, *::before, *::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: var(--fk-font-body);
    font-size: var(--fk-size-base);
    font-weight: 400;
    line-height: var(--fk-line-body);
    color: var(--fk-text-dark);
    background-color: var(--fk-white);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--fk-font-heading);
    line-height: var(--fk-line-heading);
    color: var(--fk-text-dark);
    margin-top: 0;
    font-weight: 700;
}

a {
    color: var(--fk-gold);
    text-decoration: none;
    transition: color var(--fk-transition);
}
a:hover {
    color: var(--fk-gold-dark);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* ─── Scrollbar (subtil, zum Theme passend) ──────────────────────────── */
::-webkit-scrollbar              { width: 6px; }
::-webkit-scrollbar-track        { background: var(--fk-dark-soft); }
::-webkit-scrollbar-thumb        { background: var(--fk-gold); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover  { background: var(--fk-gold-light); }

/* ─── Auswahl ──────────────────────────────────────────────────────────── */
::selection        { background: var(--fk-gold); color: var(--fk-dark); }
::-moz-selection   { background: var(--fk-gold); color: var(--fk-dark); }