/* =====================================================================
   בקלות — מערכת עיצוב גלובלית (bkalot-theme.css)
   נוצר אוטומטית מ-tokens.json  ·  גרסה 1.1.0
   אל תערוך ידנית — ערוך את tokens.json והרץ build.js
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@300;400;500;600;700;800&family=Frank+Ruhl+Libre:wght@500;600;700;900&display=swap');

:root{
  --navy: #143a40;
  --teal: #20808D;
  --teal-d: #1B474D;
  --gold: #B8860B;
  --bg: #F7F6F2;
  --surface: #FFFFFF;
  --surface-2: #F2F0EB;
  --text: #23211C;
  --muted: #6E6C66;
  --faint: #A8A6A0;
  --border: #DDD9D1;
  --must: #B23B2E;
  --rec: #B8860B;
  --tip: #3F7A22;
  --health: #20808D;
  --font-body: 'Heebo', system-ui, sans-serif;
  --font-heading: 'Frank Ruhl Libre', 'Heebo', serif;
  --radius: 14px;
  --radius-sm: 10px;
  --side-w: 248px;
  --shadow: 0 1px 3px rgba(20,40,40,.06),0 8px 24px rgba(20,40,40,.05);
  --shadow-lg: 0 12px 40px rgba(20,40,40,.16);
  --table-cell-pad-y: 11px;
  --table-cell-pad-x: 16px;
  --table-head-bg: #F2F0EB;
  --table-head-text: #1B474D;
  --table-head-size: .82rem;
  --table-head-weight: 700;
  --table-cell-size: .92rem;
  --table-row-hover: rgba(32,128,141,.055);
  --table-row-zebra: rgba(0,0,0,.018);
  --form-field-pad-y: 10px;
  --form-field-pad-x: 14px;
  --form-field-size: .95rem;
  --form-field-radius: 10px;
  --form-field-bg: #FFFFFF;
  --form-label-size: .85rem;
  --form-label-weight: 600;
  --form-label-color: #6E6C66;
  --form-focus-ring: rgba(32,128,141,.18);
  --form-gap: 16px;
}
[data-theme="dark"]{
  --bg: #14130f;
  --surface: #1c1b17;
  --surface-2: #222019;
  --text: #e8e6df;
  --muted: #a3a099;
  --faint: #6c6a63;
  --border: #33312b;
  --teal: #4bbecb;
  --teal-d: #8fd6df;
  --gold: #e0b64a;
  --shadow: 0 1px 3px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.25);
  --table-head-bg: #222019;
  --table-head-text: #8fd6df;
  --table-row-hover: rgba(75,190,203,.09);
  --table-row-zebra: rgba(255,255,255,.025);
  --form-field-bg: #1c1b17;
  --form-label-color: #a3a099;
}

/* ---- Base ---- */
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased}
body{font-family:var(--font-body);background:var(--bg);color:var(--text);line-height:1.6;font-size:16px}
h1,h2,h3,h4{font-family:var(--font-heading);line-height:1.2;color:var(--teal-d)}
a{color:var(--teal);text-decoration:none;transition:color .18s}
.bk-hidden{display:none!important}

/* ---- Buttons (bk- prefix — לא מתנגש בקוד קיים) ---- */
.bk-btn{display:inline-block;background:var(--teal);color:#fff;font-weight:700;font-size:1rem;padding:12px 26px;border:none;border-radius:999px;cursor:pointer;transition:background .2s,transform .15s;box-shadow:0 6px 18px rgba(32,128,141,.28)}
.bk-btn:hover{background:var(--teal-d);transform:translateY(-2px)}
.bk-btn--ghost{background:var(--surface);border:1px solid var(--border);color:var(--teal-d);font-weight:600;box-shadow:none}
.bk-btn--ghost:hover{border-color:var(--teal);color:var(--teal);transform:none}
.bk-btn--danger{background:transparent;color:var(--must);border:1px solid #e6c4bf;box-shadow:none}
.bk-btn--danger:hover{background:var(--must);color:#fff;border-color:var(--must)}

/* ---- Card ---- */
.bk-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}

/* ---- Badges (עדיפויות / סיכוי זכאות) ---- */
.bk-badge{display:inline-block;font-size:.8rem;font-weight:700;padding:3px 12px;border-radius:999px}
.bk-badge--must{background:rgba(178,59,46,.12);color:var(--must)}
.bk-badge--rec{background:rgba(184,134,11,.14);color:var(--rec)}
.bk-badge--tip{background:rgba(63,122,34,.14);color:var(--tip)}

/* ---- Spinner ---- */
.bk-spinner{width:38px;height:38px;border:3px solid var(--border);border-top-color:var(--teal);border-radius:50%;animation:bk-spin .8s linear infinite;margin:0 auto 14px}
@keyframes bk-spin{to{transform:rotate(360deg)}}

/* ---- Data Table (bk-table — רכיב משותף לכל המערכות) ---- */
.bk-table{width:100%;border-collapse:collapse;font-family:var(--font-body);font-size:var(--table-cell-size);color:var(--text);background:var(--surface);border-radius:var(--radius-sm);overflow:hidden;box-shadow:var(--shadow)}
.bk-table thead th{background:var(--table-head-bg);color:var(--table-head-text);font-size:var(--table-head-size);font-weight:var(--table-head-weight);text-align:start;padding:var(--table-cell-pad-y) var(--table-cell-pad-x);border-bottom:1px solid var(--border);white-space:nowrap}
.bk-table tbody td{padding:var(--table-cell-pad-y) var(--table-cell-pad-x);border-bottom:1px solid var(--border);text-align:start;vertical-align:middle}
.bk-table tbody tr:last-child td{border-bottom:none}
.bk-table tbody tr:nth-child(even){background:var(--table-row-zebra)}
.bk-table tbody tr:hover{background:var(--table-row-hover)}
.bk-table--num td,.bk-table--num th{font-variant-numeric:tabular-nums lining-nums}
.bk-table__wrap{width:100%;overflow-x:auto}

/* ---- Form fields (bk-input / bk-select / bk-textarea / bk-label) ---- */
.bk-field{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--form-gap)}
.bk-label{font-size:var(--form-label-size);font-weight:var(--form-label-weight);color:var(--form-label-color)}
.bk-input,.bk-select,.bk-textarea{width:100%;font-family:var(--font-body);font-size:var(--form-field-size);color:var(--text);background:var(--form-field-bg);border:1px solid var(--border);border-radius:var(--form-field-radius);padding:var(--form-field-pad-y) var(--form-field-pad-x);transition:border-color .18s,box-shadow .18s;text-align:start}
.bk-textarea{min-height:96px;resize:vertical;line-height:1.5}
.bk-select{cursor:pointer;background-image:none}
.bk-input:focus,.bk-select:focus,.bk-textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--form-focus-ring)}
.bk-input::placeholder,.bk-textarea::placeholder{color:var(--faint)}
.bk-input:disabled,.bk-select:disabled,.bk-textarea:disabled{background:var(--surface-2);color:var(--muted);cursor:not-allowed}
.bk-input--error,.bk-select--error,.bk-textarea--error{border-color:var(--must)}
.bk-input--error:focus,.bk-textarea--error:focus{box-shadow:0 0 0 3px rgba(178,59,46,.16)}
.bk-help{font-size:.78rem;color:var(--muted)}
.bk-help--error{color:var(--must)}
