/* ================================================================
   AuftragMarkt Premium Theme v2  |  Industrial Glassmorphism
   Non-invasive global polish layer — loaded LAST before </head>.
   Enhances existing inline styles; never overrides layout/colors
   set by page-local CSS unless via low-specificity additive rules.
   ================================================================ */
:root{
  --am-blau:#1E77BF; --am-blau-dunkel:#2477bd; --am-dunkel:#0A3D62;
  --am-text:#2A3A45; --am-grau:#5B6B76; --am-chip:#F6F9FC; --am-rand:#E5EDF4;
  --am-gruen:#27AE60;
  /* Layered soft depth shadows (Trust & Seriosität) */
  --am-shadow-sm:0 1px 2px rgba(10,61,98,.04),0 2px 6px rgba(10,61,98,.06);
  --am-shadow-md:0 2px 4px rgba(10,61,98,.05),0 8px 20px rgba(10,61,98,.08),0 1px 0 rgba(255,255,255,.6) inset;
  --am-shadow-lg:0 4px 8px rgba(10,61,98,.06),0 18px 40px rgba(10,61,98,.12),0 1px 0 rgba(255,255,255,.7) inset;
  --am-shadow-hover:0 6px 14px rgba(10,61,98,.09),0 24px 54px rgba(10,61,98,.16);
  --am-ring:0 0 0 3px rgba(46,143,224,.35);
  /* Glass */
  --am-glass-bg:rgba(255,255,255,.72);
  --am-glass-brd:1px solid rgba(255,255,255,.55);
  /* Brushed metallic (Platin/Stahl) for trust badges */
  --am-metal:linear-gradient(135deg,#f4f7fa 0%,#dfe7ee 22%,#c9d4de 48%,#eef3f7 60%,#c4cfd9 82%,#e9eef3 100%);
  --am-metal-brd:#b9c6d2;
  --am-ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- Global smoothness & selection ---------- */
html{scroll-behavior:smooth;}
*{-webkit-tap-highlight-color:rgba(46,143,224,.18);}
::selection{background:rgba(46,143,224,.22);color:var(--am-dunkel);}
body{animation:amFade .5s var(--am-ease) both;}
@keyframes amFade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important;}}

