/* Eishockey-Tippspiel – Basis-Theme
   Farben werden per CSS-Variablen aus dem Adminbackend gesetzt (siehe includes/header.php) */

:root{
  --color-primary: #0b2a4a;
  --color-secondary: #7ec8e3;
  --color-accent: #e30613;
  --color-bg: #f4f7fa;
  --color-card: #ffffff;
  --color-text: #1b2733;
  --radius: 10px;
}

*{box-sizing:border-box;}
body{
  margin:0;
  font-family:"Segoe UI", Roboto, Arial, sans-serif;
  background:var(--color-bg);
  color:var(--color-text);
  line-height:1.5;
}
a{color:var(--color-primary); text-decoration:none;}
a:hover{text-decoration:underline;}

.wrap{max-width:1100px; margin:0 auto; padding:0 20px;}

/* Header */
.site-header{
  background:var(--color-primary) var(--header-bg-image, none) center/cover;
  color:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.header-inner{display:flex; align-items:center; justify-content:space-between; padding:14px 20px; flex-wrap:wrap; gap:10px;}
.brand{display:flex; align-items:center; gap:10px; color:#fff;}
.brand:hover{text-decoration:none;}
.brand .logo{height:46px; width:auto;}
.brand strong{display:block; font-size:1.2rem;}
.brand small{display:block; color:var(--color-secondary); font-size:.8rem;}
.main-nav{display:flex; gap:16px; align-items:center; flex-wrap:wrap;}
.main-nav a{color:#fff; font-weight:500;}
.main-nav a:hover{color:var(--color-secondary); text-decoration:none;}
.btn-nav{background:var(--color-accent); padding:6px 14px; border-radius:20px;}
.btn-nav:hover{color:#fff !important; opacity:.9;}
.header-sponsors{display:flex; gap:18px; align-items:center; padding:8px 20px; background:rgba(255,255,255,.08); flex-wrap:wrap;}
.header-sponsors img{height:28px; filter:grayscale(0) brightness(1.1);}

/* Main */
.main-content{padding:30px 20px 50px;}
.hero{
  background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));
  color:#fff;
  padding:40px 30px;
  border-radius:var(--radius);
  margin-bottom:30px;
}
.hero h1{margin-top:0;}
.rank-hint{margin-top:10px;}

.btn{
  display:inline-block;
  background:var(--color-accent);
  color:#fff;
  padding:10px 22px;
  border-radius:24px;
  border:none;
  font-weight:600;
  cursor:pointer;
  font-size:1rem;
}
.btn:hover{opacity:.9; text-decoration:none; color:#fff;}
.btn-small{
  background:var(--color-primary); color:#fff; padding:6px 14px;
  border-radius:16px; font-size:.85rem;
}
.btn-small:hover{color:#fff; text-decoration:none; opacity:.85;}

.card{
  background:var(--color-card);
  border-radius:var(--radius);
  padding:22px;
  box-shadow:0 1px 4px rgba(0,0,0,.08);
  margin-bottom:20px;
}
.auth-card{max-width:420px; margin:0 auto;}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
@media (max-width:700px){.grid-2{grid-template-columns:1fr;}}

form label{display:block; margin-bottom:14px; font-weight:600; font-size:.9rem;}
form input[type=text], form input[type=email], form input[type=password], form input[type=number], form textarea, form select{
  width:100%; padding:9px 10px; margin-top:5px; border:1px solid #ccd6df; border-radius:6px; font-size:1rem;
}

.flash{padding:12px 16px; border-radius:6px; margin-bottom:16px; font-weight:600;}
.flash-success{background:#e3f7e9; color:#146c2e;}
.flash-error{background:#fbe4e4; color:#a3242c;}

/* Match / Tip lists */
.match-list, .tip-list{display:flex; flex-direction:column; gap:8px;}
.tip-group{display:flex; flex-direction:column; gap:8px; margin-bottom:20px;}
.match-row, .tip-row{
  background:var(--color-card);
  border-radius:8px;
  padding:12px 16px;
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  box-shadow:0 1px 3px rgba(0,0,0,.06);
}
.tip-row.locked{opacity:.65;}
.league-tag{background:var(--color-primary); color:#fff; padding:2px 8px; border-radius:4px; font-size:.75rem; font-weight:700;}
.tip-meta{display:flex; gap:14px; font-size:.85rem; color:#5a6b7a; min-width:220px;}
.tip-teams{display:flex; align-items:center; gap:8px; flex:1; flex-wrap:wrap;}
.tip-teams input[type=number]{width:60px; text-align:center; padding:6px;}
.tip-fixed{font-weight:700; padding:0 6px;}
.lock-note{font-size:.75rem; color:var(--color-accent); font-weight:700;}
.team-home{font-weight:600; text-align:right; min-width:150px;}
.team-away{font-weight:600; min-width:150px;}

/* Tables */
table{width:100%; border-collapse:collapse; background:var(--color-card); border-radius:var(--radius); overflow:hidden;}
th, td{padding:10px 12px; text-align:left; border-bottom:1px solid #e8edf1;}
th{background:var(--color-primary); color:#fff;}
tr.me{background:#fff6db; font-weight:700;}
.ot-tag, .live-tag{font-size:.7rem; padding:2px 6px; border-radius:4px; margin-left:6px;}
.ot-tag{background:#eee; color:#555;}
.live-tag{background:var(--color-accent); color:#fff;}

.filter-bar{display:flex; gap:10px; margin-bottom:16px; flex-wrap:wrap;}
.filter-bar a{padding:6px 14px; border-radius:16px; background:#e6edf3; color:var(--color-text);}
.filter-bar a.active{background:var(--color-primary); color:#fff;}

.matchday-nav{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; flex-wrap:wrap;}
.matchday-select-form select{padding:8px 12px; border-radius:20px; border:1px solid #ccd6df; font-weight:600;}
.tip-list h3{margin:6px 0 8px; font-size:1rem; color:#5a6b7a;}

/* Footer */
.footer-sponsors{padding:20px; text-align:center;}
.sponsor-row{display:flex; gap:24px; justify-content:center; flex-wrap:wrap; align-items:center; margin-top:10px;}
.sponsor-row img{height:40px;}
.site-footer{background:var(--color-primary); color:#cfe0ec; padding:24px 0; margin-top:40px;}
.footer-nav{display:flex; gap:18px; justify-content:center; flex-wrap:wrap; margin-bottom:10px;}
.footer-nav a{color:#fff;}
.footer-inner{text-align:center; font-size:.85rem;}

.cms-page{background:var(--color-card); padding:30px; border-radius:var(--radius);}