/* TC Gleinstätten look: black / white / yellow, fonts Antic + Antic Didone (as on tc-gleinstaetten.at). */
@font-face { font-family: 'Antic'; font-weight: 400; font-style: normal; font-display: swap;
  src: url('fonts/Antic-Regular.woff2') format('woff2'); }          /* SIL OFL, Santiago Orozco */
@font-face { font-family: 'Antic Didone'; font-weight: 400; font-style: normal; font-display: swap;
  src: url('fonts/AnticDidone-Regular.woff2') format('woff2'); }    /* SIL OFL, Santiago Orozco */

:root[data-theme=light] {
  --tc-black: #000;
  --tc-yellow: #ffff00;
  --tc-yellow-light: #ffe599;
  --tc-yellow-soft: #fff7d1;
  --tc-green: #1f5a32;          /* logo ring */
  --pico-font-family: 'Antic', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --pico-font-size: 100%;
  --pico-background-color: #fff;
  --pico-color: #1a1a1a;
  --pico-h1-color: #000;
  --pico-h2-color: #000;
  --pico-h3-color: #000;
  --pico-primary: #000;
  --pico-primary-background: #000;
  --pico-primary-border: #000;
  --pico-primary-underline: rgba(0, 0, 0, .35);
  --pico-primary-hover: #333;
  --pico-primary-hover-background: #222;
  --pico-primary-hover-border: #222;
  --pico-primary-hover-underline: #000;
  --pico-primary-focus: rgba(255, 221, 0, .6);
  --pico-primary-inverse: var(--tc-yellow);
  --pico-text-selection-color: rgba(255, 229, 153, .7);
  --pico-form-element-focus-color: #e6c200;
  --pico-switch-checked-background-color: #000;
}
h1, h2, h3, .brand-name { font-family: 'Antic Didone', Georgia, serif; font-weight: 400; letter-spacing: .01em; }

/* Black header bar with logo, like the club website */
body > header.site-header { background: var(--tc-black); color: #fff; margin-bottom: 1.5rem; position: relative; padding: 0; }
.site-header::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: linear-gradient(to right, transparent 0%, var(--tc-yellow) 30%, var(--tc-yellow) 70%, transparent 100%); }
.site-header nav { padding: .4rem 0; }
.site-header a, .site-header a:visited { color: #fff; }
.site-header a:hover, .site-header a[aria-current=page] { color: var(--tc-yellow); text-decoration: none; }
.site-header a[aria-current=page] { border-bottom: 2px solid var(--tc-yellow); border-radius: 0; }
.brand { display: inline-flex; align-items: center; gap: .75rem; }
.brand img { width: 52px; height: 52px; }
.brand-name { font-size: 1.35rem; line-height: 1.1; }
.brand-name small { display: block; font-family: 'Antic', sans-serif; font-size: .75rem; color: var(--tc-yellow-light); letter-spacing: .08em; text-transform: uppercase; }
.site-header nav button.outline { color: #fff; border-color: rgba(255, 255, 255, .6); }
.site-header nav button.outline:hover { color: #000; background: var(--tc-yellow); border-color: var(--tc-yellow); }
@media (max-width: 760px) {
  .site-header nav { flex-wrap: wrap; }
  .brand-name small { display: none; }
}

/* Buttons: black with yellow text, yellow on hover */
button:not(.secondary):not(.outline):hover, [role=button]:not(.secondary):not(.outline):hover,
input[type=submit]:hover { background: var(--tc-yellow); color: #000; border-color: #000; }

.login-logo { display: block; width: 120px; height: 120px; margin: 0 auto 1rem; }

body > main, body > footer { padding-top: .5rem; padding-bottom: .5rem; }
nav ul li form { margin: 0; }
nav ul li form button { padding: .25rem .75rem; margin: 0; }
.flash { padding: .75rem 1rem; border-radius: var(--pico-border-radius); margin-bottom: 1rem; }
.flash.success { background: #d1f2dd; color: #0b4a22; }
.flash.warning { background: var(--tc-yellow-light); color: #3d2e00; }
.flash.error   { background: #fbd5d5; color: #6b0f0f; }
table td, table th { vertical-align: top; }
table form { margin: 0; }
table button, .inline button { padding: .2rem .6rem; margin: 0; font-size: .875rem; width: auto; }
.inline { display: inline-flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.muted { color: var(--pico-muted-color); }
.badge { display: inline-block; padding: 0 .5rem; border-radius: 1rem; font-size: .8rem; background: var(--tc-yellow-light); color: #000; border: 1px solid #e6c200; margin: 0 .15rem .15rem 0; }
.badge.warn { background: #fff; color: #9a3412; border-color: #ea580c; }
.toolbar { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; margin-bottom: 1rem; }
.toolbar input[type=search] { max-width: 22rem; margin: 0; }
.toolbar button { width: auto; margin: 0; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: 1rem; }
.stats article { margin: 0; }
.stats .num { font-size: 2rem; font-weight: 700; display: block; }
.overflow { overflow-x: auto; }
.privs label { display: block; }
.narrow { max-width: 28rem; margin: 2rem auto; }
.m0 { margin: 0; }
.stats article { border-top: 4px solid var(--tc-yellow); }
table.striped tbody tr:nth-child(odd) td { background: var(--tc-yellow-soft); }
.num-col { text-align: right; white-space: nowrap; }
.toolbar label.inline { margin: 0; }
.toolbar select { margin: 0; width: auto; }
.mail-preview { white-space: pre-wrap; font-family: var(--pico-font-family); font-size: .9rem; background: var(--tc-yellow-soft); padding: 1rem; border-left: 3px solid var(--tc-yellow); }
.small-num { max-width: 5.5rem; }
.big-num { font-size: 1.4rem; }
.steps li { margin-bottom: 1rem; }
.steps form { margin: .5rem 0 0; }
.steps button { width: auto; }
.reply { max-width: 38rem; margin: 1rem auto; }
.reply button[type=submit] { width: 100%; }
.audience label { display: inline-block; margin-right: 1.25rem; }