/* ספרקליק · פריסת העמודים (מעל tokens.css ו-bundle.css). רק מבנה; צבעים ורכיבים באים ממערכת העיצוב. */
html, body { margin: 0; background: var(--paper); min-height: 100%; }
[hidden] { display: none !important; }
/* קישור שנראה ככפתור: הצבע של הכפתור גובר על צבע הקישור הכללי של מערכת העיצוב */
.sk-page a.sk-btn { text-decoration: none; }
.sk-page a.sk-btn--primary, .sk-page a.sk-btn--primary:hover { color: var(--on-brand); }
.sk-page { min-height: 100vh; display: flex; flex-direction: column; }

/* מסכי הורה: עמודה אחת, טלפון קודם */
.sc-phone { width: 100%; max-width: 560px; margin: 0 auto; flex-grow: 1; display: flex; flex-direction: column; }
.sc-top { background: var(--surface); border-bottom: 1px solid var(--line); padding: var(--space-3) var(--space-4); display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); }
.sc-top .sk-logo__mark { width: 32px; height: 32px; }
.sc-top .sk-logo__name { font-size: 24px; line-height: 28px; }
.sc-main { flex-grow: 1; padding: var(--space-5) var(--space-4); display: flex; flex-direction: column; gap: var(--space-4); }
.sc-main p { margin: 0; }
.sc-body { font-size: 18px; line-height: 28px; }
.sc-footer { padding: var(--space-4) var(--space-4) var(--space-5); display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; }
.sc-back { display: inline-flex; align-items: center; min-height: var(--target-min); font-weight: 600; text-decoration: none; }
.sc-link-btn { background: none; border: 0; padding: 0 var(--space-2); min-height: var(--target-min); color: var(--brand); font: inherit; font-size: 14px; cursor: pointer; text-decoration: underline; }

.sc-demo { background: var(--click-tint); color: var(--ink); text-align: center; font-size: 14px; line-height: 20px; font-weight: 600; padding: 6px var(--space-4); }

/* כרטיס ילד בדף "הילדים שלי" */
.sc-kid { padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); }
.sc-kid__head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-2); }
.sc-kid__who { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

/* הסל */
.sc-basket-head { background: var(--surface); border-bottom: 1px solid var(--line); padding: var(--space-3) var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); }
.sc-basket-head__row { display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.sc-cartbar { position: sticky; bottom: 0; z-index: 2; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
.sk-books { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.sc-qty { font-weight: 400; color: var(--ink-muted); }

/* חלון ושכבת רקע */
.sc-scrim { position: fixed; inset: 0; background: rgba(10, 14, 28, 0.45); display: flex; align-items: center; justify-content: center; padding: var(--space-4); z-index: 10; }
.sc-scrim[hidden] { display: none; }

/* כניסה */
.sc-login { flex-grow: 1; display: flex; align-items: center; justify-content: center; padding: var(--space-5) var(--space-4); }
.sc-login form, .sc-login .sk-card { width: 100%; max-width: 420px; padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-4); }
.sc-brand { display: flex; flex-direction: column; align-items: center; gap: var(--space-2); text-align: center; }
.sc-choice { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); border: 0; margin: 0; padding: 0; }
.sc-choice legend { font-weight: 600; margin-bottom: 6px; padding: 0; }
.sc-choice label { display: flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--target-min); border: 1.5px solid var(--line-strong); border-radius: var(--radius-md); background: var(--surface); font-weight: 600; cursor: pointer; text-align: center; }
.sc-choice label:has(input:checked) { border-color: var(--brand); background: var(--brand-tint); color: var(--brand); }
.sc-choice input { accent-color: var(--brand); }

/* מצב ההזמנה */
.sc-items { list-style: none; margin: 0; padding: 0; }
.sc-items li { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-top: 1px solid var(--line); }
.sc-items li:first-child { border-top: 0; }
.sc-items__name { min-width: 0; }
.sc-success { padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-2); text-align: center; align-items: center; border-color: var(--done-fg); }
.sc-success__mark { width: 48px; height: 48px; border-radius: 50%; background: var(--done-bg); color: var(--done-fg); display: flex; align-items: center; justify-content: center; font-size: 26px; font-weight: 700; }

/* מסכי צוות: מחשב קודם */
.sc-desk { width: 100%; max-width: 1232px; margin: 0 auto; padding: var(--space-6) var(--space-5); display: flex; flex-direction: column; gap: var(--space-5); }
.sc-desk__head { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--space-3); flex-wrap: wrap; }
.sc-cols { display: flex; flex-wrap: wrap; gap: var(--space-5); align-items: flex-start; }
.sc-cols > * { flex: 1 1 440px; min-width: 0; }
.sc-rowitem { padding: 14px var(--space-4); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); border-top: 1px solid var(--line); }
.sc-rowitem:first-child { border-top: 0; }
.sc-soon { color: var(--ink-muted); display: flex; align-items: center; min-height: var(--target-min); padding: 0 var(--space-3); font-weight: 600; cursor: default; }
.sc-soon small { font-weight: 400; font-size: 12px; margin-inline-start: 4px; }
tr.sc-new { animation: sc-flash 2.4s ease-out; }
@keyframes sc-flash { from { background: var(--click-tint); } to { background: transparent; } }
@media (prefers-reduced-motion: reduce) { tr.sc-new { animation: none; } }

@media (max-width: 640px) {
  .sc-desk { padding: var(--space-5) var(--space-4); }
  .sk-nav { padding: var(--space-2) var(--space-4); }
}
@media print { .sc-demo, .sk-nav, .sc-cartbar { display: none; } }
.sk-table .sk-num, .sk-table td:first-child { white-space: nowrap; }
