/* ══════════════════════════════════════════════════════════════════════════
   ארגז הכלים — גיליון הסגנון של המעטפת.

   הצבעים והמידות נלקחו מהמצג שאושר ב-14/09/2026 (ece3a894): כפתור ראשי
   בזהב מלא, סמל זהב מלא בכותרת, כרטיסים צמודים ברדיוס 9, וארגז הכלים
   עצמו כאריחים קומפקטיים בשתי עמודות — לא כרטיסים ארוכים עם פסקאות.
   ══════════════════════════════════════════════════════════════════════════ */

@font-face{font-family:'Heebo';src:url('/assets/fonts/Heebo-VF.ttf') format('truetype');font-weight:100 900;font-display:swap}

:root{
  --page:#EEEBE4; --panel:#FFFFFF; --panel-2:#F5F4F1; --edge:#DCD7CC; --edge-2:#CFCBC1;
  --txt:#1F2229; --txt2:#5F6572; --txt3:#9A9FAA;
  --gold:#D48821; --gold-d:#96681C; --gold-bg:#FDF6EA;
  --bad:#A3241B; --bad-bg:#F9E7E4;
  --ok:#3E6B46; --ok-bg:#E7EFE7;
  --shadow:0 10px 30px -14px rgba(28,30,32,.28);
  --shadow-sm:0 1px 2px rgba(28,30,32,.06);
  --r:9px;
}
@media(prefers-color-scheme:dark){:root{
  --page:#15171C; --panel:#1D2026; --panel-2:#22252C; --edge:#2C3038; --edge-2:#3A3F49;
  --txt:#ECEDF1; --txt2:#A6ACB8; --txt3:#767C88;
  --gold:#E5A040; --gold-d:#E5A040; --gold-bg:#2A2318;
  --bad:#E5877A; --bad-bg:#33201D;
  --ok:#85B58D; --ok-bg:#1C2A1E;
  --shadow:0 16px 40px -18px rgba(0,0,0,.65);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
}}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0; padding:0}
body{
  background:var(--page); color:var(--txt);
  font-family:'Heebo',-apple-system,"Segoe UI",Rubik,Arial,system-ui,sans-serif;
  font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; min-height:100vh;
}
a{color:var(--gold-d)}
.tb-ico{width:1.25em; height:1.25em; fill:none; stroke:currentColor; stroke-width:1.9;
  stroke-linecap:round; stroke-linejoin:round; display:inline-block; vertical-align:-.16em}

/* ─── סרגל עליון ─────────────────────────────────────────────────────── */
.tb-top{background:var(--panel); border-bottom:1px solid var(--edge); position:sticky; top:0; z-index:20}
.tb-top-in{max-width:900px; margin:0 auto; padding:9px 14px; display:flex; align-items:center; gap:9px}
.tb-logo{height:32px; width:auto; max-width:110px; object-fit:contain; border-radius:6px; flex:none}
.tb-mark{width:32px; height:32px; border-radius:7px; background:var(--gold); color:#fff;
  display:grid; place-items:center; flex:none}
