/* ===========================
   JOK Arenys · UI (mínim)
   =========================== */
:root{
  --brand:#dc2626; --ink:#0f172a; --muted:#64748b; --line:#e5e7eb; --card:#fff; --chip:#f8fafc; --ring:#94a3b8;
  --shadow:0 6px 20px rgba(2,6,23,.08); --radius:16px;
}

/* Contenidor i tipografia */
.jok-arenys-bar, .jok-arenys-list{
  max-width:980px; margin:0 auto; color:var(--ink);
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans";
}

/* ===========================
   Toolbar / Filtres
   =========================== */
.jok-arenys-bar{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:10px 28px 28px; margin:10px auto 30px;
}
.jok-arenys-row{
  display:flex; flex-wrap:wrap; align-items:center; gap:14px;
}
.jok-arenys-left, .jok-arenys-right{ display:contents; }

/* Formularis/combos inline (excepte el d’equips) */
.jok-arenys-bar form:not(.jok-arenys-teams),
.jok-arenys-radio,
.jok-arenys-sort,
.jok-arenys-span,
.jok-aw-weekmenu-inline,
.jok-aw-navprev,
.jok-aw-navnext{
  display:inline-flex; align-items:center; gap:10px; margin:0;
}

/* Botons “Setmana ‹ / ›” */
.jok-arenys-btn-setmana{
  border:1px solid var(--line); background:#f3f4f6; color:#111827;
  border-radius:999px; padding:8px 12px; font-weight:600; cursor:pointer;
}
.jok-arenys-btn-setmana:focus{ outline:2px solid transparent; box-shadow:0 0 0 3px var(--ring); }

