:root{
  --ink:#2D2A6E; --ink-2:#413CA0; --gold:#F0A73C; --gold-2:#F4BC64;
  --cream:#F4F1FC; --card:#FFFFFF; --line:#E3DFF5; --slate:#5B5A78;
  --slate-light:#8E8CAE; --green:#12946E; --green-bg:#E1F6EE;
  --red:#E14F6B; --red-bg:#FDE7EC; --amber:#E8A33D; --amber-bg:#FDF1DC;
  --teal:#1AA6A0; --teal-bg:#DFF6F4; --coral:#F0714A; --coral-bg:#FDE9E1;
  --violet:#7C5CE0; --violet-bg:#EFE9FC; --sky:#3B93E0; --sky-bg:#E4F1FC;
  --side:#2D2A6E;
}
@media (prefers-color-scheme: dark){
  :root{
    --cream:#181529; --card:#231F3C; --line:#3A3560; --ink:#EDEBFA; --ink-2:#C7C2EE;
    --slate:#B4B1D6; --slate-light:#847FB0; --green-bg:#0F3B2C; --red-bg:#3A1826; --amber-bg:#3A2A0C;
    --teal-bg:#0E3634; --coral-bg:#3A200F; --violet-bg:#2A2050; --sky-bg:#132F4D;
  }
}
*{box-sizing:border-box;}
[hidden]{display:none !important;}
html,body{height:100%;}
body{margin:0; background:var(--cream); color:var(--ink); font-family:'Heebo',sans-serif;}
h1,h2,h3{font-family:'Frank Ruhl Libre',serif; margin:0; font-weight:700;}