.tb-mark .tb-ico{width:19px; height:19px; stroke-width:2.1}
.tb-top-t{display:flex; flex-direction:column; line-height:1.22; min-width:0}
.tb-name{color:var(--txt); font-weight:700; font-size:15px}
.tb-sub{color:var(--txt3); font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tb-out{margin-inline-start:auto; color:var(--txt2); text-decoration:none; font-size:14px;
  font-weight:600; padding:9px 14px; border-radius:8px; flex:none; white-space:nowrap}
.tb-out:hover{color:var(--gold-d); background:var(--panel-2)}
/* „חזרה" הוא הכפתור שהכי לוחצים עליו בנייד — הוא מקבל מסגרת כדי שייראה כפתור */
.tb-out.tb-back{border:1px solid var(--edge-2); color:var(--txt)}
.tb-out.tb-back:hover{border-color:var(--gold); color:var(--gold-d)}
.tb-out + .tb-out{margin-inline-start:6px}

/* ─── מעטפת התוכן ────────────────────────────────────────────────────── */
.tb-wrap{max-width:900px; margin:0 auto; padding:20px 14px 60px}
.tb-head{margin-bottom:16px}
.tb-h1{font-size:22px; font-weight:800; color:var(--txt); margin:0 0 3px; letter-spacing:-.01em}
.tb-h2{font-size:17px; font-weight:700; color:var(--txt); margin:26px 0 10px}
.tb-lead{color:var(--txt2); font-size:14px; margin:0; max-width:60ch}
.tb-mini{color:var(--txt3); font-size:12px}

.tb-card{background:var(--panel); border:1px solid var(--edge); border-radius:var(--r);
  padding:14px; box-shadow:var(--shadow-sm); margin-bottom:10px}

.tb-flash{border-radius:8px; padding:10px 13px; margin-bottom:14px; font-weight:600; font-size:13.5px}
.tb-info{background:var(--panel-2); border:1px solid var(--edge); color:var(--txt)}
.tb-success{background:var(--ok-bg); border:1px solid var(--ok); color:var(--ok)}
.tb-error{background:var(--bad-bg); border:1px solid var(--bad); color:var(--bad)}
.tb-alert{background:var(--bad-bg); border:1px solid var(--bad); color:var(--bad);
  border-radius:8px; padding:10px 13px; margin-bottom:14px; font-size:13.5px}

/* ─── כפתורים — הראשי בזהב מלא, כמו במצג ─────────────────────────────── */
.tb-btn{display:inline-flex; align-items:center; justify-content:center; gap:7px;
  background:var(--gold); color:#fff; border:1px solid var(--gold); border-radius:7px;
  padding:10px 18px; font:inherit; font-size:13.5px; font-weight:700; cursor:pointer;
  text-decoration:none; transition:.15s}
.tb-btn:hover{filter:brightness(1.06); transform:translateY(-1px)}
.tb-btn.tb-ghost{background:var(--panel); color:var(--txt); border-color:var(--edge-2)}
.tb-btn.tb-ghost:hover{border-color:var(--gold); color:var(--gold-d); filter:none}
.tb-btn.tb-danger{background:var(--panel); color:var(--bad); border-color:var(--bad)}
.tb-btn.tb-danger:hover{background:var(--bad-bg); filter:none}
.tb-btn.tb-sm{padding:8px 13px; font-size:12.5px}
.tb-btn.tb-block{width:100%}
.tb-actions{display:flex; flex-wrap:wrap; gap:8px; margin-top:12px}

/* ─── טפסים ──────────────────────────────────────────────────────────── */
.tb-form{display:flex; flex-direction:column; gap:11px}
.tb-form label, .tb-field{display:flex; flex-direction:column; gap:4px;
  font-size:11.5px; font-weight:600; color:var(--txt2)}
.tb-form input, .tb-field input, .tb-field select{
  font:inherit; font-size:14px; color:var(--txt); background:var(--panel);
  border:1px solid var(--edge-2); border-radius:7px; padding:9px 11px; outline:none;
  width:100%; max-width:100%; transition:.15s}
.tb-form input:focus, .tb-field input:focus, .tb-field select:focus{
  border-color:var(--gold); box-shadow:0 0 0 3px var(--gold-bg)}
.tb-row2{display:grid; grid-template-columns:1fr 1fr; gap:11px}
@media(max-width:560px){ .tb-row2{grid-template-columns:1fr} }

/* ─── מסך הכניסה ─────────────────────────────────────────────────────── */
.tb-login{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px}
.tb-login-card{width:100%; max-width:340px; background:var(--panel); border:1px solid var(--edge);
  border-radius:14px; padding:28px 22px; box-shadow:var(--shadow); text-align:center}
.tb-mono{width:48px; height:48px; margin:0 auto 12px; border-radius:11px; background:var(--gold);
  color:#fff; display:grid; place-items:center}
.tb-mono .tb-ico{width:26px; height:26px; stroke-width:2.1}
.tb-login-card h1{font-size:19px; font-weight:800; color:var(--txt); margin:0 0 2px}
.tb-login-sub{color:var(--txt3); font-size:13px; margin:0 0 18px}
.tb-login-card .tb-form{text-align:start}
.tb-login-help{margin-top:14px; font-size:12.5px; line-height:2; color:var(--txt2)}

/* ─── ארגז הכלים: אריחים ─────────────────────────────────────────────── */
.tb-tiles{display:grid; grid-template-columns:1fr 1fr; gap:8px}
@media(min-width:620px){ .tb-tiles{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))} }
.tb-tile{display:block; background:var(--panel); border:1px solid var(--edge); border-radius:var(--r);
  padding:14px 9px; text-align:center; text-decoration:none; color:inherit;
  box-shadow:var(--shadow-sm); transition:.16s}
