/* v533: startsidan "Dina tavlingar". Mork hero overst, korten lagda over
   kanten, och en tydlig primarknapp langst ned. Samma typsnitt som resten av
   Tournament: Bodoni Moda i rubriker, Inter i brodtext. */

.te-home{--te-ink:#0d3326;--te-linje:#e3e6dd;--te-dov:#6d7c72;--te-papper:#fbfaf4;
 background:var(--te-papper);min-height:100dvh;font-family:Inter,'DM Sans',system-ui,sans-serif}

/* --- hero ---------------------------------------------------------------- */
/* Utan sidrubriken blev hjalten en remsa och texten klistrades mot
   ordmarket. En fast minimihojd ger fotot plats, och marginalen over
   meningen ger luft mellan ordmarket och texten. */
.te-hero{position:relative;background:#0b2a1e center/cover;color:#fff;
 padding:34px 20px 74px;isolation:isolate;
 min-height:clamp(252px,34vh,300px);display:flex;flex-direction:column}
.te-hero:before{content:'';position:absolute;inset:0;z-index:-1;
 background:linear-gradient(175deg,#06241a66 0%,#06241aa8 52%,#06241ae8 100%)}
.te-hero-topp{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px}
/* v541: loggan, TOURNAMENT och rubriken ska ligga pa exakt samma vansterkant.
   Blocket lag forr i en flex-kolumn, och det var stretchen dar som en gang
   centrerade bilden. Har ar det i stallet vanliga blockelement - da finns
   ingen utstrackning att rakna med, och ingenting kan skjuta in dem. */
/* presentation.css satter .tournament-wordmark{margin:0 auto;align-items:center}
   for QR-kortet - det var DEN regeln som centrerade blocket har. Nollstall
   bade marginalen och inriktningen, annars vinner den. */
.te-hero .tournament-wordmark{display:block;margin:0;align-items:flex-start;
 color:#fff;text-align:left}
/* Logotypen ar morkgron pa transparent botten. Pa den morka heron blir den
   osynlig, sa den fargas om till vit - samma grepp som i bollooversiktens
   hero (ball-hero-wordmark.css) i stallet for en andra bildfil. */
/* Logotypfilen har ett tomt omrade till vanster om B:et (svansen under BNH
   nar langre ut an bokstaven). Utan kompensation hamnar B:et ~6 px hogre in
   an TOURNAMENT och rubriken - dra tillbaka bilden lika mycket sa kanterna
   moter. Hojden ar last till 34 px, sa siffran ar stabil. */
.te-hero .tournament-wordmark img{display:block;height:34px;width:auto;margin:0 0 5px -6px;
 object-fit:contain;object-position:left center;filter:brightness(0) invert(1)}
/* Spatieringen laggs pa efter varje tecken, aven det sista - den svansen
   trimmas bort sa radens hogerkant inte ljuger om bredden. */
/* presentation.css ger samma span ett padding-left:4px for QR-kortet - det
   sköt in TOURNAMENT fyra pixlar mot loggan och rubriken. */
.te-hero .tournament-wordmark span{display:block;margin:0 -.42em 0 0;padding:0;
 font:600 10px/1 Inter,sans-serif;letter-spacing:.42em}
.te-hero h1{font:400 clamp(32px,8.6vw,42px)/1.08 'Bodoni Moda','Libre Caslon Display',Georgia,serif;
 letter-spacing:-.018em;margin:18px 0 6px}
.te-hero>p{margin:auto 0 0;padding-top:24px;font-size:16px;line-height:1.5;
 color:#eef4ef;max-width:34ch}
/* Sidrubriken ar borttagen visuellt men finns kvar for skarmlasare och
   dokumentstrukturen - en sida utan h1 ar svar att navigera. */
.te-dold{position:absolute;width:1px;height:1px;margin:-1px;padding:0;
 overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

.te-konto>summary{list-style:none;width:46px;height:46px;border-radius:50%;border:1.5px solid #ffffff8c;
 display:grid;place-items:center;font:600 14px/1 Inter,sans-serif;letter-spacing:.04em;cursor:pointer}
.te-konto>summary::-webkit-details-marker{display:none}
.te-konto{position:relative}
.te-konto>div{position:absolute;right:0;top:54px;z-index:40;background:#fff;color:var(--te-ink);
 border:1px solid var(--te-linje);border-radius:14px;padding:10px;min-width:210px;
 box-shadow:0 18px 40px #0a281c2e}
.te-konto p{margin:4px 8px 8px;font-size:12px;color:var(--te-dov);overflow-wrap:anywhere}
.te-konto button{width:100%;text-align:left;border:0;background:none;padding:10px 8px;border-radius:9px;font-size:14px}
.te-konto button:hover{background:#f1f4ef}

/* --- listan -------------------------------------------------------------- */
.te-lista{position:relative;margin-top:-56px;padding:0 14px 40px;display:grid;gap:14px}

.te-kort{display:grid;grid-template-columns:minmax(100px,30%) 1fr;background:#fffefa;
 border:1px solid var(--te-linje);border-radius:22px;overflow:hidden;box-shadow:0 12px 30px #0d33261a}
.te-bild{position:relative;background:#123a2b center/cover;min-height:186px}
.te-bild:after{content:'';position:absolute;inset:0;background:linear-gradient(#0000 45%,#062018cc)}
.te-bild span{position:absolute;left:12px;right:10px;bottom:12px;z-index:1;color:#fff;
 font:600 10px/1.3 Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.te-kropp{padding:15px 14px 13px;min-width:0;display:grid;gap:10px;align-content:start}

.te-topp{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap}
.te-pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 11px;
 font:700 10px/1 Inter,sans-serif;letter-spacing:.09em;white-space:nowrap}
.te-pill i{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.te-live .te-pill{background:#e4f5e8;color:#157a3c}
.te-draft .te-pill{background:#f7ecd2;color:#8a6410}
.te-upcoming .te-pill{background:#e6eef7;color:#1d4f86}
.te-done .te-pill{background:#eceeeb;color:#4c5a52}
.te-meta{font-size:12.5px;color:var(--te-dov);min-width:0;flex:0 1 auto}

.te-meny{margin-left:auto;position:relative;flex:none}
.te-meny>summary{list-style:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;
 color:var(--te-dov);font-size:18px;line-height:1;cursor:pointer}
.te-meny>summary::-webkit-details-marker{display:none}
.te-meny>summary:hover{background:#f1f4ef}
.te-meny>div{position:absolute;right:0;top:36px;z-index:30;background:#fff;border:1px solid var(--te-linje);
 border-radius:13px;padding:6px;min-width:212px;box-shadow:0 16px 36px #0a281c26;display:grid}
.te-meny a,.te-meny button{border:0;background:none;text-align:left;padding:10px 10px;border-radius:9px;
 font-size:14px;color:var(--te-ink);text-decoration:none;white-space:nowrap}
.te-meny a:hover,.te-meny button:hover{background:#f1f4ef}
.te-meny .te-meny-fara{color:#b3261e}
.te-meny .te-meny-fara:hover{background:#fdeaea}

.te-kort h2{margin:0;font:400 clamp(21px,5.6vw,27px)/1.12 'Bodoni Moda','Libre Caslon Display',Georgia,serif;
 letter-spacing:-.02em;overflow-wrap:anywhere}
.te-kort h2 a{color:inherit;text-decoration:none}

.te-rad{margin:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13.5px;color:#41544a}
.te-rad span{display:inline-flex;align-items:center;gap:7px;min-width:0}
.te-ikon{width:16px;height:16px;flex:none;color:var(--te-dov)}

.te-progress{display:flex;align-items:center;gap:10px}
.te-spar{flex:1;height:8px;border-radius:99px;background:#eceade;overflow:hidden}
.te-spar i{display:block;height:100%;border-radius:99px;background:#c9a341}
.te-progress b{font:600 12.5px Inter,sans-serif;color:var(--te-dov)}

.te-fot{display:flex;align-items:center;flex-wrap:wrap;gap:9px 13px;
 border-top:1px solid var(--te-linje);padding-top:12px;margin-top:2px}
.te-stat{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:#41544a;white-space:nowrap}
.te-cta{margin-left:auto;display:inline-flex;align-items:center;gap:8px;background:var(--te-ink);color:#fff;
 border:0;border-radius:12px;padding:11px 16px;font:600 13.5px Inter,sans-serif;text-decoration:none}
.te-done .te-cta,.te-draft .te-cta{background:#eef1ec;color:var(--te-ink)}
.te-cta:hover{filter:brightness(1.08)}

.te-varning{display:flex;align-items:center;flex-wrap:wrap;gap:9px 11px;background:#fdeeee;border:1px solid #f6d3d3;
 border-radius:14px;padding:11px 12px;color:#a32424}
.te-varning .te-ikon{color:#c0392b;width:19px;height:19px}
.te-varning>div{min-width:0;flex:1 1 130px}
.te-varning b{display:block;font:600 13px Inter,sans-serif}
.te-varning small{display:block;font-size:11.5px;color:#7c4a4a;margin-top:2px}
.te-varning button{margin-left:auto;flex:none;border:1px solid #f0c3c3;background:#fff;color:#a32424;
 border-radius:10px;padding:9px 12px;font:600 12px Inter,sans-serif;white-space:nowrap}

.te-tom{background:#fffefa;border:1px dashed var(--te-linje);border-radius:22px;padding:30px 22px;text-align:center}
.te-tom h2{margin:0 0 6px;font:400 25px 'Bodoni Moda',Georgia,serif}
.te-tom p{margin:0;color:var(--te-dov);font-size:14px}

.te-skapa{width:100%;border:0;border-radius:18px;background:var(--te-ink);color:#fff;
 padding:21px;font:600 17px Inter,sans-serif;display:flex;align-items:center;justify-content:center;gap:11px}
.te-skapa span{font-size:23px;line-height:1;font-weight:400}
.te-skapa-form{background:#fffefa;border:1px solid var(--te-linje);border-radius:18px;padding:16px 18px 18px}
.te-skapa-form label{display:grid;gap:8px;margin:0 0 12px;font-size:13.5px}
.te-cta-bred{width:100%;justify-content:center}

.te-info{background:#eef2ec;border-radius:18px;padding:16px 18px;color:#3b4d44}
.te-info>summary{list-style:none;display:flex;align-items:flex-start;gap:12px;font-size:13.5px;line-height:1.5;cursor:pointer}
.te-info>summary::-webkit-details-marker{display:none}
.te-info .te-ikon{width:21px;height:21px;margin-top:1px;color:#5b6f63}
.te-info b{display:block;color:var(--te-ink);font-weight:600}
.te-info em{margin-left:auto;font-style:normal;font-weight:600;white-space:nowrap;
 text-decoration:underline;text-underline-offset:3px;align-self:center}
.te-info p{margin:12px 0 0 33px;font-size:13px;line-height:1.55}
.te-tagline{text-align:center;margin:12px 0 0;font:600 10px Inter,sans-serif;letter-spacing:.34em;color:#93a196}

/* Startsidan har varken sidhuvud eller bottenmeny. */
body.te-events #page-header,body.te-events #gamebook-bottom-nav{display:none!important}
body.te-events #content-view{padding-bottom:0}

@media(max-width:400px){
 .te-kort{grid-template-columns:1fr}
 .te-bild{min-height:132px}
 .te-fot .te-cta{margin-left:0;width:100%;justify-content:center}
 .te-info em{margin:8px 0 0 33px;align-self:flex-start}
 .te-info>summary{flex-wrap:wrap}
}
@media(min-width:700px){
 .te-lista{padding-inline:26px}
 .te-hero{padding:38px 26px 82px;min-height:clamp(268px,34vh,320px)}
}

/* v560: en tavling man blivit inbjuden till men annu inte anslutit sig till.
   Guldtonen skiljer den fran de egna korten utan att skrika. */
.te-inbjuden .te-pill{background:#f4e9cd;color:#7a5b12}
.te-inbjuden .te-cta{background:#c9a341;color:#1d2a20}
.te-inbjuden{border-color:#e4d3a4}

/* Tournament petrol palette. */
.te-home{--te-ink:#074653;--te-linje:#dfe2dc;--te-dov:#657c80;--te-papper:#f8f7f3;color:#123d46}
.te-hero{background-color:#074653}.te-hero:before{background:linear-gradient(175deg,#07465355 0%,#07465399 52%,#043640e8 100%)}
.te-bild{background-color:#074653}.te-bild:after{background:linear-gradient(#0000 45%,#043640cc)}
.te-home .te-kort,.te-home .te-tom,.te-home .te-skapa-form{background:#fcfbf8}
.te-home .te-live .te-pill{background:#e3eef0;color:#074653}
.te-home .te-cta,.te-home .te-skapa{background:#074653;color:#fff}
.te-home .te-done .te-cta{background:#e3eef0;color:#074653}
.te-home .te-info{background:#e3eef0;color:#496475}
.te-home .te-info b,.te-home .te-info .te-ikon,.te-home .te-info em{color:#123d46}
.te-home .te-tagline{color:#7b969d}
