/* =====================================================================
   TSV Abensberg 1862 e.V. · Abteilung Fußball
   Ressourcenplan — Stylesheet für die öffentliche Seite und den Adminbereich
   ===================================================================== */

:root{
  --ink:#0c0c0d; --paper:#ffffff; --bg:#f4f4f5;
  --line:#e2e2e5; --muted:#6c6c72; --muted-d:rgba(255,255,255,.66);
  --maxw:1240px; --grid-line:#dcdce0;
}
*{box-sizing:border-box}
body{margin:0;font-family:"Inter",system-ui,sans-serif;color:var(--ink);background:var(--paper);
     -webkit-font-smoothing:antialiased;line-height:1.55}
h1,h2,h3{font-family:"Oswald",sans-serif;font-weight:600;line-height:1.05;margin:0;letter-spacing:.005em}
a{color:inherit}
button,select,input{font-family:inherit;font-size:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px;border-radius:4px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.eyebrow{font-family:"Oswald";text-transform:uppercase;letter-spacing:.2em;font-weight:600;
         font-size:.72rem;color:var(--muted)}
.eyebrow.on-dark{color:var(--muted-d)}

header.top{background:var(--ink);color:#fff;padding:16px 0}
header.top .row{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.brand{font-family:"Oswald";text-transform:uppercase;letter-spacing:.12em;font-weight:600;
       font-size:.95rem;display:flex;align-items:center;gap:11px}
.crest{width:34px;height:34px;border-radius:8px;background:#fff;color:var(--ink);
       display:grid;place-items:center;font-family:"Oswald";font-weight:700;font-size:.72rem}
.spacer{flex:1 1 auto}
.saisonchip{font-family:"Oswald";text-transform:uppercase;letter-spacing:.1em;font-size:.72rem;
  font-weight:600;border:1.5px solid rgba(255,255,255,.4);border-radius:40px;padding:7px 14px;color:#fff}
.saisonchip b{color:#fff}
.rolle{display:flex;border:1.5px solid rgba(255,255,255,.45);border-radius:40px;padding:3px}
.rolle button{background:transparent;border:0;color:rgba(255,255,255,.72);font-family:"Oswald";
              text-transform:uppercase;letter-spacing:.09em;font-size:.75rem;font-weight:600;
              padding:8px 15px;border-radius:40px}
.rolle button[aria-pressed="true"]{background:#fff;color:var(--ink)}

.hero{background:var(--ink);color:#fff;padding:6px 0 38px}
.hero h1{font-size:clamp(1.9rem,5vw,3rem);text-transform:uppercase;margin:10px 0 0}
.hero p{color:var(--muted-d);max-width:64ch;margin:14px 0 0}
.protohint{display:inline-block;margin-top:20px;border:1px dashed rgba(255,255,255,.4);
           border-radius:10px;padding:9px 14px;font-size:.85rem;color:var(--muted-d)}

nav.views{position:sticky;top:0;z-index:30;background:var(--paper);border-bottom:1px solid var(--line)}
nav.views .wrap{display:flex;gap:4px;overflow-x:auto}
nav.views button{background:transparent;border:0;border-bottom:3px solid transparent;
  font-family:"Oswald";text-transform:uppercase;letter-spacing:.1em;font-weight:600;font-size:.82rem;
  color:var(--muted);padding:17px 14px;white-space:nowrap}
nav.views button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--ink)}

main{padding:34px 0 90px}
.sec-head h2{font-size:clamp(1.45rem,3.4vw,2rem);text-transform:uppercase;margin:6px 0 0}
.sec-head p{color:var(--muted);margin:10px 0 0;max-width:74ch}

.controls{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;margin:26px 0 6px}
.ctl{display:flex;flex-direction:column;gap:6px}
.ctl label{font-family:"Oswald";text-transform:uppercase;letter-spacing:.12em;font-size:.68rem;
           font-weight:600;color:var(--muted)}
.ctl select,.ctl input[type=date],.ctl input[type=text]{border:1.5px solid var(--ink);border-radius:10px;
  padding:10px 12px;background:#fff;font-weight:500;min-width:190px}
.seg{display:inline-flex;border:1.5px solid var(--ink);border-radius:40px;padding:3px;background:#fff}
.seg button{background:transparent;border:0;font-family:"Oswald";text-transform:uppercase;
  letter-spacing:.09em;font-size:.76rem;font-weight:600;color:var(--muted);padding:9px 16px;border-radius:40px}
.seg button[aria-pressed="true"]{background:var(--ink);color:#fff}
.btn{display:inline-flex;align-items:center;gap:8px;font-family:"Oswald";text-transform:uppercase;
  letter-spacing:.08em;font-weight:600;font-size:.8rem;padding:11px 18px;border-radius:40px;
  border:1.6px solid var(--ink);background:var(--ink);color:#fff;transition:.16s}
.btn:hover{background:#fff;color:var(--ink)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:#fff}
.btn.sm{padding:8px 14px;font-size:.74rem}
.weeknav{display:flex;align-items:center;gap:8px}
.weeknav .lbl{font-family:"Oswald";font-weight:600;min-width:210px;text-align:center}
.iconbtn{border:1.5px solid var(--ink);background:#fff;border-radius:50%;width:38px;height:38px;
  display:grid;place-items:center;font-size:1rem;font-weight:700}
.iconbtn:hover{background:var(--ink);color:#fff}

.notice{border:1.5px solid var(--ink);border-radius:12px;padding:13px 16px;margin:20px 0 0;
  display:flex;gap:12px;align-items:flex-start;background:var(--bg);font-size:.92rem}
.notice .tag{font-family:"Oswald";text-transform:uppercase;letter-spacing:.1em;font-size:.68rem;
  font-weight:700;background:var(--ink);color:#fff;padding:4px 9px;border-radius:6px;white-space:nowrap}
.notice ul{margin:4px 0 0;padding-left:18px}

.gridbox{margin-top:22px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}
.gridbox .cap{display:flex;align-items:center;gap:12px;justify-content:space-between;
  padding:13px 16px;border-bottom:1px solid var(--line);background:var(--bg);flex-wrap:wrap}
.gridbox .cap h3{font-size:1rem;text-transform:uppercase;letter-spacing:.06em}
.gridbox .cap .sub{font-size:.8rem;color:var(--muted)}
.scroller{overflow-x:auto}
table.plan{border-collapse:collapse;width:100%;min-width:1000px;table-layout:fixed}
table.plan th,table.plan td{border:1px solid var(--grid-line);padding:0;height:38px;vertical-align:middle}
table.plan thead th{background:var(--ink);color:#fff;font-family:"Oswald";font-weight:500;
  font-size:.72rem;height:32px;text-align:center}
table.plan thead th.res{text-align:left;padding:0 12px;width:252px;min-width:252px}
table.plan td.res{padding:7px 12px;font-size:.83rem;font-weight:600;background:var(--bg);
  width:252px;min-width:252px}
table.plan tr.teil td.res{padding-left:26px;font-weight:500;font-size:.79rem;background:#fafafa}
table.plan tr.ganz td.res{border-left:4px solid var(--ink)}
table.plan td.res .kind{display:block;font-weight:400;font-size:.7rem;color:var(--muted);
  font-family:"Oswald";text-transform:uppercase;letter-spacing:.1em;margin-top:1px}
td.free{background:#fff}
td.free.vorbei{background:#fbfbfc}
td.free.clickable:hover{background:#eef0f2;cursor:pointer;box-shadow:inset 0 0 0 2px var(--ink)}
td.outside{background:repeating-linear-gradient(45deg,#fafafa,#fafafa 5px,#f2f2f3 5px,#f2f2f3 10px)}
td.block{padding:3px 5px}
.chip{display:block;border-radius:7px;padding:5px 8px;font-size:.78rem;font-weight:600;
  line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.18)}
.chip .t{display:block;font-size:.68rem;font-weight:500;opacity:.78;white-space:nowrap}
.chip.clickable{cursor:pointer}
.chip.clickable:hover{box-shadow:inset 0 0 0 2px var(--ink)}
.chip.abgeleitet{background:repeating-linear-gradient(135deg,#f1f1f3,#f1f1f3 5px,#e3e3e7 5px,#e3e3e7 10px)!important;
  color:#3a3a40;font-style:italic;font-weight:500}
.chip.anfrage{background:#fff!important;box-shadow:inset 0 0 0 2px var(--ink);
  border-left:6px solid var(--ink)}
.chip.anfrage .t{opacity:.9}
.tbl{width:100%;border-collapse:collapse;font-size:.86rem}
.tbl th{text-align:left;font-family:"Oswald";text-transform:uppercase;letter-spacing:.09em;
  font-size:.66rem;color:var(--muted);padding:0 8px 8px 0;font-weight:600;white-space:nowrap}
.tbl td{padding:6px 8px 6px 0;border-top:1px solid var(--line);vertical-align:middle}
.tbl input[type=text],.tbl select{border:1.5px solid var(--ink);border-radius:8px;padding:6px 8px;
  width:100%;background:#fff;min-width:90px}
.tbl input[type=color]{border:1.5px solid var(--ink);border-radius:8px;width:44px;height:32px;padding:2px;background:#fff}
.tbl .del{border:1.5px solid var(--ink);background:#fff;border-radius:8px;padding:5px 9px;
  font-family:"Oswald";font-size:.68rem;font-weight:600;letter-spacing:.08em}
.tbl .del:hover{background:var(--ink);color:#fff}
.tbl tr.teilrow td:first-child{padding-left:18px}
.badge{display:inline-block;min-width:20px;background:#fff;color:var(--ink);border-radius:20px;
  font-family:"Inter";font-size:.7rem;font-weight:700;padding:1px 7px;margin-left:6px}
nav.views button .badge{background:var(--ink);color:#fff}
nav.views button[aria-selected="true"] .badge{background:var(--ink);color:#fff}
.anf-list{margin-top:20px;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.anf{display:flex;gap:14px;align-items:flex-start;padding:15px 16px;border-top:1px solid var(--line);flex-wrap:wrap}
.anf:first-child{border-top:0}
.anf .w{font-family:"Oswald";font-weight:600;font-size:.88rem;min-width:200px}
.anf .m{flex:1 1 300px;font-size:.9rem}
.anf .m b{display:block;font-family:"Oswald";text-transform:uppercase;letter-spacing:.06em;font-size:.82rem}
.anf .m span{color:var(--muted);font-size:.85rem}
.anf .akt{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.st{display:inline-block;font-family:"Oswald";text-transform:uppercase;letter-spacing:.1em;
  font-size:.64rem;font-weight:700;border-radius:40px;padding:4px 10px;border:1.5px solid var(--ink)}
.st.offen{background:var(--ink);color:#fff}
.st.ok{background:#fff;color:var(--ink)}
.st.nein{background:#fff;color:var(--muted);border-color:var(--line)}
.bfv{display:inline-block;font-family:"Oswald";font-size:.6rem;font-weight:700;letter-spacing:.1em;
  background:var(--ink);color:#fff;border-radius:4px;padding:1px 4px;margin-right:5px;vertical-align:1px;font-style:normal}
td.sperre{background:repeating-linear-gradient(45deg,#e9e9ec,#e9e9ec 6px,#d3d3d8 6px,#d3d3d8 12px);
  text-align:center;font-family:"Oswald";text-transform:uppercase;letter-spacing:.15em;
  font-size:.73rem;font-weight:700;color:#3a3a40}
td.sperre span{display:block;font-family:"Inter";font-weight:500;letter-spacing:0;text-transform:none;
  font-size:.71rem;color:#4a4a52}

table.cal{border-collapse:collapse;width:100%;min-width:860px;table-layout:fixed}
table.cal th,table.cal td{border:1px solid var(--grid-line);height:21px;padding:0}
#calHost{position:relative}
table.cal td.block{position:relative}
table.cal .chip{height:100%;position:relative;overflow:hidden}
.chip.ziehbar{cursor:grab;touch-action:none}
.chip.ziehbar.aktiv{cursor:grabbing;opacity:.9;box-shadow:0 8px 20px -6px rgba(0,0,0,.5),inset 0 0 0 2px var(--ink)}
.rs{position:absolute;left:0;right:0;height:8px;cursor:ns-resize;z-index:3}
.rs.top{top:0} .rs.bot{bottom:0}
.rs::after{content:'';position:absolute;left:50%;transform:translateX(-50%);width:22px;height:2px;
  background:rgba(12,12,13,.35);border-radius:2px}
.rs.top::after{top:2px} .rs.bot::after{bottom:2px}
.geist{position:absolute;border:2px dashed var(--ink);border-radius:7px;background:rgba(12,12,13,.07);
  pointer-events:none;z-index:20;display:none}
.geist span{position:absolute;top:2px;left:6px;font-family:"Oswald";font-size:.68rem;font-weight:600;
  background:var(--ink);color:#fff;border-radius:4px;padding:1px 6px}
table.tmx{border-collapse:collapse;width:100%;min-width:1000px;table-layout:fixed}
table.tmx th,table.tmx td{border:1px solid var(--grid-line);padding:0;vertical-align:top}
table.tmx thead th{background:var(--ink);color:#fff;font-family:"Oswald";font-weight:500;
  font-size:.74rem;height:34px}
table.tmx thead th.mn{text-align:left;padding:0 12px;width:150px;min-width:150px}
table.tmx td.mn{padding:8px 12px;background:var(--bg);font-weight:600;font-size:.85rem;
  width:150px;min-width:150px}
table.tmx td.mn i{display:block;font-style:normal;font-family:"Oswald";text-transform:uppercase;
  letter-spacing:.1em;font-size:.66rem;color:var(--muted);margin-top:2px}
table.tmx td.z{padding:5px}
table.tmx .tz{display:block;border-radius:7px;padding:5px 8px;font-size:.76rem;font-weight:600;
  margin-bottom:4px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18);cursor:pointer}
table.tmx .tz:last-child{margin-bottom:0}
table.tmx .tz span{display:block;font-weight:500;font-size:.7rem;opacity:.8}
table.tmx td.leer{background:repeating-linear-gradient(45deg,#fcfcfd,#fcfcfd 5px,#f6f6f7 5px,#f6f6f7 10px)}
.mini{font-size:.82rem;color:var(--muted);margin-top:10px}
table.cal thead th{background:var(--ink);color:#fff;font-family:"Oswald";font-weight:500;
  font-size:.75rem;height:40px}
table.cal thead th small{display:block;font-family:"Inter";font-weight:400;opacity:.7;font-size:.68rem}
table.cal thead th.heute{background:#fff;color:var(--ink)}
table.cal td.time,table.cal th.time{width:78px;min-width:78px;background:var(--bg);
  font-family:"Oswald";font-size:.72rem;text-align:right;padding-right:9px;color:var(--muted);
  border-right:2px solid var(--ink)}
table.cal td.time.full{color:var(--ink);font-weight:600}
table.cal td.block{padding:2px 3px}
table.cal .chip{font-size:.72rem;padding:3px 6px}

.legend{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.lg{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;border:1px solid var(--line);
  border-radius:40px;padding:5px 11px 5px 6px;background:#fff}
.sw{width:18px;height:18px;border-radius:5px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18)}
.sw.hatch{background:repeating-linear-gradient(45deg,#e9e9ec,#e9e9ec 4px,#d3d3d8 4px,#d3d3d8 8px)}
.sw.out{background:repeating-linear-gradient(45deg,#fafafa,#fafafa 4px,#f2f2f3 4px,#f2f2f3 8px)}
.sw.abg{background:repeating-linear-gradient(135deg,#f1f1f3,#f1f1f3 4px,#e3e3e7 4px,#e3e3e7 8px)}

.cards{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));margin-top:22px}
.card{border:1px solid var(--line);border-radius:14px;padding:16px;background:#fff}
.card h3{font-size:.95rem;text-transform:uppercase;letter-spacing:.06em}
.card p{margin:8px 0 0;font-size:.88rem;color:var(--muted)}
.card ul{margin:10px 0 0;padding-left:18px;font-size:.88rem}
.card ul li.t{color:var(--muted)}
.card .n{font-family:"Oswald";font-size:2rem;font-weight:600;line-height:1;margin:10px 0 0}
.spr-list{margin-top:20px;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.spr-list .item{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border-top:1px solid var(--line);flex-wrap:wrap}
.spr-list .item:first-child{border-top:0}
.spr-list .when{font-family:"Oswald";font-weight:600;font-size:.86rem;min-width:190px}
.spr-list .what{flex:1 1 260px;font-size:.9rem}
.spr-list .what b{display:block;font-family:"Oswald";text-transform:uppercase;letter-spacing:.06em;font-size:.8rem}
.spr-list .grund{font-size:.85rem;color:var(--muted)}
.pill{display:inline-block;font-family:"Oswald";text-transform:uppercase;letter-spacing:.1em;
  font-size:.66rem;font-weight:700;border:1.5px solid var(--ink);border-radius:40px;padding:3px 10px}

/* BFV-Import */
.imp{display:grid;gap:18px;grid-template-columns:1.1fr 1fr;margin-top:24px}
@media (max-width:900px){.imp{grid-template-columns:1fr}}
.panel{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden}
.panel .ph{padding:14px 16px;border-bottom:1px solid var(--line);background:var(--bg)}
.panel .ph h3{font-size:.95rem;text-transform:uppercase;letter-spacing:.06em}
.panel .ph p{margin:5px 0 0;font-size:.82rem;color:var(--muted)}
.panel .pb{padding:16px}
.feedrow{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line);font-size:.87rem}
.feedrow:first-child{border-top:0}
.feedrow input{margin-top:4px}
.feedrow .fm{flex:1}
.feedrow .fm b{display:block;font-weight:600}
.feedrow .fm span{color:var(--muted);font-size:.82rem}
.map{width:100%;border-collapse:collapse;font-size:.86rem}
.map th{text-align:left;font-family:"Oswald";text-transform:uppercase;letter-spacing:.1em;
  font-size:.68rem;color:var(--muted);padding:0 0 7px;font-weight:600}
.map td{padding:6px 8px 6px 0;border-top:1px solid var(--line)}
.map select{border:1.5px solid var(--ink);border-radius:8px;padding:6px 8px;width:100%;background:#fff}
.status{font-size:.84rem;color:var(--muted);margin-top:12px}
.status b{color:var(--ink)}

.ov{position:fixed;inset:0;background:rgba(12,12,13,.55);display:none;place-items:center;z-index:80;padding:20px}
.ov[open]{display:grid}
.dlg{background:#fff;border-radius:18px;max-width:540px;width:100%;max-height:88vh;overflow:auto;
  box-shadow:0 30px 70px -20px rgba(0,0,0,.6)}
.dlg .hd{padding:20px 22px 0}
.dlg .hd h3{font-size:1.15rem;text-transform:uppercase}
.dlg .hd p{color:var(--muted);font-size:.88rem;margin:6px 0 0}
.dlg .bd{padding:18px 22px}
.dlg .ft{padding:0 22px 22px;display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.fld{margin-bottom:14px}
.fld label{display:block;font-family:"Oswald";text-transform:uppercase;letter-spacing:.12em;
  font-size:.68rem;font-weight:600;color:var(--muted);margin-bottom:5px}
.fld select,.fld input,.fld textarea{width:100%;border:1.5px solid var(--ink);border-radius:10px;
  padding:10px 12px;background:#fff}
.fld.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fld.two > div{min-width:0}
.hinweis{font-size:.83rem;color:var(--muted);margin:-6px 0 14px}
.chkrow{display:flex;align-items:flex-start;gap:9px;font-size:.9rem;margin-top:6px}
.chkrow input{width:auto;border-width:1px;margin-top:4px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:.9rem}
.kv dt{font-family:"Oswald";text-transform:uppercase;letter-spacing:.1em;font-size:.68rem;
  color:var(--muted);padding-top:3px}
.kv dd{margin:0;font-weight:500}
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);background:var(--ink);color:#fff;
  padding:13px 20px;border-radius:40px;font-size:.88rem;z-index:90;max-width:90vw;text-align:center;
  box-shadow:0 14px 34px -12px rgba(0,0,0,.6);opacity:0;pointer-events:none;transition:opacity .2s}
.toast.on{opacity:1}

footer{background:var(--ink);color:var(--muted-d);padding:34px 0;font-size:.85rem}
footer strong{color:#fff;font-family:"Oswald";text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.hide{display:none!important}
@media (max-width:700px){
  .ctl select,.ctl input{min-width:0;width:100%}
  .ctl{flex:1 1 100%}
}
