/* ============================================================
   אירועי מטה — מערכת עיצוב 2.0 (שלב ב')
   כחול מלכותי עמוק · מבטא ענברי חם · Rubik · RTL · מובייל תחילה
   ============================================================ */

@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('fonts/rubik-hebrew.woff2') format('woff2');
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('fonts/rubik-latin.woff2') format('woff2');
}

* { box-sizing: border-box; }

:root {
  --ink: #0f1c33;
  --ink-2: #4a5670;
  --ink-3: #8590aa;
  --bg: #eff2f9;
  --surface: #ffffff;
  --line: #e2e6f0;
  --line-soft: #ebeef6;

  --navy: #0d2154;
  --primary: #1d4ed8;
  --primary-2: #2f7cf6;
  --grad: linear-gradient(135deg, #0d2154, #1d4ed8 55%, #2f7cf6);
  --grad-warm: linear-gradient(135deg, #b45309, #f59e0b);

  --red: #e11d48;
  --red-soft: #fff1f3;
  --green: #059669;
  --green-soft: #ecfdf5;
  --amber: #d97706;
  --amber-soft: #fffbeb;
  --blue: #2563eb;
  --blue-soft: #eff6ff;
  --violet: #7c3aed;
  --violet-soft: #f5f3ff;
  --gray-soft: #f2f4fa;

  --r-xl: 24px;
  --r-lg: 18px;
  --r-md: 13px;
  --r-sm: 10px;

  --shadow-sm: 0 1px 2px rgba(13, 33, 84, .05), 0 4px 16px rgba(13, 33, 84, .06);
  --shadow-md: 0 2px 6px rgba(13, 33, 84, .07), 0 14px 36px rgba(13, 33, 84, .11);
  --shadow-lg: 0 8px 22px rgba(13, 33, 84, .14), 0 28px 70px rgba(13, 33, 84, .2);
  --ring: 0 0 0 3px rgba(29, 78, 216, .16);

  --on-primary: #fff;
  --topbar-bg: rgba(255, 255, 255, .92);
  --nav-bg: rgba(255, 255, 255, .9);
  --nav-active: #e7efff;
  --seg-bg: #e2e7f3;
  --toast-bg: #14224a;
  --today-bg: #eef4ff;
  --red-border: #fecdd3;
  --amber-border: #fde68a;
}

/* ============ ערכות מראה (נבחרות במסך "עוד") ============ */

/* ☀️ בהיר ונקי — ברירת המחדל: מינימלי, צבע אחד רגוע */
:root[data-theme="clean"] {
  --bg: #f7f8fa;
  --ink: #16181d; --ink-2: #565c68; --ink-3: #9298a4;
  --line: #e7e9ee; --line-soft: #f0f1f4; --gray-soft: #f3f4f7;
  --primary: #2563eb; --primary-2: #3b82f6;
  --grad: linear-gradient(135deg, #2563eb, #3b82f6);
  --grad-warm: linear-gradient(135deg, #2563eb, #3b82f6);
  --nav-active: #eaf1ff; --seg-bg: #eceef2; --toast-bg: #1f2430;
  --shadow-sm: 0 1px 2px rgba(20, 24, 33, .04), 0 3px 10px rgba(20, 24, 33, .04);
  --shadow-md: 0 2px 6px rgba(20, 24, 33, .06), 0 10px 26px rgba(20, 24, 33, .08);
}

/* 🧡 חם — קרם וכתום, ביתי */
:root[data-theme="warm"] {
  --bg: #fbf5ea;
  --surface: #fffdf8;
  --ink: #33291c; --ink-2: #6f5f49; --ink-3: #a8977e;
  --line: #efe2cc; --line-soft: #f5ecdb; --gray-soft: #f7f0e1;
  --primary: #c05621; --primary-2: #ea7c3c;
  --grad: linear-gradient(135deg, #b45309, #ea7c3c);
  --grad-warm: linear-gradient(135deg, #b45309, #ea7c3c);
  --topbar-bg: rgba(255, 251, 243, .92); --nav-bg: rgba(255, 251, 243, .93);
  --nav-active: #faeeda; --seg-bg: #f0e4cd; --toast-bg: #4a2f14;
  --today-bg: #faeeda;
  --ring: 0 0 0 3px rgba(192, 86, 33, .18);
}

/* 🌙 כהה — כחול-לילה עם זהב, כמו הדשבורד */
:root[data-theme="dark"] {
  --bg: #0d1226;
  --surface: #151c38;
  --ink: #e8ebf5; --ink-2: #aab2cd; --ink-3: #7079a0;
  --line: #262f54; --line-soft: #1f2747; --gray-soft: #1c2444;
  --primary: #e9b458; --primary-2: #f5cd7f;
  --on-primary: #2a1c02;
  --grad: linear-gradient(135deg, #c99b3a, #e9b458);
  --grad-warm: linear-gradient(135deg, #c99b3a, #e9b458);
  --topbar-bg: rgba(13, 18, 38, .92); --nav-bg: rgba(17, 23, 45, .93);
  --nav-active: #2a3157; --seg-bg: #1a2140; --toast-bg: #2a3157;
  --today-bg: #1b2445;
  --blue: #7ea4f5; --blue-soft: #1b2445;
  --red: #f0728f; --red-soft: #341425; --red-border: #5c1f33;
  --green: #2fc08b; --green-soft: #0e2b23;
  --amber: #e9b458; --amber-soft: #33270f; --amber-border: #54401a;
  --violet: #b39bf0; --violet-soft: #251d3f;
  --ring: 0 0 0 3px rgba(233, 180, 88, .22);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 16px rgba(0, 0, 0, .25);
  --shadow-md: 0 2px 6px rgba(0, 0, 0, .35), 0 14px 36px rgba(0, 0, 0, .35);
  --shadow-lg: 0 8px 22px rgba(0, 0, 0, .45), 0 28px 70px rgba(0, 0, 0, .5);
}
/* ערכת "כחול" = בסיס ה-:root, בלי בלוק משלה */

html, body {
  margin: 0; padding: 0;
  font-family: 'Rubik', -apple-system, 'Segoe UI', sans-serif;
  background: var(--bg);
  color: var(--ink);
  direction: rtl;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.hidden { display: none !important; }
.muted { color: var(--ink-2); font-size: .85rem; }
.center { text-align: center; }
.error { color: var(--red); min-height: 1.2em; font-size: .88rem; text-align: center; }
.row { display: flex; align-items: center; }
.row.gap { gap: 10px; flex-wrap: wrap; }

@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes rise-in {
  from { opacity: 0; transform: translateY(28px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes pop-in {
  from { opacity: 0; transform: translateY(10px) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes float-a {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(-14px, 12px); }
}

/* ============ התחברות ============ */

#login-view {
  min-height: 100vh; min-height: 100dvh;
  display: flex; align-items: center; justify-content: center;
  background: #091638;
  background-image:
    radial-gradient(52rem 52rem at 115% -15%, rgba(47, 124, 246, .45), transparent 62%),
    radial-gradient(44rem 44rem at -20% 115%, rgba(29, 78, 216, .5), transparent 62%),
    radial-gradient(30rem 30rem at 50% 120%, rgba(245, 158, 11, .22), transparent 65%);
  padding: 20px;
  position: relative;
  overflow: hidden;
}
#login-view::before, #login-view::after {
  content: ''; position: absolute; border-radius: 50%;
  filter: blur(60px); opacity: .5; pointer-events: none;
  animation: float-a 9s ease-in-out infinite;
}
#login-view::before {
  width: 340px; height: 340px; top: -120px; inset-inline-start: -100px;
  background: radial-gradient(circle, rgba(47, 124, 246, .55), transparent 70%);
}
#login-view::after {
  width: 280px; height: 280px; bottom: -110px; inset-inline-end: -80px;
  background: radial-gradient(circle, rgba(245, 158, 11, .35), transparent 70%);
  animation-delay: -4s;
}
.login-card {
  position: relative; z-index: 1;
  background: var(--surface); border-radius: 30px; padding: 42px 30px 30px;
  width: 100%; max-width: 380px; display: flex; flex-direction: column; gap: 13px;
  box-shadow: var(--shadow-lg);
  animation: pop-in .45s cubic-bezier(.16, 1, .3, 1);
}
.login-logo {
  width: 78px; height: 78px; margin: 0 auto 6px;
  border-radius: 26px; background: var(--grad);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 14px 30px rgba(29, 78, 216, .4);
  position: relative;
}
.login-logo::after {
  content: ''; position: absolute; inset: -5px; border-radius: 30px;
  border: 2px solid rgba(47, 124, 246, .25);
}
.login-logo svg { width: 42px; height: 42px; }
.login-card h1 {
  margin: 0; font-size: 1.45rem; font-weight: 700; text-align: center;
  letter-spacing: -.01em;
}
.login-card > p { margin: -6px 0 10px; text-align: center; color: var(--ink-2); font-size: .88rem; }
.login-card input {
  padding: 14px 16px; border: 1.5px solid transparent; border-radius: var(--r-md);
  font-size: 1rem; font-family: inherit; background: var(--gray-soft); color: var(--ink);
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.login-card input:focus {
  outline: none; background: var(--surface); border-color: var(--primary); box-shadow: var(--ring);
}
.login-card input::placeholder { color: var(--ink-3); }
.login-brand {
  margin-top: 6px; text-align: center; font-size: .74rem; color: var(--ink-3);
  letter-spacing: .02em;
}

/* ============ כפתורים ============ */

.btn {
  border: 1.5px solid var(--line); background: var(--surface); color: var(--ink);
  border-radius: var(--r-md); padding: 11px 16px; font-size: .93rem; font-weight: 600;
  font-family: inherit; cursor: pointer;
  transition: transform .12s, box-shadow .15s, background .15s, border-color .15s;
}
.btn:active { transform: scale(.97); }
.btn:hover { border-color: #cdd4e6; }
.btn.primary {
  background: var(--grad); border-color: transparent; color: var(--on-primary);
  box-shadow: 0 6px 18px rgba(29, 78, 216, .32);
}
.btn.primary:hover { box-shadow: 0 8px 22px rgba(29, 78, 216, .42); }
.btn.danger { background: var(--surface); border-color: var(--red-border); color: var(--red); }
.btn.danger:hover { background: var(--red-soft); }
.btn.success {
  background: linear-gradient(135deg, #047857, #059669); border-color: transparent; color: #fff;
  box-shadow: 0 6px 18px rgba(5, 150, 105, .3);
}
.btn.warm {
  background: var(--grad-warm); border-color: transparent; color: var(--on-primary);
  box-shadow: 0 6px 18px rgba(217, 119, 6, .3);
}
.btn.small { padding: 7px 13px; font-size: .84rem; border-radius: var(--r-sm); }
.btn.wide { width: 100%; padding: 13px; }
.btn.ghost {
  background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .25);
  color: #fff; backdrop-filter: blur(8px);
}
.btn:disabled { opacity: .5; }

/* ============ כותרת עליונה ============ */

#topbar {
  position: sticky; top: 0; z-index: 20;
  background: var(--grad);
  color: var(--on-primary);
  padding: calc(env(safe-area-inset-top) + 15px) 18px 15px;
  display: flex; align-items: center; justify-content: space-between;
  border-radius: 0 0 20px 20px;
  box-shadow: 0 6px 20px rgba(13, 33, 84, .18);
}
#topbar-text { display: flex; flex-direction: column; gap: 2px; }
#topbar-title { font-weight: 700; font-size: 1.28rem; letter-spacing: -.01em; color: inherit; }
#topbar-sub { font-size: .75rem; color: inherit; opacity: .88; font-weight: 400; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }
.icon-btn {
  width: 41px; height: 41px; border-radius: 14px; border: none; cursor: pointer;
  background: rgba(255, 255, 255, .18); color: var(--on-primary);
  display: flex; align-items: center; justify-content: center;
  transition: background .15s, transform .12s;
}
.icon-btn svg { width: 20px; height: 20px; }
.icon-btn:hover { background: rgba(255, 255, 255, .3); }
.icon-btn:active { transform: scale(.93); }
#avatar {
  width: 41px; height: 41px; border-radius: 50%; border: none;
  background: var(--surface); color: var(--primary); cursor: pointer;
  font-family: inherit; font-size: 1.02rem; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 12px rgba(13, 33, 84, .22);
  transition: transform .12s, box-shadow .15s;
}
#avatar:hover { box-shadow: 0 6px 16px rgba(13, 33, 84, .32); }
#avatar:active { transform: scale(.93); }

/* ============ פס מסננים ============ */

#filters-bar {
  position: sticky; top: 0; z-index: 19;
  display: flex; gap: 8px; overflow-x: auto;
  padding: 11px 14px; background: var(--surface);
  border-bottom: 1px solid var(--line-soft);
  box-shadow: var(--shadow-sm);
  animation: fade-in .2s;
  scrollbar-width: none;
}
#filters-bar::-webkit-scrollbar { display: none; }
#filters-bar select { flex: 0 0 auto; max-width: 46vw; }
#filters-bar .btn { flex: 0 0 auto; }
#filters-bar select {
  padding: 9px 28px 9px 12px; border: 1.5px solid transparent; border-radius: var(--r-sm);
  background: var(--gray-soft); font-family: inherit; font-size: .86rem; color: var(--ink);
  transition: border-color .15s, box-shadow .15s;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%234a5670' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: left 10px center;
}
#filters-bar select:focus { outline: none; border-color: var(--primary); box-shadow: var(--ring); background-color: var(--surface); }

#main {
  padding: 14px; padding-bottom: 122px;
  max-width: 1000px; margin: 0 auto;
}
#main > section { animation: fade-in .25s; }

/* ============ לוח שנה (FullCalendar) ============ */

#calendar {
  background: var(--surface); border-radius: var(--r-lg); padding: 14px;
  box-shadow: var(--shadow-sm);
}
.fc {
  direction: rtl;
  --fc-border-color: var(--line-soft);
  --fc-today-bg-color: var(--today-bg);
  --fc-page-bg-color: var(--surface);
  --fc-neutral-bg-color: var(--gray-soft);
  --fc-now-indicator-color: var(--red);
  font-family: inherit;
}
.fc .fc-toolbar.fc-header-toolbar { margin-bottom: 12px; gap: 8px; flex-wrap: wrap; }
.fc .fc-toolbar-title { font-size: 1.02rem !important; font-weight: 700; letter-spacing: -.01em; }
.fc .fc-button {
  background: var(--gray-soft); border: none; color: var(--ink-2);
  border-radius: var(--r-sm); padding: 6px 11px; font-size: .8rem; font-weight: 600;
  font-family: inherit; box-shadow: none !important;
  transition: background .15s, color .15s;
}
.fc .fc-button:hover { background: var(--line-soft); color: var(--ink); }
.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active {
  background: var(--primary); color: var(--on-primary);
}
.fc .fc-button-group { gap: 3px; }
.fc .fc-col-header-cell { padding: 8px 0; }
.fc .fc-col-header-cell-cushion {
  color: var(--ink-2); font-weight: 600; font-size: .78rem; text-decoration: none;
}
.fc .fc-daygrid-day-number { color: var(--ink-2); font-size: .82rem; padding: 5px 7px; text-decoration: none; }
.fc .fc-day-today .fc-daygrid-day-number {
  background: var(--primary); color: var(--on-primary); border-radius: 50%;
  width: 26px; height: 26px; display: flex; align-items: center; justify-content: center;
  margin: 3px; padding: 0; font-weight: 700;
}
.fc .fc-timegrid-slot-label-cushion, .fc .fc-timegrid-axis-cushion {
  color: var(--ink-3); font-size: .72rem;
}
.fc-event {
  cursor: pointer; border: none !important; border-radius: 7px;
  padding: 1px 5px; font-size: .78rem; font-weight: 500;
  box-shadow: none;
}
.fc-daygrid-event { margin: 1px 2px; }
.fc-event.ev-canceled { text-decoration: line-through; opacity: .55; }
.fc-timegrid-event .fc-event-time { font-weight: 700; font-size: .7rem; }
.fc-daygrid-dot-event { padding: 1px 4px; border-radius: 7px; }
.fc-h-event, .fc-v-event { background: transparent; }
.evc-planned  { --evc-bg: #e3ecff; --evc-tx: #1e3a8a; --evc-dot: #1d4ed8; }
.evc-pending  { --evc-bg: #ffe4e9; --evc-tx: #9f1239; --evc-dot: #e11d48; }
.evc-approved { --evc-bg: #d3f4e4; --evc-tx: #065f46; --evc-dot: #059669; }
.evc-done     { --evc-bg: #e7e9f0; --evc-tx: #4b5563; --evc-dot: #6b7280; }
.evc-canceled { --evc-bg: #f0f1f7; --evc-tx: #8590aa; --evc-dot: #b9bfd4; }
.fc .fc-event[class*="evc-"] {
  background: var(--evc-bg); color: var(--evc-tx);
  border-inline-start: 3px solid var(--evc-dot) !important;
}
.fc .fc-event[class*="evc-"] .fc-event-main,
.fc .fc-event[class*="evc-"] .fc-event-title,
.fc .fc-event[class*="evc-"] .fc-event-time { color: var(--evc-tx); }
.fc .fc-daygrid-dot-event[class*="evc-"] .fc-daygrid-event-dot { border-color: var(--evc-dot); }
.fc .fc-event[class*="evc-"]:hover { filter: brightness(.97); }

/* ============ ניווט תחתון צף ============ */

#bottomnav {
  position: fixed; bottom: calc(env(safe-area-inset-bottom) + 12px);
  right: 12px; left: 12px; z-index: 30;
  display: flex;
  background: var(--nav-bg);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--line);
  border-radius: 24px;
  box-shadow: var(--shadow-md);
  padding: 8px 7px;
  max-width: 560px; margin: 0 auto;
}
.nav-btn {
  flex: 1; border: none; background: none; padding: 8px 2px 6px;
  font-size: .7rem; font-weight: 600; color: var(--ink-3); cursor: pointer;
  font-family: inherit;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  position: relative; border-radius: 16px;
  transition: color .18s, background .18s;
  min-height: 54px;
}
.nav-btn svg { width: 22px; height: 22px; stroke: currentColor; }
.nav-btn.active { color: var(--primary); background: var(--nav-active); }
.nav-btn:active { transform: scale(.95); }
.badge {
  position: absolute; top: 3px; inset-inline-start: 50%; margin-inline-start: 7px;
  background: var(--red); color: #fff; border-radius: 10px;
  font-size: .62rem; font-weight: 700; padding: 1.5px 5.5px; min-width: 17px;
  box-shadow: 0 2px 6px rgba(225, 29, 72, .4);
  z-index: 1;
}

/* ============ FAB מוארך ============ */

#fab {
  position: fixed; bottom: calc(env(safe-area-inset-bottom) + 90px);
  inset-inline-start: 16px; z-index: 29;
  height: 54px; border-radius: 18px; padding: 0 20px 0 22px;
  background: var(--grad-warm); color: var(--on-primary); border: none;
  font-family: inherit; font-size: .95rem; font-weight: 700;
  cursor: pointer;
  box-shadow: 0 10px 26px rgba(217, 119, 6, .45);
  transition: transform .15s, box-shadow .15s;
  display: flex; align-items: center; gap: 8px;
}
#fab b { font-size: 1.35rem; font-weight: 700; line-height: 1; margin-top: -2px; }
#fab:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(217, 119, 6, .5); }
#fab:active { transform: scale(.94); }

/* ============ כרטיסים ============ */

.card {
  background: var(--surface); border: none; border-radius: var(--r-lg);
  padding: 18px; margin-bottom: 14px;
  box-shadow: var(--shadow-sm);
}
.card h3 { margin: 0 0 10px; font-size: 1rem; font-weight: 700; }
.ics-row { display: flex; gap: 8px; }
.ics-row input {
  flex: 1; padding: 10px 12px; border: 1.5px solid var(--line); border-radius: var(--r-sm);
  direction: ltr; font-size: .74rem; color: var(--ink-2); background: var(--gray-soft);
  font-family: inherit; min-width: 0;
}

/* ============ רשימות אירועים ============ */

.ev-item {
  background: var(--surface); border: none; border-radius: var(--r-md);
  padding: 13px 15px; margin-bottom: 9px; cursor: pointer;
  border-inline-start: 4px solid var(--blue);
  box-shadow: var(--shadow-sm);
  transition: transform .14s, box-shadow .15s;
}
.ev-item:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); }
.ev-item.st-pending { border-inline-start-color: var(--red); background: linear-gradient(0deg, var(--red-soft), var(--red-soft)), var(--surface); }
.ev-item.st-approved { border-inline-start-color: var(--green); }
.ev-item.st-done { border-inline-start-color: var(--ink-3); opacity: .8; }
.ev-item.st-canceled { border-inline-start-color: var(--ink-3); opacity: .55; text-decoration: line-through; }
.ev-item .t { font-weight: 700; font-size: .95rem; }
.ev-item .s { font-size: .8rem; color: var(--ink-2); margin-top: 3px; }
.joinable { border-inline-start-color: var(--amber); background: var(--amber-soft); }
.day-head {
  font-weight: 700; margin: 18px 2px 8px; font-size: .92rem; color: var(--ink);
  display: flex; align-items: center; gap: 8px;
}
.day-head::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.day-head.today { color: var(--primary); }
.heb-date { color: var(--ink-3); font-weight: 500; font-size: .8rem; }

.pill {
  display: inline-block; border-radius: 999px; padding: 2.5px 10px;
  font-size: .7rem; font-weight: 600;
  background: var(--blue-soft); color: var(--blue); margin-inline-start: 6px;
}
.pill.red { background: var(--red-soft); color: var(--red); }
.pill.amber { background: var(--amber-soft); color: var(--amber); }
.pill.green { background: var(--green-soft); color: var(--green); }
.pill.violet { background: var(--violet-soft); color: var(--violet); }
.pill.gray { background: var(--gray-soft); color: var(--ink-2); }

/* ============ מודאל ============ */

#modal-backdrop {
  position: fixed; inset: 0; z-index: 50;
  background: rgba(9, 22, 56, .55);
  backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);
  display: flex; align-items: flex-end; justify-content: center;
  animation: fade-in .18s;
}
#modal {
  background: var(--surface); width: 100%; max-width: 580px;
  border-radius: 28px 28px 0 0;
  padding: 14px 20px calc(env(safe-area-inset-bottom) + 22px);
  max-height: 92vh; overflow-y: auto;
  animation: rise-in .32s cubic-bezier(.16, 1, .3, 1);
  box-shadow: var(--shadow-lg);
}
#modal::before {
  content: ''; display: block; width: 42px; height: 4.5px; border-radius: 3px;
  background: var(--line); margin: 0 auto 16px;
}
@media (min-width: 640px) {
  #modal-backdrop { align-items: center; padding: 24px; }
  #modal { border-radius: 28px; padding-top: 24px; }
  #modal::before { display: none; }
}
#modal h3 { margin: 0 0 14px; font-size: 1.15rem; font-weight: 700; letter-spacing: -.01em; }

.form-grid { display: flex; flex-direction: column; gap: 13px; }
.form-grid label {
  font-size: .78rem; font-weight: 600; color: var(--ink-2);
  display: block; margin-bottom: 5px;
}
.form-grid input, .form-grid select, .form-grid textarea {
  width: 100%; padding: 11px 13px; border: 1.5px solid transparent;
  border-radius: var(--r-sm); font-size: .95rem; font-family: inherit;
  background: var(--gray-soft); color: var(--ink);
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus {
  outline: none; background: var(--surface); border-color: var(--primary); box-shadow: var(--ring);
}
.form-grid textarea { min-height: 76px; resize: vertical; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.form-note {
  background: var(--blue-soft); color: var(--blue); border-radius: var(--r-sm);
  padding: 9px 12px; font-size: .82rem; line-height: 1.5;
}

.chips { display: flex; flex-wrap: wrap; gap: 7px; }
.chip {
  border: 1.5px solid var(--line); border-radius: 999px; padding: 7px 15px;
  font-size: .85rem; font-weight: 500; cursor: pointer; background: var(--surface);
  user-select: none; transition: all .15s;
  min-height: 38px; display: inline-flex; align-items: center;
}
.chip:hover { border-color: #c3cbe2; }
.chip.on {
  background: var(--primary); color: var(--on-primary); border-color: var(--primary);
  box-shadow: 0 3px 10px rgba(29, 78, 216, .3);
}
.chip.locked { opacity: .9; cursor: default; }
.chip.locked::after { content: ' 🔒'; font-size: .7rem; }
.tchip { font-size: .84rem; padding: 7px 13px; }

.conflict-box {
  background: var(--red-soft); border: 1.5px solid var(--red-border); color: var(--red);
  border-radius: var(--r-md); padding: 12px 14px; font-size: .87rem;
  line-height: 1.6; margin-bottom: 10px;
}
.modal-actions { display: flex; gap: 9px; margin-top: 18px; flex-wrap: wrap; }
.modal-actions .btn { flex: 1; min-width: 104px; }

.detail-row { margin: 9px 0; font-size: .93rem; line-height: 1.45; }
.detail-row b {
  color: var(--ink-3); font-weight: 600; font-size: .72rem; display: block;
  text-transform: uppercase; letter-spacing: .04em;
}
.notes-box {
  background: var(--amber-soft); border: 1.5px solid var(--amber-border); border-radius: var(--r-md);
  padding: 12px 14px; margin: 10px 0; white-space: pre-wrap; font-size: .9rem; line-height: 1.55;
  display: flex; gap: 12px; align-items: flex-start;
}
.notes-box .irow-ic { background: #fef3c7; color: var(--amber); }
.audit-item {
  font-size: .78rem; color: var(--ink-2);
  border-top: 1px dashed var(--line); padding: 7px 0; line-height: 1.5;
}
details summary { cursor: pointer; }

/* --- שורות פרטים עם אייקונים --- */
.irow { display: flex; gap: 12px; align-items: flex-start; margin: 13px 0; font-size: .93rem; line-height: 1.45; }
.irow b {
  color: var(--ink-3); font-weight: 600; font-size: .7rem; display: block;
  letter-spacing: .04em; margin-bottom: 1px;
}
.irow-ic {
  flex: 0 0 auto; width: 36px; height: 36px; border-radius: 12px;
  background: var(--gray-soft); color: var(--primary);
  display: flex; align-items: center; justify-content: center;
}
.irow-ic svg { width: 18px; height: 18px; }

.sheet-status {
  display: inline-block; border-radius: 999px; padding: 5px 14px;
  font-size: .76rem; font-weight: 700;
}
.sheet-status.stx-planned  { background: var(--blue-soft); color: var(--blue); }
.sheet-status.stx-pending  { background: var(--red-soft); color: var(--red); }
.sheet-status.stx-approved { background: var(--green-soft); color: var(--green); }
.sheet-status.stx-done     { background: var(--gray-soft); color: var(--ink-2); }
.sheet-status.stx-canceled { background: var(--gray-soft); color: var(--ink-3); }

/* ============ טאבים (ניהול) ============ */

.tabs { display: flex; gap: 6px; margin-bottom: 12px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tab {
  border: 1.5px solid var(--line); background: var(--surface); border-radius: 999px;
  padding: 8px 17px; font-size: .87rem; font-weight: 600; color: var(--ink-2);
  cursor: pointer; white-space: nowrap; font-family: inherit;
  transition: all .15s;
}
.tab.active {
  background: var(--grad); color: var(--on-primary); border-color: transparent;
  box-shadow: 0 3px 10px rgba(29, 78, 216, .3);
}
.admin-table {
  width: 100%; border-collapse: collapse; background: var(--surface);
  border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow-sm);
}
.admin-table th, .admin-table td {
  padding: 10px 12px; border-bottom: 1px solid var(--line-soft);
  text-align: right; font-size: .87rem;
}
.admin-table tr:last-child td { border-bottom: none; }
.admin-table th {
  background: var(--gray-soft); font-size: .74rem; font-weight: 600;
  color: var(--ink-2); letter-spacing: .02em;
}
.inactive-row { opacity: .45; }

/* --- כרטיסי משתמשים / דמויות --- */
.person-card {
  display: flex; align-items: center; gap: 13px;
  background: var(--surface); border-radius: var(--r-lg);
  padding: 14px 16px; margin-bottom: 10px;
  box-shadow: var(--shadow-sm);
  animation: fade-in .2s;
}
.person-card.inactive { opacity: .55; }
.p-avatar {
  flex: 0 0 auto; width: 46px; height: 46px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.15rem; font-weight: 700; color: var(--on-primary);
  background: var(--grad);
}
.p-avatar.r-admin { background: var(--grad); }
.p-avatar.r-coordinator { background: linear-gradient(135deg, #047857, #10b981); }
.p-avatar.r-viewer { background: linear-gradient(135deg, #475569, #94a3b8); }
.p-avatar.r-mk_assistant { background: linear-gradient(135deg, #6d28d9, #a78bfa); }
.p-avatar.r-figure { background: var(--grad-warm); }
.p-body { flex: 1; min-width: 0; }
.p-name { font-weight: 700; font-size: .97rem; display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.p-meta { color: var(--ink-2); font-size: .8rem; margin-top: 2px; overflow-wrap: anywhere; }
.p-actions { display: flex; flex-direction: column; gap: 6px; flex: 0 0 auto; }
.p-actions .btn { padding: 6px 12px; font-size: .8rem; min-height: 34px; }
@media (min-width: 560px) { .p-actions { flex-direction: row; } }

.list-head {
  display: flex; align-items: center; justify-content: space-between;
  margin: 4px 2px 10px; gap: 8px;
}
.list-head h4 { margin: 0; font-size: .95rem; font-weight: 700; }

/* ============ טוסט ============ */

#toast {
  position: fixed; bottom: calc(env(safe-area-inset-bottom) + 96px);
  right: 50%; transform: translateX(50%);
  background: var(--toast-bg); color: #fff; border-radius: var(--r-md);
  padding: 12px 20px; z-index: 60; font-size: .89rem; font-weight: 500;
  max-width: 88vw; text-align: center; line-height: 1.5;
  box-shadow: var(--shadow-lg);
  animation: rise-in .3s cubic-bezier(.16, 1, .3, 1);
}

/* ============ ציר דמות ============ */

#fig-timeline { margin-top: 12px; }
#fig-select {
  padding: 10px 13px; border: 1.5px solid transparent; border-radius: var(--r-sm);
  flex: 1; background: var(--surface); font-family: inherit; font-size: .92rem;
  box-shadow: var(--shadow-sm); color: var(--ink);
}
#fig-select:focus { outline: none; border-color: var(--primary); box-shadow: var(--ring); }
#fig-range { margin-top: 8px; font-weight: 500; }

.tl { position: relative; padding-inline-start: 22px; margin-bottom: 4px; }
.tl::before {
  content: ''; position: absolute; top: 8px; bottom: 8px; inset-inline-start: 7px;
  width: 2px; border-radius: 2px; background: var(--line);
}
.tl .ev-item { position: relative; }
.tl .ev-item::before {
  content: ''; position: absolute; top: 18px; inset-inline-start: -19.5px;
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--blue); box-shadow: 0 0 0 3px var(--bg);
}
.tl .ev-item.st-pending::before { background: var(--red); }
.tl .ev-item.st-approved::before { background: var(--green); }
.tl .ev-item.joinable::before { background: var(--amber); }

/* ============ מחליף תצוגות (segmented) ============ */

.seg {
  display: flex; gap: 4px; background: var(--seg-bg); border-radius: 15px;
  padding: 4px; margin-bottom: 12px;
}
.seg-btn {
  flex: 1; border: none; background: transparent; border-radius: 12px;
  padding: 8px 4px; font-family: inherit; font-size: .84rem; font-weight: 600;
  color: var(--ink-2); cursor: pointer; transition: all .18s; white-space: nowrap;
  min-height: 42px;
}
.seg-btn.active {
  background: var(--surface); color: var(--primary);
  box-shadow: 0 2px 8px rgba(13, 33, 84, .12);
}

/* ============ מצב ריק ============ */

.empty { text-align: center; padding: 52px 20px 40px; animation: fade-in .3s; }
.empty-ic {
  width: 76px; height: 76px; margin: 0 auto 14px; border-radius: 26px;
  background: var(--surface); box-shadow: var(--shadow-sm);
  display: flex; align-items: center; justify-content: center; font-size: 2.1rem;
}
.empty-t { font-weight: 700; font-size: 1.02rem; }
.empty-s { color: var(--ink-2); font-size: .86rem; margin-top: 4px; }

/* ============ פרופיל והגדרות ============ */

.profile-card { display: flex; align-items: center; gap: 14px; }
#settings-avatar {
  flex: 0 0 auto; width: 58px; height: 58px; border-radius: 50%;
  background: var(--grad); color: #fff;
  font-size: 1.5rem; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 20px rgba(29, 78, 216, .3);
}
.profile-card h3 { margin: 0; }
.profile-card p { margin: 2px 0 0; }
.role-pill {
  display: inline-block; margin-top: 6px; border-radius: 999px; padding: 3px 12px;
  font-size: .74rem; font-weight: 700; background: var(--blue-soft); color: var(--primary);
}

/* ============ באנר "ממתינים לאישור" ============ */

#pending-banner {
  display: flex; align-items: center; gap: 12px;
  background: linear-gradient(135deg, #7f1d1d, #b91c1c 60%, #e11d48);
  color: #fff; border-radius: var(--r-lg); padding: 14px 16px;
  margin-bottom: 12px; cursor: pointer;
  box-shadow: 0 8px 24px rgba(185, 28, 28, .35);
  transition: transform .14s, box-shadow .15s;
}
#pending-banner:hover { transform: translateY(-1px); box-shadow: 0 12px 30px rgba(185, 28, 28, .42); }
#pending-banner:active { transform: scale(.985); }
.pb-ic { font-size: 1.5rem; }
.pb-text { flex: 1; display: flex; flex-direction: column; line-height: 1.35; }
.pb-text b { font-size: .95rem; }
.pb-text small { opacity: .85; font-size: .78rem; }
.pb-go { font-weight: 700; font-size: .85rem; white-space: nowrap; opacity: .95; }

/* ============ סדר יום ============ */

.agenda-nav {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-bottom: 4px;
}
.agenda-range { font-weight: 700; font-size: .95rem; }

.ag-card {
  display: flex; gap: 14px;
  background: var(--surface); border-radius: var(--r-md);
  padding: 14px 15px; margin-bottom: 10px; cursor: pointer;
  border-inline-start: 4px solid var(--blue);
  box-shadow: var(--shadow-sm);
  transition: transform .14s, box-shadow .15s;
}
.ag-card:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); }
.ag-card.st-pending { border-inline-start-color: var(--red); background: var(--red-soft); }
.ag-card.st-approved { border-inline-start-color: var(--green); }
.ag-card.st-done { border-inline-start-color: var(--ink-3); opacity: .85; }
.ag-card.st-canceled { border-inline-start-color: var(--ink-3); opacity: .55; }
.ag-card.st-canceled .ag-title { text-decoration: line-through; }
.ag-time {
  flex: 0 0 auto; display: flex; flex-direction: column; align-items: center;
  min-width: 48px; padding-top: 2px;
}
.ag-time b { font-size: 1.02rem; font-weight: 700; color: var(--primary); }
.ag-time span { font-size: .78rem; color: var(--ink-3); margin-top: 1px; }
.ag-body { flex: 1; min-width: 0; }
.ag-title { font-weight: 700; font-size: 1rem; line-height: 1.4; }
.ag-meta { color: var(--ink-2); font-size: .84rem; margin-top: 3px; }
.ag-figs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.fig-chip {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--gray-soft); border-radius: 999px;
  padding: 3px 11px 3px 5px; font-size: .8rem; font-weight: 500; color: var(--ink);
}
.fig-chip i {
  width: 22px; height: 22px; border-radius: 50%; font-style: normal;
  background: var(--grad); color: #fff; font-size: .72rem; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.ag-warn {
  margin-top: 9px; background: var(--red-soft); border: 1.5px solid var(--red-border);
  color: var(--red); border-radius: var(--r-sm); padding: 7px 11px;
  font-size: .8rem; font-weight: 600;
}

/* ============ תצוגת "סדר יום" של FullCalendar (list) ============ */

.fc .fc-list { border: none; }
.fc .fc-list-day-cushion { background: transparent; padding: 14px 6px 7px; }
.fc .fc-list-day-text, .fc .fc-list-day-side-text {
  color: var(--ink); font-weight: 700; font-size: .9rem; text-decoration: none;
}
.fc .fc-list-day-side-text { color: var(--ink-3); font-weight: 500; font-size: .78rem; }
.fc .fc-list-event { cursor: pointer; border-radius: var(--r-md); overflow: hidden; }
.fc .fc-list-event td { border: none; padding: 11px 10px; background: var(--gray-soft); font-size: .9rem; }
.fc .fc-list-table tr.fc-list-event { box-shadow: inset 0 -6px 0 var(--surface); }
.fc .fc-list-event-time { color: var(--ink-2); font-size: .8rem; white-space: nowrap; width: 1%; }
.fc .fc-list-event-title { font-weight: 600; }
.fc .fc-list-event:hover td { background: var(--line-soft); }
.fc .fc-list-event-dot { border-width: 5px; }
.fc tr.fc-list-event.evc-pending td { background: var(--red-soft); }
.fc tr.fc-list-event.evc-pending .fc-list-event-title { color: #9f1239; }
.fc tr.fc-list-event[class*="evc-"] .fc-list-event-dot { border-color: var(--evc-dot); }
.fc .fc-list-empty { background: transparent; }
.fc .fc-list-empty-cushion { color: var(--ink-3); font-size: .9rem; }

/* ============ בורר מראה ============ */

.theme-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.theme-btn {
  display: flex; align-items: center; gap: 9px;
  border: 2px solid var(--line); border-radius: var(--r-md);
  background: var(--surface); color: var(--ink);
  padding: 12px 14px; font-family: inherit; font-size: .9rem; font-weight: 600;
  cursor: pointer; transition: border-color .15s, transform .12s;
}
.theme-btn:active { transform: scale(.97); }
.theme-btn.on { border-color: var(--primary); box-shadow: var(--ring); }
.theme-dot {
  width: 22px; height: 22px; border-radius: 50%; flex: 0 0 auto;
  border: 2px solid rgba(0, 0, 0, .08);
}

/* ============ נגישות ============ */

:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 2px;
  border-radius: 6px;
}
.fc a:focus-visible, .ag-card:focus-visible, .chip:focus-visible {
  outline: 3px solid var(--primary); outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}