/* ── CSV Captcha — palette coordinata col sito ── */
/* Previene dark mode forzato da Chrome/Android */
:root { color-scheme: light; }

#captcha-board {
  display: grid;
  grid-template-columns: repeat(8, 36px);
  grid-template-rows: repeat(8, 36px);
  width: fit-content;
  margin: 12px auto;
  border: 2px solid #C8B89A;
  box-sizing: content-box;
}

.c-square {
  width: 36px;
  height: 36px;
  position: relative;
  overflow: hidden;
}

.c-light { background: #EDE8DC; }
.c-dark  { background: #547C55; }

.c-square img {
  width: 100%;
  height: 100%;
}

.c-selected { background: #C8A855 !important; }

.c-solved {
  border: 5px solid #16a34a !important;
  box-shadow: 0 0 14px rgba(22, 163, 74, 0.4);
}

.c-error {
  border: 5px solid #dc2626 !important;
  box-shadow: 0 0 14px rgba(220, 38, 38, 0.35);
}

/* ── Label (turno) ── */
.captcha-label {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  margin: 8px auto 4px;
  font-family: 'Lato', sans-serif;
  font-size: 0.82rem;
  color: #5A5A5A;
}

.captcha-label img { width: 22px; }

/* ── Messaggio esito ── */
#captcha-msg {
  margin-top: 8px;
  font-size: 0.82rem;
  text-align: center;
  font-family: 'Lato', sans-serif;
  min-height: 20px;
}

#captcha-msg.success { color: #16a34a; font-weight: 700; }
#captcha-msg.error   { color: #dc2626; }

#captcha-msg.success .cm-text   { color: #16a34a; font-weight: 700; }
#captcha-msg .cm-result         { color: #1A1A1A; margin-left: 8px; font-weight: 600; }

/* ── Mobile: caselle più piccole per stare nel form ── */
@media (max-width: 440px) {
  #captcha-board {
    grid-template-columns: repeat(8, 32px);
    grid-template-rows: repeat(8, 32px);
  }
  .c-square {
    width: 32px;
    height: 32px;
  }
}

/* ── Wrapper ── */
.captcha-wrapper {
  margin-top: 16px;
  padding: 16px;
  background: #F7F3EA;
  border: 1px solid #C8B89A;
  text-align: center;
}

.captcha-hint {
  font-family: 'Cinzel', serif;
  font-size: 0.68rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #A88B3A;
  display: block;
  margin-bottom: 4px;
}