.tb-tile:hover{border-color:var(--gold); transform:translateY(-2px); box-shadow:var(--shadow)}
.tb-tile-ic{width:34px; height:34px; margin:0 auto 7px; border-radius:9px; background:var(--gold-bg);
  color:var(--gold); display:grid; place-items:center}
.tb-tile-ic .tb-ico{width:19px; height:19px; stroke-width:2}
.tb-tile-nm{display:block; font-size:13.5px; font-weight:700; color:var(--txt)}
.tb-tile-st{display:block; font-size:11px; color:var(--txt3); margin-top:1px}
.tb-tile.is-locked{opacity:.55}
.tb-tile.is-locked .tb-tile-ic{background:var(--panel-2); color:var(--txt3)}
.tb-tile.is-locked:hover{opacity:1; border-color:var(--gold)}
.tb-tile.is-soon{opacity:.5; cursor:default}
.tb-tile.is-soon:hover{transform:none; border-color:var(--edge); box-shadow:var(--shadow-sm)}
.tb-tile-st.is-exp{color:var(--bad); font-weight:600}
.tb-tile-st.is-warn{color:var(--gold-d); font-weight:600}

/* ─── באנר חידוש מנוי ────────────────────────────────────────────────── */
.tb-banner{display:flex; align-items:center; gap:10px; padding:11px 13px; margin-bottom:14px;
  border:1px solid var(--edge); border-radius:var(--r); box-shadow:var(--shadow-sm)}
.tb-banner .tb-ico{width:1.4em; height:1.4em; flex:none}
.tb-banner-txt{flex:1; font-size:13px; font-weight:600; line-height:1.4}
.tb-renew{flex:none; background:var(--gold); color:#fff; font-weight:700; font-size:12.5px;
  text-decoration:none; padding:8px 13px; border-radius:7px; white-space:nowrap}
.tb-banner-warn{background:var(--gold-bg); border-color:var(--gold)}
.tb-banner-warn .tb-ico{color:var(--gold-d)}
.tb-banner-alert{background:var(--bad-bg); border-color:var(--bad)}
.tb-banner-alert .tb-ico{color:var(--bad)}
@media(max-width:520px){ .tb-banner{flex-wrap:wrap} .tb-banner-txt{flex:1 1 100%} }

/* ─── רצועת הניהול ───────────────────────────────────────────────────── */
.tb-strip-t{font-size:11px; font-weight:700; letter-spacing:.06em; color:var(--txt3); margin:20px 0 6px}
.tb-strip{display:flex; align-items:center; gap:9px; background:var(--panel);
  border:1px solid var(--edge); border-radius:var(--r); padding:11px 12px; margin-bottom:7px;
  text-decoration:none; color:inherit; box-shadow:var(--shadow-sm); transition:.15s}
.tb-strip:hover{border-color:var(--gold)}
.tb-strip .tb-ico{color:var(--gold); width:1.15em; height:1.15em; flex:none}
.tb-strip-nm{display:block; font-size:13.5px; font-weight:700; color:var(--txt)}
.tb-strip-ds{display:block; font-size:11px; color:var(--txt3)}
.tb-strip-go{margin-inline-start:auto; font-size:13px; color:var(--gold-d); font-weight:700; flex:none}

/* ─── בורר העסק ──────────────────────────────────────────────────────── */
.tb-biz{display:flex; align-items:center; gap:9px; width:100%; text-align:start;
  background:var(--panel); border:1px solid var(--edge); border-radius:var(--r);
  padding:13px 12px; margin-bottom:8px; font:inherit; color:inherit; cursor:pointer;
  box-shadow:var(--shadow-sm); transition:.15s}