.login-screen{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:16px;
  background:linear-gradient(135deg,#2D2A6E 0%,#7C5CE0 55%,#1AA6A0 100%);}
.login-card{background:var(--card); border-radius:16px; padding:32px 28px; width:100%; max-width:380px;
  display:flex; flex-direction:column; gap:8px; border-top:6px solid var(--gold); box-shadow:0 20px 50px rgba(0,0,0,.25);}
.login-brand{font-family:'Frank Ruhl Libre',serif; font-size:26px; font-weight:700; text-align:center;}
.login-brand small{display:block; font-family:'Heebo',sans-serif; font-size:13px; font-weight:400; color:var(--slate); margin-top:2px;}
.login-card h2{font-size:18px; margin-top:14px;}
.login-card input{width:100%; margin-bottom:6px;}
.login-card .btn{margin-top:10px; padding:12px; font-size:15px;}
.login-error{color:var(--red); font-size:13px; min-height:18px;}

.app{display:flex; min-height:100vh;}
.side{width:230px; flex-shrink:0; background:var(--side); color:#fff; padding:24px 16px; display:flex; flex-direction:column; gap:4px;
  border-left:5px solid var(--gold); position:sticky; top:0; height:100vh; overflow-y:auto;}
.brand{font-family:'Frank Ruhl Libre',serif; font-size:19px; font-weight:700; margin-bottom:2px;}
.brand small{display:block; font-family:'Heebo',sans-serif; font-size:12px; font-weight:400; color:var(--gold-2); margin-top:4px;}
.whoami{margin-top:18px; padding:10px 12px; background:rgba(255,255,255,.06); border-radius:10px; font-size:12.5px; line-height:1.5;}
.whoami .role{display:inline-block; margin-top:3px; padding:2px 9px; border-radius:20px; font-size:11px; font-weight:700; background:rgba(255,255,255,.15); color:#fff;}
.whoami .role.admin{background:var(--gold); color:#2D2A6E;}
.ownerbox{margin-top:12px; font-size:12px; color:var(--gold-2);}
.ownerbox select{width:100%; margin-top:4px; background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.25); font-weight:500;}
.ownerbox option{color:#2D2A6E; background:#fff;}
.yeartag.owner{background:var(--teal-bg); color:var(--teal);}
.nav{margin-top:22px; display:flex; flex-direction:column; gap:2px;}
.nav button{all:unset; cursor:pointer; padding:11px 14px; border-radius:8px; font-size:14px; color:#D8DCE6; transition:background .15s;}
.nav button:hover{background:rgba(255,255,255,.08);}
.nav button:focus-visible,.linkbtn:focus-visible{outline:2px solid var(--gold-2);}
.nav button.active{background:var(--gold); color:#2D2A6E; font-weight:700;}
.side-foot{margin-top:auto; padding-top:20px; display:flex; gap:14px; flex-wrap:wrap;}
.linkbtn{all:unset; cursor:pointer; font-size:13px; color:var(--gold-2); text-decoration:underline;}
.main{flex:1; padding:32px 40px; min-width:0;}
.main-inner{max-width:1180px; margin:0 auto;}
.pagehead{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:24px; flex-wrap:wrap; gap:12px;}
.pagehead h1{font-size:26px;}
.pagehead h2{font-size:20px;}
.pagehead p{color:var(--slate); margin:6px 0 0; font-size:14px; max-width:60ch;}
.yeartag{display:inline-block; padding:4px 12px; border-radius:20px; background:var(--violet-bg); color:var(--violet); font-size:12.5px; font-weight:700;}

.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; margin-bottom:26px;}
.card{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px 18px; position:relative; overflow:hidden;}
.card::before{content:''; position:absolute; top:0; right:0; left:0; height:4px; background:var(--slate-light);}
.card.c-violet::before{background:var(--violet);} .card.c-teal::before{background:var(--teal);}
.card.c-coral::before{background:var(--coral);} .card.c-amber::before{background:var(--amber);}
.card.c-sky::before{background:var(--sky);} .card.c-green::before{background:var(--green);}
.card.c-red::before{background:var(--red);}
.card .label{display:block; font-size:12.5px; color:var(--slate); margin-bottom:6px;}
.card .num{display:block; font-size:26px; font-weight:700; font-family:'Frank Ruhl Libre',serif;}
button.card{appearance:none; font:inherit; color:inherit; text-align:right; width:100%; cursor:pointer; transition:transform .12s, box-shadow .12s, border-color .12s;}
button.card:hover{transform:translateY(-2px); box-shadow:0 6px 16px rgba(45,42,110,.14); border-color:var(--violet);}
button.card:focus-visible{outline:2px solid var(--gold-2); outline-offset:2px;}
button.card::after{content:'‹'; position:absolute; left:12px; bottom:10px; color:var(--slate-light); font-size:18px;}
button.listrow{appearance:none; font:inherit; color:inherit; background:none; border:none; border-bottom:1px solid var(--line); width:100%; text-align:right; cursor:pointer; align-items:center;}
button.listrow:hover{background:rgba(124,92,224,.07);}
button.listrow:focus-visible{outline:2px solid var(--gold-2);}
.panel{scroll-margin-top:12px;}
.panel.flash{animation:flash 1.6s ease-out;}
@keyframes flash{0%{box-shadow:0 0 0 3px var(--gold);} 100%{box-shadow:0 0 0 3px transparent;}}
@media (prefers-reduced-motion: reduce){ button.card{transition:none;} .panel.flash{animation:none; } }
.num.green,.green{color:var(--green);} .num.red,.red{color:var(--red);} .num.amber,.amber{color:var(--amber);}

.panel{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:20px; margin-bottom:20px;}
.panel h3{font-size:16px; margin-bottom:14px;}
.panel h3 + .small{margin:-8px 0 12px;}
table{width:100%; border-collapse:collapse; font-size:13.5px;}
thead th{text-align:right; color:var(--slate); font-weight:500; font-size:12.5px; padding:8px 10px; border-bottom:2px solid var(--line); white-space:nowrap;}
tbody td{padding:9px 10px; border-bottom:1px solid var(--line); vertical-align:middle;}
tbody tr:hover{background:rgba(124,92,224,.06);}
.tablewrap{overflow-x:auto; max-height:520px; overflow-y:auto;}
.tablewrap thead th{position:sticky; top:0; background:var(--card); z-index:1;}
.dt-bar{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:12px;}
.dt-bar input[type=search]{min-width:200px; flex:1 1 200px; max-width:320px;}
.dt-bar select{max-width:220px; padding:7px 10px;}
.dt-count{margin-inline-start:auto;}
th[data-dt-sort]{cursor:pointer; user-select:none;}
th[data-dt-sort]:hover,th[aria-sort=ascending],th[aria-sort=descending]{color:var(--violet);}
th[data-dt-sort]:focus-visible{outline:2px solid var(--gold-2);}
td.empty{padding:24px;}
.badge{display:inline-block; padding:3px 11px; border-radius:20px; font-size:12px; font-weight:700; white-space:nowrap;}
.badge.ok{background:var(--green-bg); color:var(--green);}
.badge.warn{background:var(--amber-bg); color:var(--amber);}
.badge.danger{background:var(--red-bg); color:var(--red);}
.badge.neutral{background:var(--line); color:var(--slate);}

input,select,button.btn{font-family:'Heebo',sans-serif; font-size:13.5px; border:1px solid var(--line); border-radius:8px;
  padding:9px 12px; background:var(--card); color:var(--ink);}
input:focus,select:focus{outline:2px solid var(--gold-2); outline-offset:1px;}
.grid2 input,.grid2 select{width:100%;}
button.btn{background:#2D2A6E; color:#fff; border:none; cursor:pointer; font-weight:700; transition:opacity .15s;}
button.btn:hover{opacity:.88;}
button.btn:disabled{opacity:.45; cursor:not-allowed;}
button.btn.secondary{background:transparent; color:var(--ink); border:1px solid var(--line);}
button.btn.gold{background:var(--gold); color:#2D2A6E;}
button.btn.danger{background:var(--red);}
button.btn.sm{padding:5px 10px; font-size:12.5px;}
.row{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
.between{justify-content:space-between;}
.listrow{display:flex; justify-content:space-between; gap:10px; padding:8px 0; border-bottom:1px solid var(--line);}
.grid2{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px 20px;}
.upload-box{display:block; border:2px dashed var(--line); border-radius:12px; padding:32px 20px; text-align:center; color:var(--slate); cursor:pointer; transition:border-color .15s;}
.upload-box:hover,.upload-box.drag{border-color:var(--gold);}
.upload-box input{display:none;}
.map-row{display:grid; grid-template-columns:190px 1fr; gap:12px; align-items:center; margin-bottom:10px;}
.map-row label{font-size:13px; color:var(--slate);}
.small{font-size:12.5px; color:var(--slate-light);}
.empty{padding:32px 20px; text-align:center; color:var(--slate);}
.chart-box{position:relative; height:280px;}
.chart-box.short{height:220px;}
.footnote{font-size:12px; color:var(--slate-light); margin-top:8px;}
.filter-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;}
.filter-group{margin-bottom:16px;}
.filter-label{font-size:12.5px; color:var(--slate); margin-bottom:8px; font-weight:500;}
.pillrow{display:flex; flex-wrap:wrap; gap:8px;}
.pill{all:unset; cursor:pointer; padding:7px 15px; border-radius:20px; font-size:13px; border:1px solid var(--line); color:var(--ink); background:var(--card); transition:all .12s;}
.pill:hover{border-color:var(--gold);}
.pill:focus-visible{outline:2px solid var(--gold-2);}
.pill.active{background:var(--violet); color:#fff; border-color:var(--violet); font-weight:700;}
.pill.empty-state{color:var(--slate-light); font-style:italic; cursor:default;}
.toast{position:fixed; bottom:24px; left:50%; transform:translateX(-50%); background:#2D2A6E; color:#fff; padding:12px 22px;
  border-radius:10px; font-size:14px; box-shadow:0 8px 24px rgba(0,0,0,.25); z-index:50; max-width:90vw;}
.toast.error{background:var(--red);}
.ltr{direction:ltr; unicode-bidi:isolate; display:inline-block;}

/* ייצוא ל-PDF: בזמן הדפסה מוצג רק אזור ההדפסה, כטבלה נקייה בשחור-לבן */
#print-area{display:none;}
@media print{
  @page{size:A4 landscape; margin:10mm;}
  body.printing{background:#fff; color:#000;}
  body.printing > *:not(#print-area){display:none !important;}
  body.printing #print-area{display:block;}
  #print-area h1{font-size:16pt; margin:0 0 4px;}
  #print-area p{font-size:9pt; margin:0 0 8px; color:#333;}
  #print-area table{width:100%; border-collapse:collapse; font-size:8.5pt;}
  #print-area thead{display:table-header-group;}
  #print-area th,#print-area td{border:1px solid #888; padding:3px 5px; text-align:right; color:#000; background:#fff; position:static;}
  #print-area th{background:#eee; font-weight:700;}
  #print-area tr{break-inside:avoid;}
}

@media (max-width:820px){
  .app{flex-direction:column;}
  .side{width:100%; padding:16px; border-left:none; border-bottom:5px solid var(--gold); position:static; height:auto;}
  .nav{margin-top:12px; flex-direction:row; flex-wrap:wrap;}
  .side-foot{margin-top:8px; padding-top:8px;}
  .main{padding:20px 16px;}
  .map-row{grid-template-columns:1fr;}
}

/* ביקורים, משימות ומעקב ועדות */
.formrow{display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end;}
.formrow label{display:flex; flex-direction:column; gap:4px; font-size:13px; min-width:150px;}
.formrow input,.formrow select{padding:7px 9px; border:1px solid #d7d3ea; border-radius:8px; font:inherit;}
.btnrow{display:flex; flex-wrap:wrap; gap:8px; align-items:center;}

/* לוגו ופס עליון בראש כל עמוד */
.main{padding-top:0;}
.topbar{position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:14px; margin:0 -40px 24px; padding:8px 40px; min-height:60px;
  background:#fff; border-bottom:1px solid #ebe8f6; box-shadow:0 2px 10px rgba(60,40,120,.06);}
.topbar-logos{display:flex; align-items:center; gap:10px; flex:none;}
/* כל לוגו בתוך מסגרת זהה, כדי שלוגו רחב ולוגו גבוה ייראו באותו גודל */
.topbar-logos span{display:flex; align-items:center; justify-content:center; width:74px; height:44px; padding:3px 6px; border:1px solid #ebe8f6; border-radius:10px; background:#fff;}
.topbar-logos img{max-width:100%; max-height:100%; object-fit:contain;}
.topbar-title{flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.topbar-title b{font-family:'Frank Ruhl Libre',serif; font-size:17px;}
.topbar-title span{font-size:12.5px; color:var(--slate); margin-inline-start:8px;}
.chat-alert{flex:none; border:0; border-radius:999px; padding:7px 14px; background:#E14F6B; color:#fff; font:inherit; font-size:13.5px; font-weight:700; cursor:pointer; animation:chat-pulse 1.6s ease-in-out infinite;}
.chat-alert[hidden]{display:none;}
.task-alert{background:#E8A33D; animation:none;}
.task-alert.urgent{background:#E14F6B; animation:chat-pulse 1.6s ease-in-out infinite;}
@keyframes chat-pulse{0%,100%{box-shadow:0 0 0 0 rgba(225,79,107,.45);} 50%{box-shadow:0 0 0 8px rgba(225,79,107,0);}}
.topbar-year{display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--slate); flex:none; white-space:nowrap;}
.topbar-year select{padding:5px 10px; border:1px solid #d9d4ee; border-radius:999px; font:inherit; font-size:14px; font-weight:700; background:#f6f4fd; color:inherit; cursor:pointer;}
.topbar-year select:hover{border-color:var(--violet);}
.brand{display:flex; align-items:center; gap:12px; margin-bottom:6px;}
.brand small{margin-top:2px;}
.brand-logo{flex:none; display:flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:50%; background:#fff; overflow:hidden; box-shadow:0 0 0 2px var(--gold);}
.brand-logo img{width:46px; height:46px; object-fit:contain;}
.login-screen{background:linear-gradient(135deg,#f4f1fd 0%,#eaf4ff 55%,#fdf6e7 100%);}
.login-card{box-shadow:0 18px 50px rgba(60,40,120,.16); border-radius:18px;}
.login-logos{display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:14px;}
.login-logos span{display:flex; align-items:center; justify-content:center; width:92px; height:64px;}
.login-logos img{max-width:100%; max-height:100%; object-fit:contain;}
.card-logo{height:64px; width:auto; max-width:160px; object-fit:contain; background:#fff; border-radius:10px; padding:4px;}
.panel{box-shadow:0 2px 12px rgba(60,40,120,.05);}
#print-area .print-head{display:flex; align-items:center; gap:12px; margin-bottom:6px;}
#print-area .print-head img{height:46px; width:auto;}
@media (max-width:820px){ .topbar{margin:0 -16px 16px; padding:6px 16px; flex-wrap:wrap;} .topbar-title span{display:none;} }
