/*
 Theme Name: Astra Child Tested4U
 Theme URI: https://tested4u.de
 Description: Child Theme für Astra auf tested4u.de
 Author: tested4u.de
 Author URI: https://tested4u.de
 Template: astra
 Version: 1.1.0
 Text Domain: astra-child-tested4u
*/

/*
 * Tested4U – Global Design System (rekonstruiert + ergänzt)
 * Stand: 2026-03-16
 */

:root {
  /* Farben (an Logo + bestehende Dark-Optik angelehnt) */
  --t4u-color-bg: #0f141c;
  --t4u-color-surface: #131924;
  --t4u-color-surface-2: #1a2230;
  --t4u-color-text: #eaf0f7;
  --t4u-color-text-muted: #b8c4d6;
  --t4u-color-heading: #ffffff;
  --t4u-color-primary: #2c53a2;
  --t4u-color-primary-hover: #354f90;
  --t4u-color-accent: #618e61;
  --t4u-color-border: #2a3546;
  --t4u-color-link: #76a7ff;
  --t4u-color-link-hover: #98bdff;

  /* Typo */
  --t4u-font-body: "Inter", "Heebo", "Segoe UI", Roboto, Arial, sans-serif;
  --t4u-font-heading: "Poppins", "Inter", "Segoe UI", Roboto, Arial, sans-serif;
  --t4u-font-nav: var(--t4u-font-heading);

  --t4u-fs-body: 17px;
  --t4u-fs-small: 14px;
  --t4u-fs-h1: clamp(34px, 5vw, 56px);
  --t4u-fs-h2: clamp(28px, 3.6vw, 42px);
  --t4u-fs-h3: clamp(22px, 2.5vw, 30px);
  --t4u-fs-h4: 24px;
  --t4u-fs-h5: 20px;
  --t4u-fs-h6: 18px;

  --t4u-lh-body: 1.7;
  --t4u-lh-heading: 1.25;

  /* Layout */
  --t4u-container: 1200px;
  --t4u-radius-sm: 8px;
  --t4u-radius-md: 12px;
  --t4u-radius-lg: 16px;
  --t4u-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
}

html, body {
  background: var(--t4u-color-bg);
  color: var(--t4u-color-text);
  font-family: var(--t4u-font-body);
  font-size: var(--t4u-fs-body);
  line-height: var(--t4u-lh-body);
}

.ast-container,
.site-content .ast-container {
  max-width: var(--t4u-container);
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.site-title {
  color: var(--t4u-color-heading);
  font-family: var(--t4u-font-heading);
  line-height: var(--t4u-lh-heading);
  letter-spacing: 0.01em;
}

h1 { font-size: var(--t4u-fs-h1); font-weight: 700; }
h2 { font-size: var(--t4u-fs-h2); font-weight: 700; }
h3 { font-size: var(--t4u-fs-h3); font-weight: 700; }
h4 { font-size: var(--t4u-fs-h4); font-weight: 600; }
h5 { font-size: var(--t4u-fs-h5); font-weight: 600; }
h6 { font-size: var(--t4u-fs-h6); font-weight: 600; }

p, li, .entry-content {
  color: var(--t4u-color-text);
}

small, .text-muted, .ast-archive-description, .entry-meta {
  color: var(--t4u-color-text-muted);
  font-size: var(--t4u-fs-small);
}

a,
a:visited {
  color: var(--t4u-color-link);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

a:hover,
a:focus {
  color: var(--t4u-color-link-hover);
}

/* Header / Navigation */
.main-header-bar,
.ast-primary-header-bar,
.ast-above-header-bar,
.ast-below-header-bar {
  background: var(--t4u-color-surface);
  border-bottom: 1px solid var(--t4u-color-border);
}

.main-header-menu .menu-link,
.ast-builder-menu-1 .menu-link {
  font-family: var(--t4u-font-nav);
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: var(--t4u-color-text);
}

.main-header-menu .menu-link:hover,
.main-header-menu .current-menu-item > .menu-link {
  color: var(--t4u-color-link);
}

/* Buttons */
.ast-button,
.button,
button,
input[type="button"],
input[type="submit"],
.wp-block-button__link {
  background: var(--t4u-color-primary);
  border: 1px solid var(--t4u-color-primary);
  color: #fff;
  border-radius: var(--t4u-radius-sm);
  font-family: var(--t4u-font-heading);
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 12px 20px;
}

.ast-button:hover,
.button:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover {
  background: var(--t4u-color-primary-hover);
  border-color: var(--t4u-color-primary-hover);
  color: #fff;
}

/* Karten / Boxen */
.wp-block-group,
.widget,
.ast-article-post,
.site-main article,
.ast-separate-container .ast-article-single {
  background: var(--t4u-color-surface);
  border: 1px solid var(--t4u-color-border);
  border-radius: var(--t4u-radius-md);
}

/* Formulare */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
textarea,
select {
  background: var(--t4u-color-surface-2);
  color: var(--t4u-color-text);
  border: 1px solid var(--t4u-color-border);
  border-radius: var(--t4u-radius-sm);
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--t4u-color-link);
  outline: none;
  box-shadow: 0 0 0 3px rgba(118, 167, 255, 0.2);
}

/* Footer */
.site-footer,
.ast-footer-overlay {
  background: #0b1018;
  color: var(--t4u-color-text-muted);
  border-top: 1px solid var(--t4u-color-border);
}

.site-footer a {
  color: var(--t4u-color-link);
}

/* Responsive */
@media (max-width: 921px) {
  :root {
    --t4u-fs-body: 16px;
  }
}

@media (max-width: 544px) {
  :root {
    --t4u-fs-body: 15px;
    --t4u-fs-h1: 34px;
    --t4u-fs-h2: 28px;
    --t4u-fs-h3: 22px;
    --t4u-fs-h4: 20px;
  }

  .ast-button,
  .button,
  button,
  input[type="submit"] {
    width: 100%;
  }
}