.tb-biz:hover{border-color:var(--gold); transform:translateY(-1px)}
.tb-biz.is-current{border-color:var(--gold); background:var(--gold-bg)}
.tb-biz-logo{height:34px; width:34px; object-fit:contain; border-radius:7px; flex:none; background:var(--panel-2)}
.tb-biz-t{display:flex; flex-direction:column; min-width:0}
.tb-biz-nm{font-size:14.5px; font-weight:700; color:var(--txt)}
.tb-biz-ds{font-size:11px; color:var(--txt3)}
.tb-biz-go{margin-inline-start:auto; font-size:12px; color:var(--gold-d); font-weight:700; flex:none}

/* ─── אקורדיון ───────────────────────────────────────────────────────
   כל עובד סגור כברירת מחדל. כשכולם פתוחים המסך הוא גליל אינסופי ואי
   אפשר למצוא אף אחד. ─────────────────────────────────────────────── */
.tb-acc{background:var(--panel); border:1px solid var(--edge); border-radius:var(--r);
  box-shadow:var(--shadow-sm); margin-bottom:8px; overflow:hidden}
.tb-acc > summary{display:flex; align-items:center; gap:9px; padding:11px 13px;
  cursor:pointer; list-style:none}
.tb-acc > summary::-webkit-details-marker{display:none}
.tb-acc > summary::marker{content:''}
.tb-acc > summary:hover{background:var(--panel-2)}
.tb-acc[open] > summary{border-bottom:1px solid var(--edge)}
.tb-acc-t{display:flex; flex-direction:column; min-width:0; flex:1 1 auto}
.tb-caret{margin-inline-start:auto; color:var(--txt3); font-size:11px; flex:none;
  transition:transform .15s}
.tb-acc[open] .tb-caret{transform:rotate(180deg)}
.tb-acc-body{padding:13px}
.tb-acc-add > summary{color:var(--gold-d); font-weight:700; font-size:14px}
.tb-acc-add > summary .tb-ico{color:var(--gold); width:1.15em; height:1.15em}

/* ─── הצוות ──────────────────────────────────────────────────────────── */
.tb-member{padding:14px}
.tb-who{display:flex; align-items:center; gap:9px; padding-bottom:11px;
  border-bottom:1px solid var(--edge); margin-bottom:11px}
.tb-av{width:34px; height:34px; border-radius:50%; background:var(--panel-2); color:var(--txt2);
  display:grid; place-items:center; font-weight:700; font-size:14px; flex:none}
.tb-who-nm{display:block; font-size:14.5px; font-weight:700; color:var(--txt)}
.tb-who-ds{display:block; font-size:11px; color:var(--txt3)}
.tb-grants{display:grid; grid-template-columns:repeat(auto-fill,minmax(185px,1fr)); gap:8px; margin-bottom:11px}
/* ⚠ הכלל של label בתוך טופס (עמודה) גבר על השורה הזאת, וכל הרשאה נפרשה
   לשתי שורות מרוכזות. הבורר מתחיל כאן בשם המחלקה כדי לגבור עליו. */
.tb-grants .tb-grant{display:flex; flex-direction:row; align-items:center;
  justify-content:space-between; gap:8px; border:1px solid var(--edge); border-radius:7px;
  padding:6px 10px; background:var(--panel); font-size:13px; font-weight:600; color:var(--txt)}
.tb-grants .tb-grant > span{font-size:13px; font-weight:600; color:var(--txt); flex:1 1 auto}
.tb-grants .tb-grant select{font:inherit; font-size:12.5px; color:var(--txt); background:var(--panel);
  border:1px solid var(--edge-2); border-radius:6px; padding:5px 7px; outline:none;
  width:auto; flex:0 0 auto; max-width:56%}
.tb-grants .tb-grant select:focus{border-color:var(--gold)}
.tb-foot{display:flex; flex-wrap:wrap; align-items:center; gap:8px;
  border-top:1px solid var(--edge); padding-top:11px; margin-top:11px}
.tb-inline{display:flex; gap:6px; align-items:center}
.tb-inline input{font:inherit; font-size:13px; border:1px solid var(--edge-2); border-radius:7px;
  padding:7px 10px; background:var(--panel); color:var(--txt); outline:none; max-width:150px}
.tb-inline input:focus{border-color:var(--gold)}

@media(max-width:560px){ .tb-grants{grid-template-columns:1fr} }
