/* /crossword/css/worksheet.css */
/* Matches WordSearch worksheet theme + Crossword layout (15x15) + print-solid blocks */

:root{
  --bg:#f3f4f6;
  --card:#ffffff;
  --text:#0f172a;
  --muted:#475569;
  --border:#e2e8f0;
  --chip:#ffffff;
  --chipBorder:#e5e7eb;
  --input:#ffffff;

  --block:#aaabad;       /* requested */
  --cellBorder:#cbd5e1;
}
.theme-dark{
  --bg:#0b1220;
  --card:#0f172a;
  --text:#e5e7eb;
  --muted:#94a3b8;
  --border:rgba(148,163,184,.18);
  --chip:rgba(148,163,184,.08);
  --chipBorder:rgba(148,163,184,.20);
  --input:rgba(2,6,23,.55);

  --cellBorder:rgba(148,163,184,.32);
}

html,body{ background:var(--bg); color:var(--text); }

.card{ background:var(--card); border:1px solid var(--border); border-radius:18px; }
.muted{ color:var(--muted); }

.chip{
  background:var(--chip);
  border:1px solid var(--chipBorder);
  border-radius:999px;
  padding:.55rem .9rem;
  font-weight:800;
  color:var(--text);
  display:inline-flex;
  align-items:center;
  gap:.55rem;
}
select.chip, input.chip{
  padding:.55rem .9rem;
  outline:none;
  background:var(--chip);
  color:var(--text);
}

.btn{
  border-radius:999px;
  padding:.6rem 1rem;
  font-weight:900;
  border:1px solid var(--chipBorder);
  background:var(--chip);
  color:var(--text);
}
.btnPrimary{
  background:#111827;
  border-color:#111827;
  color:#fff;
}
.theme-dark .btnPrimary{
  background:#e5e7eb;
  border-color:#e5e7eb;
  color:#0b1220;
}

/* Banner */
#banner{
  border-radius:18px;
  padding:12px 14px;
  border:1px solid rgba(0,0,0);
  background:rgba(143,206,0,.56);
  color:#383737;
}
.theme-dark #banner{ color:#fecaca; }

/* Worksheet layout */
.cwWrap{
  margin-top:12px;
  display:grid;
  grid-template-columns: 1fr;
  gap:18px;
}

.cwItem{
  border:1px solid var(--border);
  border-radius:18px;
  padding:14px;
  background:var(--card);
}

.cwTop{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.cwTitle{ font-weight:900; }

.cwGrid{
  display:grid;
  grid-template-columns: repeat(15, 28px);
  gap:2px;
  justify-content:start;
  align-items:start;
  margin-top:10px;
}

@media (max-width: 980px){
  .cwGrid{ transform:scale(.9); transform-origin: left top; }
}
@media (max-width: 720px){
  .cwGrid{ transform:scale(.82); transform-origin: left top; }
}

.cwCell{
  width:28px;
  height:28px;
  border:1px solid var(--cellBorder);
  background:#fff;
  border-radius:6px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  font-size:14px;
  line-height:1;
}

/* PRINT-SAFE BLOCK: solid via box-shadow inset (works even if "background graphics" is off) */
.cwBlock{
  border-color: rgba(0,0,0,.10);
  background: transparent;
  box-shadow: inset 0 0 0 9999px var(--block);
}

/* tiny number in top-left */
.cwNum{
  position:absolute;
  top:2px;
  left:3px;
  font-size:8px;
  font-weight:900;
  opacity:.85;
  line-height:1;
}

/* Teacher letters */
.cwLetter{
  font-size:14px;
  font-weight:900;
}

/* Word bank */
.cwBank{
  margin-top:14px;
  border:1px dashed rgba(148,163,184,.35);
  border-radius:14px;
  padding:12px;
  background:rgba(148,163,184,.04);
}
.cwBankTitle{
  font-weight:900;
  font-size:12px;
  opacity:.85;
}
.cwBankGrid{
  margin-top:10px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:6px 14px;
  font-weight:900;
  font-size:12px;
}
@media (max-width: 980px){
  .cwBankGrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Key page */
.keyPage{
  margin-top:18px;
}
.keyTitle{
  font-size:18px;
  font-weight:900;
}
.keySub{
  margin-top:4px;
  font-size:12px;
  font-weight:800;
  color:var(--muted);
}

/* Print */
@media print{
  .noPrint{ display:none !important; }
  body{ background:#fff !important; }
  .card{ border:none !important; }
  .cwItem{ break-inside:avoid; }

  /* Encourage print engines to keep colors */
  *{
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
}
@media print{
  .cwBank{ display:none !important; } /* optional: hide word bank on print if you only want lists */
}