/* ===== Week picker (custom) */
.jok-aw-jump-title{ font-size:14px; font-weight:700; color:#6b7280; margin-right:4px;margin-bottom: 12px; }
.jok-aw-week-wrap{ position:relative; display:inline-block; min-width:240px; }
.jok-aw-week-btn{
  display:inline-flex; align-items:center; justify-content:space-between; gap:8px;
  width:100%; padding:8px 14px 8px 20px; border:0px solid var(--line); border-radius:999px; background:#fff; cursor:pointer;
}
.jok-aw-week-btn.is-current{ background:var(--brand); color:#fff; border-color:var(--brand); font-weight:700; }
.jok-aw-week-panel{
  position:absolute; left:0; right:0; top:calc(100% + 8px); z-index:40;
  max-height:320px; overflow:auto; background:#fff; border:1px solid var(--line);
  border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.08); padding:8px;
}
.jok-aw-week-opt{ padding:8px 10px; border-radius:8px; cursor:pointer; }
.jok-aw-week-opt:hover{ filter:brightness(.97); }
.jok-aw-week-opt.past-week{ background:#f3f4f6; color:#111827; }
.jok-aw-week-opt.current-week{ background:var(--brand); color:#fff; font-weight:700; }
.jok-aw-week-opt.future-week{ background:#fff; color:#111827; }
.jok-aw-week-opt[aria-selected="true"]{ outline:2px solid #000000; outline-offset:-2px; }
/* Amaga el select nadiu, accessible per submit */
.jok-aw-weekselect{
  position:absolute !important; inset:auto auto auto -9999px !important;
  width:1px !important; height:1px !important; opacity:0 !important; pointer-events:none !important;
}

/* ===== Nº de setmanes */
.jok-span-label{ font-size:14px; font-weight:700; color:#374151;
margin-top: 43px;
background-color: #dfe0e0; 
padding: 7px 8px;
border-radius: 15px;}
.jok-arenys-num{
  width:50px; text-align:center; border:1px solid var(--line); border-radius:10px; padding:4px 6px;
  -moz-appearance:textfield; appearance:textfield;
}
.jok-arenys-num::-webkit-outer-spin-button,
.jok-arenys-num::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.jok-stepper{ display:inline-flex; gap:6px; }
.jok-step{
  border:1px solid var(--line); background:#f3f4f6; border-radius:10px; padding:6px 12px;
  font-weight:700; line-height:1; cursor:pointer;
}

/* ===== Tots | Casa | Fora (segmented) */
.jok-arenys-radio label{
  display:inline-flex; align-items:center; gap:8px; padding:8px 18px; border:1px solid var(--line);
  border-radius:999px; background:var(--chip); cursor:pointer; user-select:none;
  margin-top: 60px; margin-bottom: 25px;
  background-color: #dddcdc !important;
  color: #535353;
}
.jok-arenys-radio input{ margin:0; }
.jok-arenys-radio label:has(input:checked){
  background:#fff; border-color:#cbd5e1; color:#0f172a; box-shadow:inset 0 0 0 1px #cbd5e1;
}

/* ===== Ordre */
.jok-arenys-sort{ padding:6px 10px; border:1px solid var(--line); border-radius:10px; background:#f8fafc; }
.jok-arenys-select{ border:0; background:transparent; }

/* ===== Equips (el FORM sencer a tota l’amplada i accions a sota) */
.jok-arenys-teams{
  /* ocupa una línia sencera dins de .jok-arenys-row */
  flex-basis:100%; width:100%;
  /* layout intern en files: xips a dalt (wrap), accions a sota */
  display:flex; flex-wrap:wrap; gap:12px; margin-top:12px;
}
.jok-arenys-teams fieldset{
  flex:1 1 100%; margin:0; padding:0; border:0;
  display:flex; flex-wrap:wrap; gap:12px;
}
.jok-arenys-checks legend{
  width:100%; margin:0 0 6px; font:700 14px/1.2 ui-sans-serif; color:var(--muted);
}
.jok-arenys-checks label{
  display:inline-flex; gap:8px; align-items:center;
  background:var(--chip); border:1px solid var(--line); border-radius:999px; padding:6px 10px; cursor:pointer;
}
.jok-arenys-checks input{ margin:0; }
.jok-arenys-checks label:has(input:checked){ background:#fff; border-color:#cbd5e1; }

/* 🔽 Accions sempre sota de tot, a tota l’amplada */
.jok-arenys-actions{
  flex:1 1 100%;
  display:flex;   
  justify-content: center;
  gap: 16px;
}
.jok-arenys-btn{
  display:inline-flex; 
  align-items:center; gap:6px;
  border:1px solid var(--line); 
  background:#f3f4f6; color:#111827;
  border-radius:10px; 
  padding:8px 12px; 
  font-weight:700; 
  cursor:pointer;
  
  text-align: center;
}

/* ===========================
   Llista de partits (mínim)
   =========================== */
.jok-arenys-list{ list-style:none; padding:0; }
.jok-arenys-item{
  border:1px solid var(--line); border-radius:var(--radius); padding:20px; margin:20px 0; background:var(--card);
  box-shadow:var(--shadow); border-left:8px solid #a8a5a5;
}
.jok-arenys-item.is-home{ border-left-color: var(--brand) !important; }
.jok-arenys-item .when{ font-weight:800; font-size:20px; }
.jok-arenys-item .teams{ font-size:20px; line-height:1.25; }
.jok-arenys-item .home-chip{
  display:inline-block; margin-left:10px; font-size:12px; font-weight:700;
  color:#ffffff; background-color: var(--brand) !important; border-radius:999px; padding:4px 10px;
  transform: translateY(-3px) ;
}

.jok-arenys-item .away-chip {
  display:inline-block; margin-left:10px; font-size:12px; font-weight:700;
  color:#ffffff; background:#979797; border-radius:999px; padding:4px 10px;
  transform: translateY(-3px) ;
}


.jok-cat,.jok-arenys-item .cat{
  display:inline-block; font-size:13px; font-weight:800; text-transform:uppercase;
  color:#fff; background:var(--brand); border-radius:10px; padding:6px 10px; margin-top:6px;
}
.jok-arenys-list .when .time{ font-variant-numeric:tabular-nums; padding:2px 6px; border-radius:4px; background:#ecedef; }
.jok-arenys-list .when .time::after{ content:"h"; }

@supports (-webkit-touch-callout:none){
  @media (prefers-color-scheme: dark){
    .jok-arenys-list .when .time{
      background:#ecedef !important;
      color:#000000 !important;
      -webkit-text-fill-color:#000000 !important;
    }
  }
}

/* Separador de setmana */
.jok-week-sep{ list-style:none; border-top:1px dashed var(--line); margin:40px 0 10px; padding-top:8px; }
.week-title-out{ margin:43px 0 16px 0; font-weight:800; font-size:clamp(1.8rem,3vw,2.2rem); text-align:right; color: #363636; }

/* Scroll anchor */
#aw-results{ scroll-margin-top:84px; }

/* ===========================
   Responsive
   =========================== */
@media (max-width: 720px){
  .jok-arenys-row{ flex-direction:column; align-items:stretch; gap:12px; }
  .jok-aw-week-wrap{ min-width:0; width:100%; }
  .jok-aw-week-btn{ width:100%; }
  .jok-arenys-span{ width:100%; }
  .jok-arenys-num{ width:50px; }
}

/* ===========================
   Dark (suau)
   =========================== */
@media (prefers-color-scheme: dark){
  :root{ --ink:#e5e7eb; --muted:#94a3b8; --line:#334155; --card:#0b1220; --chip:#0f172a; --shadow:0 6px 20px rgba(0,0,0,.35); }
  .jok-arenys-sort{ background:#0f172a; }
  .jok-arenys-checks label, .jok-arenys-num{ background:#0b1220; color:var(--ink); }
}


/* Xips ocupant tota la dreta dins la caixa */
.jok-arenys-teams{
  flex-basis:100%; width:100%;
  display:flex; flex-wrap:wrap; gap:12px; margin-top:0px !important;
}
.jok-arenys-teams fieldset{
  flex:1 1 100%; margin:0; padding:0; border:0;
  display:flex; flex-wrap:wrap; gap:12px;
}

/* Botons fora i sota la caixa (com la 2a imatge) */
.jok-arenys-actions{
  max-width:980px;
  margin:14px auto 0;              /* separació de la caixa */
  display:flex; gap:14px;
  padding:0 6px;                   /* petit aire lateral alineat amb la caixa */
}
.jok-arenys-btn{
  display:inline-flex; align-items:center; gap:6px;
  border:1px solid var(--line); background:#3f3f3f; color:#ffffff;
  border-radius:12px; padding:10px 14px; font-weight:800; cursor:pointer;
}

.jok-arenys-btn:hover{
   background:#676767; color:#ffffff;
  }

/* mòbil: centrar si vols */
@media (max-width:720px){
  .jok-arenys-actions{ justify-content:flex-start; padding:0 4px; }
}



/* Etiqueta d’equip a la DRETA (desktop) */
@media (min-width: 720px){
  .jok-arenys-item{
    display: grid;
    grid-template-columns: 1fr auto; /* text a l'esquerra, xip a la dreta */
    gap: 8px 14px;
    align-items: center;
  }

  .jok-arenys-item .when,
  .jok-arenys-item .teams{
    grid-column: 1; /* esq. */
  }

  .jok-arenys-item .jok-cat,
  .jok-arenys-item .cat{
    grid-column: 2;           /* dreta */
    justify-self: end;        /* enganxada a la dreta */
    margin-top: 0;            /* sense salt cap avall */
    width: auto;
    max-width: 100%;
  }
}

/* En mòbil la deixem sota el títol, com fins ara */
@media (max-width: 719px){
  .jok-arenys-item .jok-cat,
  .jok-arenys-item .cat{
    display: inline-block;
    margin-top: 15px;
    width: 100%;
    text-align: right;
  }
}

/* Fletxes del week-picker: columna a l'esquerra dins el botó */
.jok-aw-week-btn{
  position: relative;
  padding-left: 42px;       /* espai per a les fletxes */
  overflow: visible;        /* per si algun tema el força */
}
.jok-aw-arrows{
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 6px;
  opacity: .6;
  color: #9ca3af;          /* quan el botó és blanc */
}
.jok-aw-week-btn.is-current .jok-aw-arrows{ color:#ffffff; }  /* blanc sobre vermell */
.jok-aw-week-btn:hover .jok-aw-arrows{ opacity: 1; }

/* Triangles pur CSS (hereten currentColor) */
.jok-aw-arrows .arr{
  width:0; height:0; display:block;
  border-left:5px solid transparent; border-right:5px solid transparent;
}
.jok-aw-arrows .arr-up   { border-bottom:7px solid currentColor; }
.jok-aw-arrows .arr-down { border-top:7px solid currentColor; }


/* Week-picker: NO border vermell en hover/focus */
.jok-aw-week-btn{
  border:1px solid var(--line);           /* base neutra */
}
.jok-aw-week-btn:hover,
.jok-aw-week-btn:active{
  border-color: var(--line) !important;   /* manté gris */
}
.jok-aw-week-btn:focus{
  outline: none !important;
  border-color: var(--line) !important;
  box-shadow: 0 0 0 3px var(--ring);      /* anell suau, no vermell */
}

/* Només quan és la setmana actual (vermell), el border també és vermell */
.jok-aw-week-btn.is-current{
  background: var(--brand);
  color: #fff;
  border-color: var(--brand) !important;
}

.jok-arenys-muted2 {
  text-align: center;
  margin-top: 50px;
}

.jok-arenys-muted {
  text-align: center;
  margin-top: 30px;
}


#jok-filter-btn {
  padding-left: 80px;
  padding-right: 80px;
  background-color: var(--brand) !important;
  font-size: 23px;

}

#jok-filter-btn:hover {

  background-color: #303030 !important;

}

.jok-arenys-alert-list {
  background-color: rgb(242, 234, 224);
  padding: 45px;
  border-radius: 14px;
  margin-top: 30px;
}



/* ====== MOBILE FIX (≤ 640px): tot dins la caixa ====== */
@media (max-width:640px){
  .jok-arenys-bar{ padding:24px; }

  /* Línia principal una sota l’altra */
  .jok-arenys-row{ 
    flex-direction: column; 
    align-items: stretch; 
    gap: 12px; 
    width: 100% !important;
  }
  .jok-arenys-left,
  .jok-arenys-right{
    display:block; width:100%; min-width:0;
  }

  /* Week picker a 100% d’ample */
  .jok-aw-week-wrap{ display:block; width:100%; min-width:0; }
  .jok-aw-week-btn{ width:100%; box-sizing:border-box; }

  /* Evita que el menú surti de la caixa */
  .jok-aw-week-panel{
    left:0; right:auto; width:100%;
    min-width:0; max-width:100%;
  }

  /* “Setmanes a veure” ordenat i sense sortir */
  .jok-span-label{ 
    display:flex; flex-wrap:wrap; align-items:center; gap:8px; 
  }
  .jok-arenys-num{ width:auto; }

  /* Tots | Casa | Fora: wrap i botons igualats */
  .jok-arenys-radio{ flex-wrap:wrap; gap:8px; }
  .jok-arenys-radio label{ 
    flex:1 1 calc(33.333% - 8px); 
    justify-content:center; 
  }

  /* “Ordre” ocupa tota la línia */
  .jok-arenys-sort{ width:100%; box-sizing:border-box; }

  /* Xips d’equips amb wrap i sense desbordar */
  .jok-arenys-checks{ gap:10px; }
  .jok-arenys-checks label{ max-width:100%; }
}

/* Petita assegurança general contra desbordaments horitzontals */
.jok-arenys-bar *{ min-width:0; }


.jok-arenys-ordre {
  background-color: #f0f0f0;
  padding: 6px;
  border-radius: 10px;
  text-align: center;
  color: #767676;
}


/* Marcador de resultats (setmanes passades) */
.jok-arenys-list .when .score{
  display:inline-block;
  padding:2px 8px;
  border-radius:9999px;
  font-weight:700;
  line-height:1.2;
  margin-left:4px;
  background:#e5e7eb; /* fallback */
  color:#111827;
}
.jok-arenys-list .when .score--win{  background:#dcfce7; color:#166534; }
.jok-arenys-list .when .score--lose{ background:#fee2e2; color:#991b1b; }
.jok-arenys-list .when .score--draw{ background:#e5e7eb; color:#111827; }

/* (opcional) mostra FT si el fas servir */
.jok-arenys-list .when .status{
  display:inline-block;
  font-size:12px;
  padding:0 6px;
  margin-left:6px;
  border-radius:6px;
  background:#e5e7eb;
  color:#374151;
  vertical-align:baseline;
}



.jok-cat {
  margin-left: 25px !important;
   margin-top: 25px !important;

}

.teams {
  margin-top: 15px !important;

}

@media (max-width:768px){
  .jok-cat {
    margin-left: 0 !important;
  }
}


/* ESCRIPTORI: centra el guió respecte al text */
@media (min-width:1025px){
  .teams{ align-items:baseline; }                  /* baselines del text */
  .aw-team{ align-items:baseline; }
  .aw-sep{
    display:inline-block;
    height:auto;
    line-height:1;
    padding:0 .45rem;
    transform:translateY(-0.08em);                 /* pugen una mica el guió */
  }
}

/* MÒBIL/TABLET: mantenim l’ajust d’abans (si el tens) */
@media (max-width:1024px){
  .aw-sep{
    line-height:1;
    padding:0 .5rem;
    transform:translateY(0.25em);
  }
}

@media (min-width:1025px){
  /* baixa el logo 10px */
  .jok-arenys-list .aw-team .aw-logo-slot{
    margin-top:3px !important;
  }
  /* evita que l'alineació baseline el torni a moure */
  .jok-arenys-list .teams,
  .jok-arenys-list .aw-team{
    align-items:center !important;
  }
}




/* ===========================
   Alineació form + resultats
   =========================== */

.jok-arenys-toolbar,
.jok-arenys-form,
.anbic-viab-result{
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

/* Evitem que el form "s'obri" més del compte */
.jok-arenys-form{
  width: 100%;
  background-color: #ffffff;
   box-shadow: #9898985b 0px 0px 30px; 
}

/* En desktop, tot perfectament centrat */
@media (min-width: 900px){
  .jok-arenys-toolbar{
    display: flex;
    justify-content: center;
  }
}


/* =========================================================
   ANBICLUB · Viabilitat canvi (CSS final únic i net)
   ========================================================= */

/* Alineació: form i resultats amb el mateix ample */
.jok-arenys-toolbar,
.jok-arenys-form,
.anbic-viab-result{
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

/* IMPORTANT: el teu .jok-arenys-muted global centra i posa margin-top.
   Això et trencava el form. Ho neutralitzem només dins el form. */
.jok-arenys-form .jok-arenys-muted{
  text-align: left !important;
  margin-top: 0 !important;
}

/* ---------- FORM FI (compacte i pro) ---------- */
.jok-arenys-toolbar{
  padding: 10px 0;
}

.jok-arenys-form{
  width: 100%;
  background:#ffffff;
  border: 0px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow);
  padding: 25px;
margin-top: 30px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: flex-end;
}

/* Cada camp com a “mini-card” */
.jok-arenys-form > label{
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 14px;
  background: #ffffff;
  border: 0px solid var(--line);
}

/* Titols de camp */
.jok-arenys-form .jok-arenys-muted{
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .2px;
  text-transform: uppercase;
  color: var(--muted);
}

/* Inputs */
.jok-arenys-form select,
.jok-arenys-form input[type="date"],
.jok-arenys-form input[type="time"]{
  height: 42px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: #f8fafc;
  padding: 0 12px;
  font-weight: 900;
  color: #334155;
  outline: none;
  min-width: 0;
}

.jok-arenys-form select:focus,
.jok-arenys-form input[type="date"]:focus,
.jok-arenys-form input[type="time"]:focus{
  border-color: rgba(0,0,0,0.28);
  box-shadow: 0 0 0 3px rgba(0,0,0,0.08);
}

/* Layout desktop: fem que quadri fi */
.jok-arenys-form > label:nth-of-type(1){ flex: 0 0 260px; } /* Filtrar per equip */
.jok-arenys-form > label:nth-of-type(2){ flex: 1 1 520px; } /* Partit a canviar */
.jok-arenys-form > label:nth-of-type(3){ flex: 0 0 220px; } /* Nova data */
.jok-arenys-form > label:nth-of-type(4){ flex: 0 0 220px; } /* Nova hora */
.jok-arenys-form > label:nth-of-type(5){ flex: 0 0 220px; } /* Casa/Fora */

/* Botó */
.jok-arenys-form .button.button-primary{
  height: 44px;
  border-radius: 14px;
  padding: 0 22px;
  font-weight: 900;
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: var(--shadow);
  margin-left: 10px;
  margin-top: 20px;
  background-color: #818d9d;
  color:#ffffff;
}

.jok-arenys-form .button.button-primary:hover {
  background-color: #575f6b;
  color:#ffffff;
}

/* Mòbil: 1 columna */
@media (max-width: 700px){
  .jok-arenys-form{
    padding: 10px;
    gap: 8px;
  }
  .jok-arenys-form > label{
    width: 100%;
  }
  .jok-arenys-form select,
  .jok-arenys-form input[type="date"],
  .jok-arenys-form input[type="time"]{
    width: 100%;
  }
  .jok-arenys-form .button.button-primary{
    width: 100%;
  }
}

/* ---------- RESULTATS (compact mode) ---------- */
.anbic-viab-pill{
  border-radius: 14px;
  padding: 35px;
  text-align: center;
  font-weight: 900;
  border: 1px solid var(--line);
  box-shadow: 0px 0px 30px #6c6c6cbf !important;
  margin-bottom: 10px;
  scroll-margin-top: 30px;
}

.anbic-viab-pill-big{
  font-size: 38px;
  line-height: 1;
}

.anbic-viab-pill-sub{
  margin-top: 6px;
  font-size: 15px;
  font-weight: 900;
}

.anbic-viab-pill-ok{
  background: #4a9a36;
  color: #ffffff;
  border-color: #4a9a36;
}

.anbic-viab-pill-bad{
  background: #e51a1a;
  color: #ffffff;
  border-color: #e51a1a;
}

.anbic-viab-pill-warn{
  background: #fef9c3;
  color: #854d0e;
  border-color: #fde68a;
}

.anbic-viab-softwarn{
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #9a3412;
  font-weight: 800;
}

.anbic-viab-card{
  margin-top: 10px;
  padding: 25px;
  border-radius: 14px;
  background: var(--card);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}

.anbic-viab-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:8px;
}

.anbic-viab-card-title{
  font-size:19px;
  font-weight:900;
  color: var(--ink);
}

.anbic-viab-card-original{
  background:#f8fafc;
  border-left:8px solid #939393;
}

.anbic-viab-card-proposed{
  background:#f0f9ff;
   border-left:8px solid #64748b;
}

.anbic-viab-card-conflicts{
  background:#fff7f7;
  border-left:8px solid #991b1b;
}

.anbic-viab-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 9px;
  border-radius:999px;
  font-weight:900;
  font-size:11px;
  border:1px solid var(--line);
  background:#353535;
  color: #ffffff;
  white-space:nowrap;
}

.anbic-viab-badge-team{ text-transform:uppercase; }
.anbic-viab-badge-home{ background:#ecfeff; border-color:#a5f3fc; color:#155e75; }
.anbic-viab-badge-away{ background:#eff6ff; border-color:#bfdbfe; color:#1e3a8a; }
.anbic-viab-badge-diff{ background:#f1f5f9; border-color:#e2e8f0; color:#334155; }

.anbic-viab-card-meta{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:6px;
  margin-bottom:10px;
}

.anbic-viab-meta-item{
  
  border:1px solid var(--line);
  border-radius:10px;
  padding:8px 9px;
}

.anbic-viab-meta-k{
  display:block;
  font-size:10px;
  font-weight:900;
  color: var(--muted);
  margin-bottom:3px;
  text-transform:uppercase;
}

.anbic-viab-meta-v{
  display:block;
  font-size:13px;
  font-weight:900;
  color: var(--ink);
}

.anbic-viab-vs{
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  gap:8px;
  align-items:center;
}

.anbic-viab-vs-team{
  
  border:1px solid var(--line);
  border-radius:12px;
  padding:9px 9px;
}

.anbic-viab-vs-k{
  font-size:10px;
  font-weight:900;
  color: var(--muted);
  text-transform:uppercase;
  margin-bottom:3px;
}

.anbic-viab-vs-v{
  font-size:13px;
  font-weight:900;
  color: var(--ink);
  line-height:1.2;
}

.anbic-viab-vs-sep{
  font-weight:900;
  opacity:.55;
  padding:0 2px;
  font-size:12px;
}

.anbic-viab-conflicts-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:8px;
}

.anbic-viab-conflict{
  background:#ffffff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:30px;
}

.anbic-viab-conflict-top{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
  margin-bottom:6px;
}

.anbic-viab-conflict-date{
  font-weight:900;
  color: var(--ink);
  font-size:12px;
}

.anbic-viab-conflict-vs{
  margin-top:4px;
  font-weight:900;
  color: var(--ink);
  font-size:13px;
  line-height:1.2;
}

.anbic-viab-empty{
  margin-top:8px;
  padding:10px;
  border-radius:12px;
  background:#ffffff;
  border:1px dashed var(--line);
  font-weight:900;
  color: var(--muted);
}

@media (max-width: 520px){
  .anbic-viab-card-meta{ grid-template-columns: 1fr 1fr; }
  .anbic-viab-vs{ grid-template-columns: 1fr; }
  .anbic-viab-vs-sep{ display:none; }
}

/* ---------- LOADER (centrat) ---------- */
.anbic-viab-loading{
  position: fixed;
  inset: 0;
  background: rgba(255,255,255,0.75);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999999;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .15s ease, visibility .15s ease;
}

.anbic-viab-loading.is-visible{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.anbic-viab-loading-box{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  font-weight: 900;
  color: var(--ink);
}

.anbic-viab-spinner{
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 3px solid rgba(0,0,0,0.12);
  border-top-color: rgba(0,0,0,0.55);
  display: inline-block;
  animation: anbicSpin 0.8s linear infinite;
}

@keyframes anbicSpin{
  to { transform: rotate(360deg); }
}

.anbic-viab-loading-text{
  font-size: 14px;
}


/* =========================================================
   Viabilitat canvi - Mobil 100% (evitar desbordaments)
   ========================================================= */
@media (max-width: 700px){

  /* Tot dins la caixa, sense sorpreses */
  .jok-arenys-form,
  .jok-arenys-form *{
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
  }

  /* Cada camp ocupa 100% i no permet que el fill surti */
  .jok-arenys-form > label{
    width: 100% !important;
    flex: 0 0 100% !important;
    overflow: hidden;               /* clau: talla qualsevol cosa que surti */
  }

  /* Selects i inputs a 100% real */
  .jok-arenys-form select,
  .jok-arenys-form input[type="date"],
  .jok-arenys-form input[type="time"]{
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    display: block;
  }

  /* El select llarg (partit) NO pot sortir */
  .jok-arenys-form select[name="awc_match"]{
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Evita que algun tema posi white-space raro */
  .jok-arenys-form select option{
    white-space: normal;
  }
}

/* =========================================================
   FIX iPhone Safari: date/time no s'escapin
   ========================================================= */
@media (max-width: 700px){

  /* El label fa de "caixa" i talla qualsevol overflow */
  .jok-arenys-form > label{
    overflow: hidden !important;
  }

  /* Inputs i selects: 100% real + box sizing */
  .jok-arenys-form select,
  .jok-arenys-form input[type="date"],
  .jok-arenys-form input[type="time"]{
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* Safari iOS: els date/time tenen UI propia -> cal treure appearance */
  .jok-arenys-form input[type="date"],
  .jok-arenys-form input[type="time"]{
    -webkit-appearance: none !important;
    appearance: none !important;
    background-clip: padding-box !important;
  }

  /* En alguns iPhones, el control intern empeny cap a fora: força un "fit" a viewport */
  .jok-arenys-form{
    padding-left: 12px !important;
    padding-right: 12px !important;
    padding-bottom: 25px !important;
  }

  /* Assegura que cap camp pugui ser mes ample que la pantalla menys marges */
  .jok-arenys-form input[type="date"],
  .jok-arenys-form input[type="time"]{
    max-width: calc(100vw - 48px) !important; /* 24px marge total aprox */
  }
}

.anbic-premium-box{
  max-width:400px;
  margin:30px auto;
  padding:40px;
  border-radius:12px;
  background:#f5f5f5;
  border:1px dashed #bbb;
  text-align:center;
}
.anbic-premium-title{
  font-weight:700;
  font-size:18px;
  margin-bottom:6px;
}
.anbic-premium-text{
  opacity:.85;
  font-size:14px;
}

.aw-logo-slot {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 6px;
}

.aw-logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Fora modo junta: amaga tot */
body:not(.modo-junta) .botons-addons,
body:not(.modo-junta) .botons-addons2,
body:not(.modo-junta) .jok-alerts-toggle {
  display: none !important;
}

/* Modo junta: per defecte amaga els dos (per evitar herencies/inline vells) */
body.modo-junta .botons-addons,
body.modo-junta .botons-addons2 {
  display: none !important;
}

/* En modo junta: HOME -> mostra botons-addons */
body.modo-junta.home .botons-addons {
  display: block !important;
}

/* En modo junta: NO HOME -> mostra botons-addons2 */
body.modo-junta:not(.home) .botons-addons2 {
  display: block !important;
}

/* En modo junta: alerts sempre visibles */
body.modo-junta .jok-alerts-toggle {
  display: block !important;
}



.botons-addons a {
  position: absolute;
  top: 0;
  right: 0;
  max-width: 300px;
  width: auto;
  text-align: center;
  border-radius: 0px 0px 0px 13px;
  background-color: var(--brand) !important;
  padding: 8px 22px;
  color: #ffffff;
  opacity: 0.7;
}

.botons-addons2 a {
  position: absolute;
  top: 0;
  right: 0;
  max-width: 300px;
  width: auto;
  text-align: center;
  border-radius: 0px 0px 0px 13px;
  background-color: #000000;
  padding: 8px 16px;
  color: #ffffff;
  opacity: 0.7;
}


.botons-addons a:hover, .botons-addons2 a:hover {
    background-color: #303030 !important;
}


@media (max-width: 768px) {

  .botons-addons, .botons-addons2 {
    text-align: center;margin-bottom: 35px;
  }


}





.anbic-viab-pill {
  margin-bottom: 16px;
}

.anbic-viab-card-conflicts {
  margin-top: 0;
  margin-bottom: 18px;
}

.anbic-viab-softwarn {
  margin-top: 10px;
  margin-bottom: 18px;
  
}


.jok-alerts-toggle {
  background-color: #e51a1a;
  color: #ffffff;
  padding: 8px 16px;
  border: 2px solid #e51a1a; 
  border-style: ridge;
  border-radius: 12px;
  margin-left: -2px;
  font-size: 110%;
  font-weight: 600;
}

.jok-alerts-toggle:hover {
  background-color: #b50f0f;
  color: #ffffff;
 
}

/* ================= CONVOCATORIES TOGGLE ================= */

.jok-arenys-item{
  position:relative;
}

.anbi-conv-toggle-wrap{
  grid-column: 2;
  justify-self: end;
  margin-top: 8px;

}

.anbi-conv-toggle{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 10px;
  border:none;
  background:#eef4fa;
  border-radius:999px;
  cursor:pointer;
  font-size:12px;
  font-weight:600;
 
  white-space:nowrap;
  width:auto;
}

.anbi-conv-toggle-text {
  padding-left: 25px;

}

.anbi-conv-toggle:hover{
  background:#e2e8f0;
}

.anbi-conv-toggle-icon{
  width:14px;
  height:14px;
  font-size:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.anbi-conv-panel{
  grid-column: 1 / -1;
  margin-top: 12px;
}

@media (max-width: 719px){
  .anbi-conv-toggle-wrap{
    grid-column: 1 / -1;
    justify-self: end;
    margin-top: 8px;
  }

  .anbi-conv-panel{
    grid-column: 1 / -1;
  }
}




/* ===== AJUST TARGETES PARTITS · VERSIO MES VISIBLE ===== */

.jok-arenys-list .jok-arenys-item{
  padding: 20px 24px !important;
  row-gap: 10px !important;
  column-gap: 18px !important;
}

.jok-arenys-list .jok-arenys-item .when{
  margin-bottom: 6px !important;
  font-size: 19px !important;
  line-height: 1.1 !important;
}

.jok-arenys-list .jok-arenys-item .teams{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  font-size: 18px !important;
  line-height: 1.15 !important;
  margin-top: 0 !important;
}

.jok-arenys-list .jok-arenys-item .teams img{
  max-height: 38px !important;
  width: auto !important;
}

.jok-arenys-list .jok-arenys-item .aw-sep{
  margin: 0 2px !important;
  opacity: .35 !important;
  transform: translateY(-1px);
}

.jok-arenys-list .jok-arenys-item .jok-cat{
  font-size: 13px !important;
  padding: 8px 14px !important;
  border-radius: 14px !important;
  justify-self: end !important;
  align-self: start !important;
}

.jok-arenys-list .jok-arenys-item .anbi-conv-toggle-wrap{
  margin-top: 6px !important;
  grid-column: 2 !important;
  justify-self: end !important;
  align-self: start !important;
}

.jok-arenys-list .jok-arenys-item .anbi-conv-toggle{
  padding: 4px 12px 4px 15px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
  border: 1px solid #3f3f3f;
}

.jok-arenys-list .jok-arenys-item .anbi-conv-panel{
  grid-column: 1 / -1 !important;
  margin-top: 10px !important;
}

@media (max-width: 719px){
  .jok-arenys-list .jok-arenys-item{
    padding: 18px 18px !important;
    row-gap: 8px !important;
  }

  .jok-arenys-list .jok-arenys-item .teams{
    font-size: 16px !important;
    gap: 10px !important;
  }

  .jok-arenys-list .jok-arenys-item .teams img{
    max-height: 36px !important;
  }

  .jok-arenys-list .jok-arenys-item .jok-cat{
    font-size: 12px !important;
    padding: 7px 12px !important;
  }

  .jok-arenys-list .jok-arenys-item .when{
  margin-bottom: 20px !important;
  
}
}
.anbi-conv-panel{
  grid-column:1 / -1;
  margin-top:12px;
  max-height:0;
  overflow:hidden;
  opacity:0;
  transition:max-height .35s ease, opacity .25s ease;
  will-change:max-height, opacity;
}

.anbi-match{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
}

.anbi-match-left{
  flex:1;
  min-width:0;
}

.anbi-convocatoria{
  width:100%;
  background:#f8fafc;
  border:1px solid #dbe6f2;
  border-radius:22px;
  padding:0;
}

.anbi-convocatoria-inner{
  width:100%;
  max-width:560px;
  margin:10px auto 30px;
  padding:10px 28px 28px;
  border-radius:16px;
  text-align:left;
  box-shadow:var(--shadow);
}

.anbi-convocatoria-title{
  margin:0 0 18px;
  font-size:18px;
  font-weight:800;
  text-align: center !important;
  text-decoration: underline;
  
}

.anbi-convocatoria-head{
  margin-bottom:18px;
  padding-bottom:18px;
  border-bottom:1px solid #dbe6f2;
}

.anbi-convocatoria-match{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:30px;
  margin-top: 20px;
}

.anbi-convocatoria-team-wrap{
  display:inline-flex;
  align-items:center;
  min-width:0;
}

.anbi-convocatoria-vs{
  margin:0 2px;
  font-size:16px;
  font-weight:800;
  line-height:1;
  opacity:.55;
}

.anbi-convocatoria-match .aw-team{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.anbi-convocatoria-match .aw-logo-slot{
  width:30px;
  height:30px;
  flex:0 0 30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.anbi-convocatoria-match .aw-logo{
  width:30px;
  height:30px;
  display:block;
  object-fit:contain;
}

.anbi-convocatoria-match .aw-team-name{
  display:inline-block;
  min-width:0;
  font-size:18px;
  font-weight:800;
  line-height:1.2;
  color:#0f172a;
}

.anbi-convocatoria-match .aw-sponsor,
.anbi-convocatoria-match .aw-club{
  font:inherit;
  color:inherit;
}

.anbi-convocatoria-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:14px;
}

.anbi-convocatoria-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 22px;
  border-radius:999px;
  font-size:16px;
  font-weight:800;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.02em;
}

.anbi-convocatoria-badge--home{
  background:var(--anbi-accent, #ef4444);
  color:#fff;
}

.anbi-convocatoria-badge--away{
  background:#4b5563;
  color:#fff;
}

.anbi-convocatoria-meta-text{
  font-size:16px;
  font-weight:500;
  color:#0f172a;
}

.anbi-convocatoria-chip{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 22px;
  border-radius:999px;
  background:#dfe4ec;
  color:#172033;
  font-size:16px;
  font-weight:800;
  line-height:1;
}

.anbi-convocatoria-body{
  width:100%;
  max-width:560px;
  margin:0 auto;
  text-align:left;
}

.anbi-convocatoria-sub{
  margin:18px 0 10px;
  font-size:16px;
  font-weight:800;
}

.anbi-convocatoria-list{
  margin:0;
  padding-left:24px;
}

.anbi-convocatoria-list li{
  margin:0 0 10px;
}

.anbi-convocatoria-group{
  margin-top:10px;
}

.anbi-convocatoria-group strong{
  display:block;
  margin-bottom:8px;
}

.anbi-conv-meta{
  margin-top:16px;
  font-size:15px;
  line-height:1.55;
  color:#667085;
}

.anbi-convocatoria-comment{
  margin-top:8px;
  line-height:1.6;
  color:#0f172a;
}

@media (min-width:1024px){
  .anbi-convocatoria-match .aw-team-name{
    font-size:20px;
  }
}

@media (max-width:1023px){
  .anbi-convocatoria{
    width:100%;
  }
}

@media (max-width:767px){
  .anbi-convocatoria-inner{
    margin:0;
    padding:22px 20px 24px;
    box-shadow:none;
  }

  .anbi-convocatoria-body{
    max-width:none;
    margin:0;
  }

  .anbi-convocatoria-match .aw-team-name{
    font-size:17px;
  }

  .anbi-convocatoria-meta{
    gap:10px;
  }

  .anbi-convocatoria-badge,
  .anbi-convocatoria-chip{
    min-height:40px;
    padding:0 18px;
    font-size:15px;
  }

  .anbi-convocatoria-meta-text{
    font-size:15px;
  }

  .anbi-convocatoria-match {
    margin: 30px auto;

  }

  .anbi-convocatoria-title {
    text-align: center !important;
    margin-top: -20px;
  }
}

.anbi-convocatoria-match{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
}

.anbi-convocatoria-team-wrap{
  width:100%;
  justify-content:center;
}

.anbi-convocatoria-match .aw-team{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-align:center;
}

.anbi-convocatoria-match .aw-logo-slot{
  width:42px;
  height:42px;
  flex:0 0 42px;
}

.anbi-convocatoria-match .aw-logo{
  width:42px;
  height:42px;
}

.anbi-convocatoria-match .aw-team-name{
  font-size:17px;
  line-height:1.15;
  text-align:center;
}

.anbi-convocatoria-vs{
  width:100%;
  display:block;
  text-align:center;
  margin:2px 0;
  font-size:16px;
}

.anbi-convocatoria-match .aw-team-name{
  max-width:260px;
  margin:0 auto;
}


.anbi-conv-toggle{
  position:relative;
  padding-left:36px;
}

.anbi-conv-toggle::before{
  content:"📋";
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  font-size:16px;
  opacity:.9;
}

.anbi-conv-toggle.is-open::before {
  transform:rotate(90deg);
}



/* =========================
   CONVOCATORIES FRONT
========================= */
.anbi-conv-front-wrap{
  max-width:900px;
  margin:24px auto;
}

.anbi-conv-front-tabs{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

.anbi-conv-front-tab{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 18px;
  border-radius:999px;
  background:#e2e8f0;
  color:#0f172a;
  text-decoration:none;
  font-weight:800;
}

.anbi-conv-front-tab.is-active{
  background:var(--anbi-accent, #ef4444);
  color:#fff;
}

.anbi-conv-front-filters{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  align-items:end;
  margin-bottom:20px;
}

.anbi-conv-front-filter label{
  display:block;
  margin-bottom:6px;
  font-size:14px;
  font-weight:700;
}

.anbi-conv-front-filter select{
  min-width:220px;
  min-height:44px;
  padding:0 14px;
  border:1px solid #cbd5e1;
  border-radius:12px;
  background:#fff;
}

.anbi-conv-front-content{
  display:block;
}

.anbi-conv-front-section{
  display:grid;
  gap:18px;
}

.anbi-conv-front-card{
  background:#fff;
  border:1px solid #dbe6f2;
  border-radius:18px;
  padding:20px;
  box-shadow:0 10px 28px rgba(15,23,42,.04);
}

.anbi-conv-front-card-title{
  margin:0 0 16px 0;
  font-size:18px;
  font-weight:800;
  color:#0f172a;
}

.anbi-conv-front-grid{
  display:grid;
  gap:16px;
  margin-bottom:16px;
}

.anbi-conv-front-grid--2{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.anbi-conv-front-label{
  display:block;
  margin-bottom:6px;
  font-size:14px;
  font-weight:700;
}

.anbi-conv-front-input,
.anbi-conv-front-textarea{
  width:100%;
  border:1px solid #cbd5e1;
  border-radius:12px;
  background:#fff;
  padding:12px 14px;
  font:inherit;
}

.anbi-conv-front-textarea{
  resize:vertical;
}

.anbi-conv-front-help{
  margin-top:6px;
  font-size:13px;
  color:#64748b;
}

.anbi-conv-front-actions{
  margin-top:16px;
}

.anbi-conv-front-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 18px;
  border:0;
  border-radius:12px;
  cursor:pointer;
  font:inherit;
  font-weight:800;
}

.anbi-conv-front-btn--primary{
  background:var(--anbi-accent, #ef4444);
  color:#fff;
}

.anbi-conv-front-checkgrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.anbi-conv-front-check{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:10px 12px;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#f8fafc;
}

.anbi-conv-front-check--main{
  margin-bottom:16px;
  background:#fff7ed;
  border-color:#fdba74;
}

.anbi-conv-front-check input{
  margin-top:3px;
}

.anbi-conv-front-sub{
  margin:16px 0 10px 0;
  font-size:16px;
  font-weight:800;
}

.anbi-conv-front-group{
  margin-bottom:14px;
}

.anbi-conv-front-group-title{
  margin-bottom:8px;
  font-weight:800;
}

.anbi-conv-front-notice{
  margin-bottom:16px;
  padding:12px 14px;
  border-radius:12px;
  font-weight:700;
}

.anbi-conv-front-notice--ok{
  background:#dcfce7;
  color:#166534;
}

.anbi-conv-front-notice--error{
  background:#fee2e2;
  color:#991b1b;
}

.anbi-conv-front-empty,
.anbi-conv-front-locked{
  padding:16px 18px;
  border:1px solid #dbe6f2;
  border-radius:14px;
  background:#fff;
}

@media (max-width: 767px){
  .anbi-conv-front-grid--2,
  .anbi-conv-front-checkgrid{
    grid-template-columns:1fr;
  }

  .anbi-conv-front-filter select{
    min-width:0;
    width:100%;
  }

  .anbi-conv-front-filters{
    display:grid;
    grid-template-columns:1fr;
  }
}


.anbi-conv-front-locked{
  text-align:center;
}

.anbi-conv-front-locked .anbi-conv-front-btn{
  display:inline-flex;
  margin-top:10px;
}


.anbi-convocatories-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}

.anbi-convocatories-link{
  background:#111 !important;
  color:#fff !important;
  border-color:#111 !important;
}


.anbi-top-shortcuts{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin:0 0 16px 0;
  flex-wrap:wrap;
}

.anbi-top-shortcut{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  padding:12px 16px;
  border-radius:14px;
  font-weight:700;
}

.anbi-top-shortcut--convocatories{
  background:#111;
  color:#fff;
}


.anbi-viab-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin:0 0 18px 0;
}

.anbi-viab-topbar-left,
.anbi-viab-topbar-right{
  display:flex;
  align-items:center;
  gap:10px;
}

.anbi-viab-top-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:16px 22px;
  border-radius:0 0 0 28px;
  background:#e97676;
  color:#fff;
  font-weight:700;
  font-size:18px;
}

.anbi-viab-top-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:14px 18px;
  border-radius:12px;
  background:#111;
  color:#fff;
  text-decoration:none;
  font-weight:700;
}

.anbi-viab-top-link:hover{
  opacity:.92;
  color:#fff;
}


/* ===== ACCIONS MENU (junta) ===== */

.botons-addons,
.botons-addons2{
  position: relative;
}

.botons-addons .anbi-actions-menu,
.botons-addons2 .anbi-actions-menu{
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  z-index: 999999 !important;
  margin: 0 !important;
}

.anbi-actions-toggle{
  display: inline-flex;
  margin: 0 !important;
  align-items: center;
  gap: 8px;
  border: 0;
  cursor: pointer;
  border-radius: 0 0 0 13px;
  padding: 11px 25px;
  color: #ffffff;
  font-weight: 700;
  line-height: 1.2;
  opacity: .92;
}

.botons-addons .anbi-actions-toggle{
  background: var(--brand) !important;
}

.botons-addons2 .anbi-actions-toggle{
  background: #000000 !important;
}

.anbi-actions-toggle:hover{
  opacity: 1;
}

.anbi-actions-caret{
  font-size: 12px;
  line-height: 1;
}

.anbi-actions-panel{
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 290px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 14px 0 14px 14px;
  box-shadow: 0 14px 34px rgba(0,0,0,.14);
  padding: 8px;
  display: none;
}

.anbi-actions-menu.is-open .anbi-actions-panel{
  display: block;
}

.anbi-actions-panel a{
  display: flex;
  align-items: center;
  text-decoration: none;
  padding: 12px 14px;
  border-radius: 10px;
  color: #111827 !important;
  background: #ffffff !important;
  font-weight: 700;
  opacity: 1 !important;
  position: static !important;
  width: 100% !important;
  max-width: none !important;
  text-align: left !important;
  border-radius: 10px !important;
}

.anbi-actions-panel a:hover{
  background: #f3f4f6 !important;
  color: #111827 !important;
}

@media (max-width: 768px){

  .botons-addons,
  .botons-addons2{
    margin-bottom: 0;
  }

.botons-addons .anbi-actions-menu,
.botons-addons2 .anbi-actions-menu{
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  z-index: 999999 !important;
  margin: 0 !important;
  transform: none !important;
}

  .anbi-actions-toggle{
    border-radius: 0 0 0 13px !important;
    margin: 0 !important;
    padding: 8px 18px !important;
  }

  .anbi-actions-panel{
    top: calc(100% + 6px) !important;
    right: 0 !important;
    left: auto !important;
    min-width: 300px !important;
  }
}


/* ===== admin addons ===== */


.aw-addon-card{
  background:#ffffff;
  border:1px solid #d9e2ec;
  border-radius:16px;
  padding:18px 20px;
  box-shadow:0 6px 20px rgba(15,23,42,.05);
  max-width:760px;
}

.aw-addon-card + .aw-addon-card{
  margin-top:14px;
}

.aw-addon-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:10px;
  flex-wrap:wrap;
}

.aw-addon-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  background:#eef2ff;
  color:#3730a3;
  font-weight:700;
  font-size:12px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.aw-addon-title{
  font-size:16px;
  font-weight:700;
  color:#0f172a;
  margin:0;
}

.aw-addon-mainlabel{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-weight:600;
}

.aw-addon-mainlabel input[type="checkbox"]{
  transform:scale(1.1);
}

.aw-addon-fields{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid #eef2f7;
}

.aw-addon-inline{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:0 0 10px;
}

.aw-addon-note{
  margin:8px 0 0;
  color:#475569;
}

.aw-addon-code{
  background:#f8fafc;
  border:1px solid #e2e8f0;
  border-radius:10px;
  padding:8px 10px;
}

@media (max-width: 782px){
  .aw-addon-card{
    padding:16px;
  }

  .aw-addon-head{
    align-items:flex-start;
    flex-direction:column;
  }
}

.form-table th[scope="row"]{
  width:220px;
  vertical-align:top;
  padding-top:24px;
}


.anbi-conv-front-checkgrid--absents .anbi-conv-front-check {
  background: #fff4f4;
  border-color: #f1caca;
}

.anbi-conv-front-checkgrid--reinforcements .anbi-conv-front-check {
  background: #f3f7ff;
  border-color: #cdddff;
}


.anbi-row-rel{
  position: relative;
}

.anbi-mascota-floating{
  position: absolute;
  left: 20px;
  top: -84px; /* <-- ajusta això */
  width: 100px;
  z-index: 3;
  pointer-events: none;
}

.anbi-mascota-floating img{
  width: 100%;
  height: auto;
  display: block;
}

@media (max-width: 767px){
  .anbi-mascota-floating{
    width: 90px;
    top: -86px;
    left: 2px;
  }
}


/* ===== LOGOS CLUBS · FORÇAR MIDA ===== */

.aw-logo-slot {
  width: 30px !important;
  height: 30px !important;
}

.aw-logo {
  width: 30px !important;
  height: 30px !important;
}

/* mòbil */
@media (max-width: 768px){
  .aw-logo-slot {
    width: 30px !important;
    height: 30px !important;
  }

  .aw-logo {
    width: 30px !important;
    height: 30px !important;
  }

  /* evita que algun altre CSS els limiti */
  .jok-arenys-list .teams img {
    max-height: 30px !important;
  }
}




/* =========================
   Families preferences
   ========================= */

.anbi-pref-bar{
  width:100%;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin:4px 0 8px;
}

.anbi-pref-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 16px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#ffffff;
  color:#0f172a;
  font-weight:800;
  cursor:pointer;
}

.anbi-pref-btn:hover{
  background:#f8fafc;
}

.anbi-pref-btn--primary{
  background:var(--brand);
  color:#ffffff;
  border-color:var(--brand);
}

.anbi-pref-btn--primary:hover{
  background:#303030;
  border-color:#303030;
}

.anbi-pref-link{
  border:0;
  background:transparent;
  color:#64748b;
  font-weight:700;
  cursor:pointer;
  padding:0 4px;
}

.anbi-pref-link:hover{
  color:#0f172a;
  text-decoration:underline;
}

.anbi-pref-modal[hidden]{
  display:none !important;
}

.anbi-pref-modal{
  position:fixed;
  inset:0;
  z-index:999999;
}

.anbi-pref-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.45);
}

.anbi-pref-modal-card{
  position:relative;
  width:min(560px, calc(100vw - 28px));
  margin:8vh auto 0;
  background:#ffffff;
  border-radius:22px;
  padding:24px;
  box-shadow:0 20px 60px rgba(2,6,23,.28);
}

.anbi-pref-close{
  position:absolute;
  top:12px;
  right:12px;
  width:38px;
  height:38px;
  border:0;
  border-radius:999px;
  background:#eef2f7;
  color:#0f172a;
  font-size:24px;
  line-height:1;
  cursor:pointer;
}

.anbi-pref-kicker{
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--brand);
  margin-bottom:8px;
}

.anbi-pref-title{
  margin:0 0 8px;
  font-size:26px;
  line-height:1.1;
  color:#0f172a;
}

.anbi-pref-text{
  color:#64748b;
  font-size:15px;
  line-height:1.45;
  margin-bottom:18px;
}

.anbi-pref-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:18px;
}

.anbi-pref-chip{
  position:relative;
  display:inline-flex;
  align-items:center;
  cursor:pointer;
}

.anbi-pref-chip input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.anbi-pref-chip span{
  display:inline-flex;
  align-items:center;
  min-height:42px;
  padding:0 14px;
  border:1px solid #dbe6f2;
  border-radius:999px;
  background:#f8fafc;
  color:#0f172a;
  font-weight:700;
}

.anbi-pref-chip input:checked + span{
  background:var(--brand);
  border-color:var(--brand);
  color:#ffffff;
}

.anbi-pref-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}

html.anbi-pref-modal-open,
body.anbi-pref-modal-open{
  overflow:hidden;
}

@media (max-width:640px){
  .anbi-pref-modal-card{
    margin:16px auto 0;
    padding:20px 16px 16px;
    border-radius:18px;
  }

  .anbi-pref-title{
    font-size:22px;
    padding-right:34px;
  }

  .anbi-pref-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .anbi-pref-bar{
    justify-content:flex-start;
  }
}


.anbi-pref-btn.active{
  background:#000;
  color:#fff;
  border-color:#000;

  /* 👉 efecte separació */
  box-shadow: 0 0 0 2px #fff, 0 0 0 3px #000;
}


.anbi-myteams-label{
  font-size:20px;
  font-weight:800;
  color:var(--brand);
  text-align:right;
  margin:0 0 0px 0;
  line-height:1.1;
}

.anbi-week-main-title{
  display:block;
}



.anbi-pref-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.anbi-pref-link{
  font-weight:800;
  cursor:pointer;
}

.anbi-pref-link:hover{
  color:var(--brand);
  text-decoration:none;
}

.anbi-pref-link span:first-child{
  transition:transform .2s ease;
}

.anbi-pref-link:hover span:first-child{
  transform:rotate(20deg);
}


.aw-team-name{
  line-height:1.2;
}

@media (min-width:601px){
  .aw-team{
    display:inline-flex;
    align-items:center;
    min-width:0;
  }

  .aw-team-name{
    white-space:nowrap;
    overflow:visible;
    text-overflow:clip;
  }
}

@media (max-width:600px){
  .jok-arenys-list .jok-arenys-item .aw-team{
    min-width:0;
    width:42%;
    max-width:42%;
  }

  .jok-arenys-list .jok-arenys-item .aw-team-name{
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
    overflow-wrap:break-word;
    word-break:normal;
    max-width:100%;
    text-align:center;
  }
}


.anbi-pref-order-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  width:100%;
  margin:7px 0 4px;
  flex-wrap:nowrap;
}

.anbi-pref-bar{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  min-width:0;
}

.anbi-order-slot{
  margin-left:auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex:0 0 auto;
  background-color: #ffffff;
  padding: 4px 10px;
  border-radius: 13px;
  border: solid 1px #cfcfcf;
}

.anbi-order-slot label{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0;
  white-space:nowrap;
}

@media (max-width: 767px){
  .anbi-pref-order-row{
    flex-direction:column;
    align-items:flex-start;
  }

  .anbi-order-slot{
    margin-left:0;
    justify-content:flex-start;
    width:100%;
  }
}


.jok-arenys-radio label {
  margin-top: 0px;
  margin-bottom: 15px;
  
}

.jok-arenys-radio {
  margin-top: 50px;
}

.anbi-pref-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.anbi-pref-btn .anbi-icon{
  display:inline-block;
  transition:transform 0.4s ease;
}

/* Hover efecte gir */
.anbi-pref-btn:hover .anbi-icon{
  transform:rotate(360deg);
}

.anbi-pref-btn.active:hover .anbi-icon{
  transform:rotate(360deg);
}



/* Popup preferits */
.anbi-pref-modal-card {
  position: relative;
  width: min(92vw, 520px);
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: border-box;
}

/* capçalera fixa visualment dins del card */
.anbi-pref-modal-card h3,
.anbi-pref-modal-card .anbi-pref-title {
  flex: 0 0 auto;
}

/* zona scrollable del contingut */
.anbi-pref-modal-body {
  flex: 1 1 auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  min-height: 0;
  padding-right: 4px;
}

/* peu amb botons sempre visible */
.anbi-pref-modal-actions {
  flex: 0 0 auto;
  position: sticky;
  bottom: 0;
  background: #fff;
  padding-top: 12px;
  border-top: 1px solid #e5e7eb;
}

/* mòbil: una mica més ajustat */
@media (max-width: 640px) {
  .anbi-pref-modal-card {
    width: calc(100vw - 20px);
    max-height: calc(100vh - 20px);
    max-height: calc(100dvh - 20px);
    border-radius: 14px;
  }

  .anbi-pref-modal-body {
    padding-bottom: 8px;
  }

  .anbi-pref-modal-actions {
    padding-bottom: env(safe-area-inset-bottom, 0);
  }
}

@media (max-width: 640px) {
  .anbi-pref-modal-card {
    max-height: calc(100dvh - 20px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 90px !important;
  }
}


.anbi-pref-modal {
  position: fixed;
  inset: 0;
  z-index: 99999; /* més alt que qualsevol cosa del teu plugin */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* fons fosc */
.anbi-pref-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
}

.anbi-pref-modal-card {
  position: relative;
  z-index: 2;
}

.anbi-pref-modal {
  pointer-events: auto;
}

.anbi-pref-modal-backdrop {
  pointer-events: auto;
}