/* Thin, branded scrollbars */
*{scrollbar-width:thin;scrollbar-color:#bcd3e6 transparent;}
*::-webkit-scrollbar{width:10px;height:10px;}
*::-webkit-scrollbar-thumb{background:#bcd3e6;border-radius:8px;border:2px solid transparent;background-clip:padding-box;}
*::-webkit-scrollbar-thumb:hover{background:#9cbdda;background-clip:padding-box;}

/* ---------- Glassmorphism: sticky headers / navigation ---------- */
header[style*="sticky"],header[class*="nav"],nav[style*="sticky"],
[class$="-nav"],[class*="-nav "]{
  -webkit-backdrop-filter:saturate(180%) blur(10px);
  backdrop-filter:saturate(180%) blur(10px);
}
[class$="-nav"]{
  background:var(--am-glass-bg)!important;
  border-bottom:1px solid var(--am-rand);
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 6px 18px rgba(10,61,98,.06);
}

/* Filter / overlay panels get frosted glass when marked .am-glass */
.am-glass,[data-glass]{
  background:var(--am-glass-bg);
  -webkit-backdrop-filter:saturate(180%) blur(12px);
  backdrop-filter:saturate(180%) blur(12px);
  border:var(--am-glass-brd);
  border-radius:14px;
  box-shadow:var(--am-shadow-lg);
}

/* ---------- Cards: depth + fluid hover lift ---------- */
.card,[class$="-card"],[class*="card "],article[class*="card"]{
  border-radius:12px;
  transition:transform .28s var(--am-ease),box-shadow .28s var(--am-ease),border-color .28s var(--am-ease);
  will-change:transform;
}
.card:hover,[class$="-card"]:hover,[class*="card "]:hover,article[class*="card"]:hover{
  transform:translateY(-4px);
  box-shadow:var(--am-shadow-hover);
  border-color:rgba(46,143,224,.35);
}
.card:active,[class$="-card"]:active{transform:translateY(-1px);}

/* ---------- Buttons: premium hover / active / loading ---------- */
button,.btn,[class$="-btn"],a[class*="btn"],input[type=submit]{
  transition:transform .16s var(--am-ease),box-shadow .2s var(--am-ease),filter .2s var(--am-ease);
}
button:hover,.btn:hover,[class$="-btn"]:hover,a[class*="btn"]:hover,input[type=submit]:hover{
  transform:translateY(-1px);
  box-shadow:var(--am-shadow-md);
  filter:saturate(108%);
}
button:active,.btn:active,[class$="-btn"]:active,input[type=submit]:active{
  transform:translateY(1px) scale(.985);
  box-shadow:var(--am-shadow-sm);
  filter:saturate(100%);
}
button:focus-visible,.btn:focus-visible,a:focus-visible,[class$="-btn"]:focus-visible{
  outline:none; box-shadow:var(--am-ring);
}
/* Loading spinner for buttons marked [data-loading] / .is-loading */
button.is-loading,button[data-loading="1"],.btn.is-loading{
  position:relative;color:transparent!important;pointer-events:none;
}
button.is-loading::after,button[data-loading="1"]::after,.btn.is-loading::after{
  content:"";position:absolute;top:50%;left:50%;width:18px;height:18px;margin:-9px 0 0 -9px;
  border:2px solid rgba(255,255,255,.55);border-top-color:#fff;border-radius:50%;
  animation:amSpin .7s linear infinite;
}
@keyframes amSpin{to{transform:rotate(360deg)}}

/* ---------- Form fields: focus in brand blue ---------- */
input,select,textarea{
  transition:border-color .18s var(--am-ease),box-shadow .18s var(--am-ease),background-color .18s var(--am-ease);
}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--am-blau)!important;box-shadow:var(--am-ring);
}
/* invalid state (native + .am-invalid) */
input:not(:placeholder-shown):invalid,input.am-invalid,select.am-invalid{
  border-color:#e05a5a!important;box-shadow:0 0 0 3px rgba(224,90,90,.22);
}

/* ---------- Brushed metallic trust badges ---------- */
.am-badge-metal,[data-badge="metal"]{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 12px;border-radius:999px;
  background:var(--am-metal);border:1px solid var(--am-metal-brd);
  color:#33414d;font-weight:700;font-size:.8rem;letter-spacing:.01em;
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 1px 3px rgba(10,61,98,.14);
  text-shadow:0 1px 0 rgba(255,255,255,.6);
}
.am-badge-metal svg,.am-badge-metal .ic{filter:drop-shadow(0 1px 0 rgba(255,255,255,.7));}

/* ---------- Responsive lead-price tables / lists ---------- */
table{width:100%;border-collapse:collapse;}
@media(max-width:640px){
  .am-table-scroll,.responsive-table{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px;}
  .am-table-scroll table{min-width:520px;}
}

/* ---------- Mobile-first tap targets & no iOS zoom ---------- */
@media(max-width:768px){
  button,.btn,[class$="-btn"],a[class*="btn"],
  input[type=submit],input[type=button],select{min-height:44px;}
  input,select,textarea{font-size:16px;}
  body{overflow-x:hidden;}
}

/* Fine-tune focus ring for keyboard users on links */
a:focus-visible{outline:none;box-shadow:var(--am-ring);border-radius:6px;}


/* Skip-Link (WCAG 2.4.1 / BFSG) */
.am-skip{position:absolute;left:-9999px;top:0;z-index:2000;background:#0a3d62;color:#fff;padding:10px 16px;border-radius:0 0 8px 0;font-weight:700;text-decoration:none}
.am-skip:focus{left:0}
[id="inhalt"]:focus{outline:none}


/* ===== AM-MOBIL-PATCH (29.07.2026) =================================
   1) Die beiden fixierten Schaltflaechen (Menue unten rechts, Chat unten
      links) lagen auf dem Handy ueber dem Seiteninhalt. Deshalb unten
      Platz freihalten.
   2) Auf dem Handy waren 21 von 94 Tippflaechen kleiner als 40 px.
      Mindesthoehe setzen (wirkt nur auf Block-/Inline-Block-Elemente,
      normale Textlinks im Fliesstext bleiben unveraendert).
   3) Schriftgroesse 16 px in Eingabefeldern verhindert das automatische
      Hineinzoomen von iOS Safari.
   ================================================================== */
@media (max-width: 760px) {
  body { padding-bottom: 96px; }
  #fw-nav-launch, .amh-fab { bottom: 16px; }
  button,
  [role="button"],
  summary,
  input[type="submit"],
  input[type="button"],
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="password"],
  input[type="number"],
  input[type="search"],
  select,
  textarea { min-height: 40px !important; }
  input[type="checkbox"], input[type="radio"] { min-width: 22px; min-height: 22px; }
  input, select, textarea { font-size: 16px; }
  /* Fuss- und Servicelinks waren nur 18 px hoch - zu klein zum Antippen. */
  a.scp0, footer a[href] { display: inline-flex; align-items: center; min-height: 40px; }
}

/* ================================================================
   Runde 3: Kein horizontales Scrollen auf schmalen Displays.
   Viele Layouts nutzen Inline-Grids mit festen bzw. asymmetrischen
   Spalten (Inhalt + Seitenspalte) ohne eigene Media Query. Auf 380 px
   ragten sie ueber den Bildschirm hinaus (gemessen: bis 725 px).
   Inline-Styles lassen sich nur mit !important ueberschreiben.
   ================================================================ */
@media (max-width: 820px) {
  [style*="grid-template-columns: 1fr 380px"],
  [style*="grid-template-columns: 230px 1fr"],
  [style*="grid-template-columns: 1.1fr 1fr"],
  [style*="grid-template-columns: 1.15fr .85fr"],
  [style*="grid-template-columns: 1.55fr 1fr"],
  [style*="grid-template-columns: 1.6fr 1fr"],
  [style*="grid-template-columns:1.6fr 1fr"],
  [style*="grid-template-columns: 1.1fr .9fr"],
  [style*="grid-template-columns:1.1fr .9fr"] { grid-template-columns: 1fr !important; }
  img, svg, video, table, pre { max-width: 100% !important; }
}
@media (max-width: 620px) {
  /* Kopfzeilen mit Logo + Navigation + CTA sollen umbrechen statt zu ueberlaufen. */
  header > div[style*="display: flex"],
  header > div[style*="display:flex"] { flex-wrap: wrap !important; row-gap: 10px !important; }
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: repeat(3, 1fr)"],
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns: repeat(4, 1fr)"],
  [style*="grid-template-columns:repeat(4,1fr)"] { grid-template-columns: 1fr !important; }
}


/* ============================================================================
   Runde 4 (2026-07-30): Sprunglink sichtbar machen + Tastaturfokus vervollstaendigen
   1) Der Skip-Link war position:absolute; beim Tabben weit unten auf der Seite
      waere er ausserhalb des Sichtfelds gelandet. Jetzt position:fixed.
      Eingefuegt wird er von fw-polish.js (Block fw-skiplink) bzw. steht statisch
      im HTML von 22 Seiten und in gewerk.php.
   2) Fokusringe: bisher hatten nur button/a/.btn einen Ring. Eingabefelder,
      Selects, Textareas, [tabindex] und role="button" hatten keinen sichtbaren
      Fokus (WCAG 2.4.7).
   3) forced-colors (Windows-Kontrastmodus): box-shadow-Ringe werden dort nicht
      gerendert, deshalb ein echtes outline in Systemfarbe.
   ========================================================================== */
.am-skip{position:fixed;left:12px;top:-120px;z-index:2147483000;transition:top .15s ease;
  box-shadow:0 6px 20px rgba(10,61,98,.35);border-radius:0 0 10px 10px;}
.am-skip:focus,.am-skip:focus-visible{left:12px;top:0;outline:3px solid #B45309;outline-offset:2px;}

input:focus-visible,select:focus-visible,textarea:focus-visible,
[tabindex]:focus-visible,[role="button"]:focus-visible,[role="tab"]:focus-visible,
[role="link"]:focus-visible,summary:focus-visible{
  outline:3px solid #1E77BF;outline-offset:2px;
}

@media (forced-colors: active){
  button:focus-visible,a:focus-visible,.btn:focus-visible,[class$="-btn"]:focus-visible,
  input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
    outline:3px solid Highlight;outline-offset:2px;
  }
}


/* ===== R6: Kennzeichnung KI-generierter Bilder (EU-KI-VO Art. 50, ab 02.08.2026) ===== */
.am-ki-badge{
  position:absolute; right:10px; top:10px; z-index:12;
  display:inline-flex; align-items:center; gap:5px;
  background:#0f172a; color:#ffffff;
  font:700 11px/1 system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  letter-spacing:.04em; padding:6px 10px; border-radius:999px;
  border:1px solid rgba(255,255,255,.45);
  box-shadow:0 2px 8px rgba(15,23,42,.35);
  white-space:nowrap; text-decoration:none;
}
.am-ki-badge svg{display:block;flex:0 0 auto}
@media (max-width:520px){ .am-ki-badge{right:8px;top:8px;font-size:10px;padding:5px 8px} }
.am-ki-hinweis{
  display:block; margin:16px auto 0; max-width:760px;
  font-size:13.5px; line-height:1.55; color:#475569; text-align:center;
}
.am-ki-hinweis a{color:#15568A;text-decoration:underline}
@media print{ .am-ki-badge{position:static;display:inline-block;box-shadow:none} }

/* ===== Runde 7: Transparenz-Hinweis fuer automatisierte Assistenten ===== */
.am-auto-hinweis{
  display:block; margin:0; padding:8px 14px;
  background:#F1F6FB; border-bottom:1px solid #DCE7F1;
  color:#3A536B; font:400 11.5px/1.45 system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}
.am-auto-hinweis b{font-weight:700;color:#26405A}
.am-auto-hinweis a{color:#15568A;text-decoration:underline}
.am-auto-hinweis a:focus-visible{outline:2px solid #15568A;outline-offset:2px}