/*
Theme Name: GeneratePress Child Atlas ship-tracking.net
Description: Atlas-design UI-overhaul 2026 (design-spec 02-08). Meertalig, taalbalk onder navigatie. Kleuren per design-spec sectie 3.
Template: generatepress
Version: 1.0.0
*/

:root {
    --brand:#f0a326;
    --brand-ink:#241300;
    --brand-soft:#fceedb;
    --bg:#ffffff;
    --surface:#f7f6f2;
    --ink:#1d2430;
    --muted:#616b79;
    --line:#e4e6ea;
    --radar-bg:#101a2c;
    --radar-ink:#f6d9a4;
    --radar-grid:rgba(240,163,38,.16);
    --radar-sweep:rgba(240,163,38,.45);
    --hd-bg:#0d1626;
    --hd-ink:#f1ecdf;
    --ft-bg:#0d1626;
    --ft-ink:#cfd4de;
    --radius:14px;
    --btn-radius:999px;
    --hero-bg:#0d1626;
}

/* Basis */
body { background: var(--bg); color: var(--ink); font-family: Inter, system-ui, sans-serif; }
a { color: var(--brand); }
h1, h2, h3, h4, .entry-title, .main-title { font-family: "Inter Tight", Inter, sans-serif; font-weight: 800; color: var(--ink); }

/* Donkere header + hero die doorloopt */
.site-header, .main-navigation { background-color: var(--hd-bg); color: var(--hd-ink); }
.main-title a, .site-description, .main-navigation .main-nav ul li a, .main-navigation .menu-toggle { color: var(--hd-ink); }
.main-navigation .main-nav ul li:hover > a, .main-navigation .main-nav ul li.current-menu-item > a { color: var(--brand); }
.main-navigation ul ul, .main-navigation .main-nav ul ul li a { background-color: var(--hd-bg); color: var(--hd-ink); }
.page-hero, .entry-header.atlas-hero { background: var(--hero-bg); color: var(--hd-ink); }

/* Taalbalk direct onder de navigatie */
.atlas-taalbalk { background: var(--hero-bg); border-bottom: 1px solid var(--line); padding: .45em 1em .65em; }
.atlas-taalbalk ul { list-style: none; margin: 0 auto; padding: 0; max-width: 1120px; display: flex; flex-wrap: wrap; gap: .35em; }
.atlas-taalbalk li a { display: inline-block; padding: .15em .8em; border-radius: 999px; background: rgba(255,255,255,.08); color: var(--hd-ink); font-size: .82em; text-decoration: none; }
.atlas-taalbalk li a:hover { background: var(--brand); color: var(--brand-ink); }
.atlas-taalbalk li.current-lang a { background: var(--brand); color: var(--brand-ink); font-weight: 600; }

/* Footer */
.site-footer, .footer-widgets, .site-info { background-color: var(--ft-bg); color: var(--ft-ink); }
.site-info a, .footer-widgets a { color: var(--ft-ink); }

/* Pill-knoppen en vlakken */
button, .button, input[type="submit"], .wp-block-button__link { background-color: var(--brand); color: var(--brand-ink); border-radius: var(--btn-radius); border: 0; font-weight: 600; padding: .55em 1.4em; }
button:hover, .button:hover, input[type="submit"]:hover { background-color: var(--brand-ink); color: var(--brand-soft); }
.inside-article, blockquote { border-radius: var(--radius); }
blockquote { background: var(--surface); border-left: 4px solid var(--brand); padding: .8em 1em; }

/* Radar: opmaak komt van de plugin (full-bleed 100vw); geen theme-achtergrond
   of radius op de container, anders valt de kaart buiten het venster. */
.radar-wrapper, .glb-radar, .main_widget { background: transparent; }

/* Tabellen */
.tablewrap { overflow-x: auto; max-width: 100%; }
table { border-collapse: collapse; width: 100%; }
table th { background: var(--surface); border-bottom: 2px solid var(--brand); text-align: left; }
table td, table th { padding: .5em .7em; border-bottom: 1px solid var(--line); }

/* Formulieren */
input[type="text"], input[type="email"], input[type="search"], textarea, select { border: 1px solid var(--line); border-radius: var(--radius); }
::selection { background: var(--brand-soft); color: var(--brand-ink); }


/* Kop compact en overal gelijk: de standaardpadding van GeneratePress maakte de
   donkere balk onnodig hoog nu er een woordmerk in staat in plaats van een logo. */
.site-header .inside-header { padding-top: 14px; padding-bottom: 14px; }
.main-navigation .inside-navigation { padding-top: 0; padding-bottom: 0; }
.main-navigation .main-nav > ul > li > a { padding-top: 12px; padding-bottom: 12px; font-size: .95em; }
.glb-merk .glb-merk-naam { font-size: clamp(19px, 2vw, 26px); }

/* Overgenomen uit de eigen CSS van het oude Customify-thema (post 382).
   Verbergt iframes die als directe kindregel van <html> worden geinjecteerd;
   dat is geen geldige plaatsing en duidt op ingespoten advertentiecode. */
html > iframe { display: none !important; }

/* GeneratePress zet standaard een eigen achtergrond op het actieve en gehoverde
   menu-item (#3f3f3f). Dat gaf een grijs blok in de donkere kopbalk. De kop
   krijgt zijn kleur volledig uit de themavariabelen; alleen de tekst verkleurt. */
.main-navigation .main-nav ul li > a,
.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li:focus > a,
.main-navigation .main-nav ul li.current-menu-item > a,
.main-navigation .main-nav ul li.current-menu-parent > a {
    background-color: transparent;
}
