/* =========================================================
   Pirate Skin — overrides for base scoreboard
   Charge après base.css
   ========================================================= */

/* Font du thème */
@import url('https://fonts.googleapis.com/css2?family=Uncial+Antiqua&display=swap');

/* ---------- Variables de thème (reprennent celles de base.css) ---------- */
:root {
  --bg: #F1D6A5;              /* sable / parchemin */
  --fg: #2C1E1A;              /* brun foncé (texte principal) */
  --muted: #6e564e;           /* texte secondaire */
  --line: #bfa48f;            /* bordures / séparateurs */
  --surface: #F6E5C4;         /* surfaces cartes / cellules */
  --overlay: rgba(70, 42, 20, 0.35); /* overlays translucides */
  --menu-bg: #111111;         /* menu fixe (si tu veux autre chose que défaut) */
  --footer-total-bg: #462A14; /* fond du footer des totaux */

  /* surfaces spécifiques */
  --hole-surface: #D8A34A;
  --hole-surface-even: #E2B86A;
}

/* ---------- Page / fond / typo ---------- */
html, body { height: 100%; }
body {
  font-family: 'Uncial Antiqua', cursive, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
  background-color: var(--bg);
  color: var(--fg);

  /* Image de fond du skin */
  background-image: url('/static/game_assets/images/bckgnd_pirate.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

/* ---------- Ajustements spécifiques au skin ---------- */

/* Logo légèrement plus haut sur ce thème */
.logo { max-height: 100px; }

/* Footer des totaux — remplace l’overlay neutre par un fond plein pirate */
#scoreTotalFooter {
  background-color: var(--footer-total-bg);
}

/* Si tu utilises #menuFooter, tu peux activer la variable du skin
   (sinon garde le comportement du base.css) */
/* #menuFooter { background-color: var(--menu-bg); } */

/* Offcanvas “items de trou” en teintes pirate */
.offcanvas-bottom.hole-item      { background-color: var(--hole-surface); }
.offcanvas-bottom.hole-item.even { background-color: var(--hole-surface-even); }
.hole-item                       { color: var(--fg); }

/* Hauteur utile différente pour ce skin */
.scoreboard-container { max-height: calc(100dvh - 260px); }

/* ---------- Boutons spécifiques au scoreboard ----------
   ⚠️ On ne touche pas aux .btn-primary/.btn-secondary Bootstrap
   (évite les surprises). On skinne seulement tes classes custom. */

/* Teinte pleine pour “trou” */
.btn-hole {
  background-color: var(--fg);
  color: var(--bg);
  border: 1px solid var(--fg);
}

/* Variante outline pour “score” */
.btn-score {
  background-color: transparent;
  color: var(--fg);
  border: 1px solid var(--fg);
}