/* =============================================================
   INVITO Clean Core v3.2
   Zaključan header/footer chrome + očišćen legacy CSS
   ============================================================= */
:root{
  color-scheme: light dark;
  --font-sf: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --blue:#007AFF;
  --blue-dark:#0A84FF;
  --slate-grey:#64748b;
  --orange-pending:#f59e0b;
  --text:#000000;
  --text-secondary:rgba(60,60,67,.72);
  --muted:rgba(60,60,67,.72);
  --bg:#F2F2F7;
  --surface:#FFFFFF;
  --separator:rgba(60,60,67,.29);
  --glass-bg:rgba(255,255,255,.78);
  --glass-border:rgba(60,60,67,.18);
  --glass-blur:18px;
  --glass-sat:180%;
  --r-xl:24px;
  --r-2xl:28px;
  --shadow-card:0 10px 30px rgba(0,0,0,.08);
  --shadow-float:0 12px 26px rgba(15,23,42,.08);
  --page-px:16px;
  --tabbar-h:72px;
  --chrome-max:1280px;
  --chrome-pad:12px;
  --chrome-radius:22px;
  --hdr-h:76px;
}
html.theme-set.theme-light{}
html.theme-set.theme-dark{
  --bg:#000000;
  --surface:rgba(28,28,30,.92);
  --text:#FFFFFF;
  --text-secondary:rgba(235,235,245,.72);
  --muted:rgba(235,235,245,.72);
  --separator:rgba(84,84,88,.65);
  --glass-bg:rgba(30,30,30,.76);
  --glass-border:rgba(235,235,245,.16);
  --shadow-card:0 14px 40px rgba(0,0,0,.55);
  --shadow-float:0 12px 30px rgba(0,0,0,.50);
  --blue:var(--blue-dark);
}
html.theme-set.theme-luxury{
  --bg:#070707;
  --surface:rgba(18,18,20,.92);
  --text:#FFFFFF;
  --text-secondary:rgba(235,235,245,.72);
  --muted:rgba(235,235,245,.72);
  --separator:rgba(120,110,90,.55);
  --glass-bg:rgba(18,18,20,.78);
  --glass-border:rgba(212,175,55,.22);
  --shadow-card:0 16px 46px rgba(0,0,0,.70);
  --shadow-float:0 14px 34px rgba(0,0,0,.62);
  --blue:#D4AF37;
  --blue-dark:#C9A227;
}
@media (prefers-color-scheme: dark){
  html:not(.theme-set){
    --bg:#000000;
    --surface:rgba(28,28,30,.92);
    --text:#FFFFFF;
    --text-secondary:rgba(235,235,245,.72);
    --muted:rgba(235,235,245,.72);
    --separator:rgba(84,84,88,.65);
    --glass-bg:rgba(30,30,30,.76);
    --glass-border:rgba(235,235,245,.16);
    --shadow-card:0 14px 40px rgba(0,0,0,.55);
    --shadow-float:0 12px 30px rgba(0,0,0,.50);
    --blue:var(--blue-dark);
  }
}
html[data-theme="light"]{ color-scheme:light; --bg:#F2F2F7; --surface:#FFFFFF; --text:#000000; --text-secondary:rgba(60,60,67,.72); --muted:rgba(60,60,67,.72); --separator:rgba(60,60,67,.29); --glass-bg:rgba(255,255,255,.78); --glass-border:rgba(60,60,67,.18); --shadow-card:0 10px 30px rgba(0,0,0,.08); --shadow-float:0 12px 26px rgba(15,23,42,.08); --blue:#007AFF; }
html[data-theme="dark"]{ color-scheme:dark; --bg:#000000; --surface:rgba(28,28,30,.92); --text:#FFFFFF; --text-secondary:rgba(235,235,245,.72); --muted:rgba(235,235,245,.72); --separator:rgba(84,84,88,.65); --glass-bg:rgba(30,30,30,.76); --glass-border:rgba(235,235,245,.16); --shadow-card:0 14px 40px rgba(0,0,0,.55); --shadow-float:0 12px 30px rgba(0,0,0,.50); --blue:var(--blue-dark); }
*{ box-sizing:border-box; }
html, body{ height:100%; }
html{ background:var(--bg); }
body{
  margin:0;
  font-family:var(--font-sf);
  background:var(--bg);
  color:var(--text);
  letter-spacing:.1px;
  -webkit-tap-highlight-color:rgba(0,0,0,0);
}
body.noScroll{ overflow:hidden; }
a{ color:var(--blue); text-decoration:none; }
button, input, select, textarea{ font:inherit; }
img, svg{ max-width:100%; }
.glass{
  background:var(--glass-bg);
  border:1px solid var(--glass-border);
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-sat));
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-sat));
}
.chromeSurface{
  box-shadow:var(--shadow-float);
}
.container{
  width:100%;
  max-width:var(--chrome-max);
  margin:0 auto;
  padding:12px var(--chrome-pad) calc(var(--tabbar-h) + 24px + env(safe-area-inset-bottom));
}
.header,
.tabbar{
  width:100%;
  max-width:var(--chrome-max);
  margin:0 auto;
}
.header{
  position:sticky;
  top:0;
  z-index:60;
  padding:calc(env(safe-area-inset-top) + 8px) var(--chrome-pad) 8px;
}
.headerInner{
  border-radius:var(--chrome-radius);
  padding:10px 12px;
  overflow:hidden;
  transition:padding .18s ease, border-radius .18s ease, box-shadow .18s ease;
}
.heroRow{ display:flex; align-items:center; gap:10px; width:100%; }
.heroBurger{ flex:0 0 auto; align-self:flex-start; }
.burger{
  width:42px; height:42px; border-radius:15px;
  border:1px solid var(--separator);
  background:rgba(255,255,255,.10);
  color:var(--text);
  display:grid; place-items:center; cursor:pointer;
  user-select:none; touch-action:manipulation;
  transition:transform 120ms ease, filter 120ms ease;
}
.burger:active{ transform:scale(.985); filter:brightness(.92); }
.heroTextStack{ min-width:0; flex:1 1 auto; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.pageHeroKicker{
  display:inline-flex; align-items:center; min-height:22px;
  margin:0 0 4px 0; padding:0 9px; border-radius:999px;
  font-size:9px; line-height:1; letter-spacing:.16em; text-transform:uppercase; font-weight:800;
  color:#6b7280; background:rgba(17,24,39,.045); border:1px solid rgba(17,24,39,.06);
}
.largeTitle{
  margin:0; font-size:22px; line-height:1.05; letter-spacing:-.03em; font-weight:800; color:#1f2a44;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.subtitle{ margin:4px 0 0; font-size:11px; line-height:1.2; color:rgba(17,24,39,.58); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body.is-condensed .headerInner{ padding:8px 10px; border-radius:18px; box-shadow:0 8px 16px rgba(15,23,42,.05); }
body.is-condensed .pageHeroKicker{ min-height:19px; margin-bottom:2px; padding:0 8px; font-size:8px; }
body.is-condensed .largeTitle{ font-size:18px; }
body.is-condensed .subtitle{ margin-top:1px; font-size:10px; opacity:.82; }

.tabbar{
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  padding:10px var(--chrome-pad) calc(10px + env(safe-area-inset-bottom));
}
.tabbarInner{
  width:100%; border-radius:var(--chrome-radius); display:flex; justify-content:space-between; gap:6px; padding:8px;
}
.tabItem{
  flex:1; min-width:0; text-align:center; display:flex; flex-direction:column; align-items:center; gap:5px;
  color:rgba(142,142,147,.95); font-size:11px; font-weight:700; padding:8px 6px; border-radius:16px;
  user-select:none; touch-action:manipulation; transition:transform 120ms ease, filter 120ms ease, background 160ms ease, color 160ms ease;
}
.tabItem span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.tabItem:active{ transform:scale(.985); filter:brightness(.92); }
.tabItemActive{ color:var(--blue); background:color-mix(in oklab, var(--blue) 14%, transparent); border:1px solid color-mix(in oklab, var(--blue) 22%, transparent); }
.icon{ width:22px; height:22px; display:block; opacity:.98; }

.card{ border-radius:var(--r-xl); border:1px solid color-mix(in oklab, var(--separator) 70%, transparent); background:var(--surface); box-shadow:var(--shadow-card); }
.cardPad{ padding:14px; }
.h2{ margin:0 0 10px; font-size:15px; font-weight:800; letter-spacing:.2px; }
.muted{ color:var(--text-secondary); font-size:12px; }
.btn{ border-radius:18px; border:1px solid var(--separator); padding:12px 14px; background:rgba(255,255,255,.10); color:var(--text); cursor:pointer; user-select:none; touch-action:manipulation; transition:transform 120ms ease, filter 120ms ease; }
.btn:active{ transform:scale(.985); filter:brightness(.92); }
.btnPrimary{ background:var(--blue); color:#fff; border-color:rgba(255,255,255,.22); font-weight:800; }
.input{ width:100%; border-radius:18px; border:1px solid var(--separator); background:rgba(255,255,255,.10); padding:12px 14px; color:var(--text); }
.input:focus{ outline:none; border-color:color-mix(in oklab, var(--blue) 60%, var(--separator)); box-shadow:0 0 0 3px color-mix(in oklab, var(--blue) 35%, transparent); }

.tableWrap{ width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:18px; border:1px solid var(--glass-border); background:color-mix(in oklab, var(--glass-bg) 86%, transparent); backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-sat)); -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-sat)); }
.tableWrap .table{ min-width:860px; }
.w-42{ width:42px; } .w-70{ width:70px; } .w-140{ width:140px; } .w-180{ width:180px; }
.table{ width:100%; border-collapse:collapse; overflow:hidden; border-radius:var(--r-xl); }
.table th, .table td{ border-bottom:1px solid var(--separator); padding:12px 10px; vertical-align:top; font-size:13px; }
.table th{ color:var(--text-secondary); font-weight:800; font-size:12px; }
.badge{ display:inline-flex; align-items:center; gap:6px; padding:7px 11px; border-radius:999px; border:1px solid var(--separator); font-size:12px; font-weight:800; }
.bGreen{ background:rgba(52,199,89,.14); color:#34c759; }
.bRed{ background:rgba(255,59,48,.14); color:#ff3b30; }
.bOrange{ background:rgba(255,149,0,.16); color:#ff9500; }
.newRow{ background:rgba(0,122,255,.10); }

.premiumUserCard{ display:flex; align-items:center; gap:12px; padding:14px 14px 12px; border:1px solid rgba(0,0,0,.06); border-radius:18px; background:linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(248,248,250,.90) 100%); box-shadow:0 10px 30px rgba(16,24,40,.06); margin-bottom:14px; }
.premiumUserAvatar{ width:42px; height:42px; border-radius:14px; display:grid; place-items:center; flex:0 0 42px; font-size:15px; font-weight:800; color:#111827; background:linear-gradient(180deg, #ffffff 0%, #eceff3 100%); border:1px solid rgba(15,23,42,.08); box-shadow:inset 0 1px 0 rgba(255,255,255,.9); }
.premiumUserMeta{ min-width:0; flex:1; }
.premiumUserEyebrow{ font-size:11px; line-height:1.1; letter-spacing:.14em; text-transform:uppercase; color:rgba(17,24,39,.48); margin-bottom:5px; font-weight:700; }
.premiumUserName{ font-size:17px; line-height:1.15; font-weight:800; color:#111827; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:6px; }
.premiumUserIdRow{ display:flex; align-items:center; gap:8px; min-width:0; }
.premiumUserIdLabel{ font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:rgba(17,24,39,.42); flex:0 0 auto; }
.premiumUserIdValue{ min-width:0; display:inline-flex; align-items:center; max-width:100%; padding:5px 9px; border-radius:999px; background:rgba(17,24,39,.045); border:1px solid rgba(17,24,39,.06); color:#374151; font-size:12px; line-height:1; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.drawerBackdrop{ position:fixed; inset:0; background:rgba(0,0,0,.38); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); display:none; z-index:80; }
.drawer{ position:fixed; top:0; bottom:0; left:0; width:86%; max-width:380px; transform:translateX(-105%); transition:transform .24s cubic-bezier(.2,.8,.2,1); z-index:90; padding:14px; padding-top:calc(14px + env(safe-area-inset-top)); }
.drawerInner{ height:100%; border-radius:30px; padding:14px; overflow:auto; box-shadow:var(--shadow-float); }
.drawerOpen .drawerBackdrop{ display:block; }
.drawerOpen .drawer{ transform:translateX(0); }
.drawerClose{ width:44px; height:44px; margin-left:auto; flex:0 0 auto; border-radius:16px; border:1px solid var(--separator); background:rgba(255,255,255,.10); display:grid; place-items:center; cursor:pointer; transition:transform 120ms ease, filter 120ms ease, background 160ms ease; }
.drawerClose:active{ transform:scale(.985); filter:brightness(.92); }
.navSectionTitle{ font-size:11px; line-height:1.1; letter-spacing:.14em; text-transform:uppercase; color:var(--text-secondary); font-weight:800; margin:14px 4px 10px; }
.navList{ display:flex; flex-direction:column; gap:10px; margin-top:12px; }
.navLink{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; border-radius:20px; border:1px solid var(--separator); background:rgba(255,255,255,.08); color:var(--text); font-weight:950; transition:transform 120ms ease, filter 120ms ease, background 160ms ease, border-color 160ms ease; }
.navLink:active{ transform:scale(.985); filter:brightness(.92); }
.navLinkLeft{ display:flex; align-items:center; gap:10px; min-width:0; }
.navIco{ width:34px; height:34px; border-radius:14px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.10); background:rgba(10,132,255,.12); color:var(--blue); }
.navLabel{ display:flex; flex-direction:column; min-width:0; }
.navLabel b{ font-size:14px; letter-spacing:.1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.navLabel small{ margin-top:3px; font-size:11px; color:var(--text-secondary); font-weight:850; }
.navPill{ font-size:11px; font-weight:950; padding:6px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.10); color:var(--text-secondary); white-space:nowrap; }
.navLink.isActive{ border-color:rgba(10,132,255,.45); background:rgba(10,132,255,.14); }
.navLink.isActive .navPill{ border-color:rgba(10,132,255,.35); color:var(--blue); background:rgba(10,132,255,.12); }
.navDivider{ margin:12px 0; height:1px; background:var(--separator); opacity:.8; }
.navLinkDanger{ border-color:rgba(255,59,48,.35); background:rgba(255,59,48,.08); }
.navLinkDanger .navIco{ background:rgba(255,59,48,.10); color:#ff3b30; }
.navLinkDanger .navPill{ border-color:rgba(255,59,48,.25); color:#ff3b30; }
.drawerBrand{ margin-top:14px; padding-top:14px; border-top:1px solid var(--separator); text-align:center; opacity:.78; }
.brandName{ font-size:12px; font-weight:900; letter-spacing:.22em; }
.brandSub{ margin-top:4px; font-size:10px; font-weight:700; letter-spacing:.16em; color:var(--text-secondary); }
.toastWrap{ position:fixed; left:50%; transform:translateX(-50%); bottom:92px; z-index:120; display:none; }
.toastCard{ border-radius:18px; padding:10px 12px; box-shadow:var(--shadow-card); border:1px solid var(--glass-border); font-weight:800; font-size:12px; }
.themeSeg{ display:flex; gap:10px; padding:10px 12px; border-radius:18px; background:color-mix(in oklab, var(--glass-bg) 82%, transparent); border:1px solid var(--glass-border); backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-sat)); -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-sat)); }
.themeSegBtn, .segBtn{ flex:1; display:flex; align-items:center; justify-content:center; gap:8px; padding:10px 10px; border-radius:14px; border:1px solid color-mix(in oklab, var(--separator) 40%, transparent); background:color-mix(in oklab, var(--surface) 55%, transparent); color:var(--text); font-weight:800; letter-spacing:.2px; cursor:pointer; transition:transform 120ms ease, filter 160ms ease, background 160ms ease, border-color 160ms ease; }
.themeSegBtn:active, .segBtn:active{ transform:scale(.985); filter:brightness(.92); }
.themeSegBtn.isActive, .segBtn.is-active{ background:color-mix(in oklab, var(--blue) 16%, transparent); border-color:color-mix(in oklab, var(--blue) 34%, transparent); color:var(--text); }
.bump{ animation:bumpScale .22s ease; }
@keyframes bumpScale{ 0%{ transform:scale(1);} 50%{ transform:scale(1.025);} 100%{ transform:scale(1);} }

@media (max-width:768px){
  .header{ padding:0 0 8px; }
  .headerInner{ border-radius:0 0 18px 18px; padding:8px 10px; }
  body.is-condensed .headerInner{ border-radius:0 0 16px 16px; padding:7px 8px; }
  body.is-condensed .subtitle{ max-height:0; opacity:0; margin-top:0; }
  .largeTitle{ font-size:22px; }
  .subtitle{ font-size:10px; }
  .container{ padding-left:12px; padding-right:12px; }
  .tabbarInner{ border-radius:20px; }
}
@media (min-width:769px){
  .header{ padding-left:24px; padding-right:24px; }
  .tabbar{ padding-left:24px; padding-right:24px; }
  .container{ padding-left:24px; padding-right:24px; }
}


/* ===== Extracted from dashboard/partials/view_invited.php (block 1) ===== */
/* Row status tint */
.table tr.row-yes td{ background: rgba(52,199,89,.10) !important; }
.table tr.row-no td{ background: rgba(255,ba(255,159,10,.10) !important; }
.table tr.row-yes:hover td{ background:59,48,.10) !important; }
.table tr.row-pending td{ background: rg rgba(52,199,89,.16) !important; }
.table tr.row-no:hover td{ background: rgba(255,59,48,.16) !important; }
.table tr.row-pending:hover td{ background: rgba(255,159,10,.16) !important; }

/* Pills */
.pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-weight:900;font-size:12px;line-height:1;white-space:nowrap}
.pill-ok{background:rgba(52,199,89,.15);color:#34c759;border:1px solid rgba(52,199,89,.35)}
.pill-bad{background:rgba(255,59,48,.12);color:#ff3b30;border:1px solid rgba(255,59,48,.30)}
.pill-warn{background:rgba(255,159,10,.12);color:#ff9f0a;border:1px solid rgba(255,159,10,.30)}
.pill-muted{background:rgba(142,142,147,.12);color:rgba(142,142,147,1);border:1px solid rgba(142,142,147,.25)}

/* Filter bar */
.filterBar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}
.filterBtn{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:inherit;
  padding:8px 10px;border-radius:999px;font-weight:900;cursor:pointer;transition:transform .08s ease, background .15s ease}
.filterBtn:active{transform:scale(.98)}
.filterBtn.isActive{background:rgba(10,132,255,.18);border-color:rgba(10,132,255,.35)}
.filterStats{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:720px){ .filterStats{margin-left:0} }

.smallCount{opacity:.75;font-weight:900}

.table tr{transition:.15s ease;}
.table tr:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,.25);}
.table td{vertical-align:middle;}
.table td[data-inline="1"]:hover{background:rgba(10,132,255,.08);border-radius:8px;}
.actionBtn{padding:6px 9px;border-radius:8px;font-size:12px;font-weight:800;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);cursor:pointer;}
.actionBtn:hover{background:rgba(10,132,255,.18);}
.invStats{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
.invStat{padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);font-weight:900;}

/* Premium control bar (500+ guests) */
.invControlBar{
  position: -webkit-sticky;
  position: sticky;
  top: 0; /* sit under sticky header */
  z-index: 900; /* under header */
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  background:rgba(255, 255, 255, 0.7);
  border:1px solid rgba(255, 255, 255, 0.3);
  border-radius:14px;
  padding:10px 16px;
  margin-top:10px;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.invLeft{display:flex;gap:10px;align-items:center;flex-wrap:wrap;flex:1 1 auto;}
.invRight{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.invSearch{max-width:420px;min-width:260px;}
.invSelect{width:auto;min-width:160px;}
.invPager{display:flex;gap:8px;align-items:center;}
.invPageInfo{opacity:.8;font-weight:900;min-width:70px;text-align:center;}
@media (max-width:520px){
  .invSearch{max-width:100%;min-width:0;flex:1 1 100%;}
  .invSelect{min-width:0;flex:1 1 46%;}
}

/* Sticky reliability fixes */
.card.glass.cardPad{ overflow: visible !important; }



/* ===== Extracted from dashboard/partials/view_invited.php (block 2) ===== */
.invito-queue-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:9999;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.invito-queue-modal{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(520px,calc(100vw - 24px));
  border-radius:18px;padding:14px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);box-shadow:0 18px 50px rgba(0,0,0,.35)}
.invito-queue-title{font-weight:900;font-size:16px}
.invito-queue-sub{opacity:.85;font-size:12px;margin-top:2px}
.invito-queue-card{margin-top:12px;border-radius:16px;padding:12px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14)}
.invito-queue-row{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center}
.invito-queue-name{font-weight:900;font-size:15px}
.invito-queue-phone{opacity:.85;font-size:12px}
.invito-queue-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.invito-pill{display:inline-flex;gap:6px;align-items:center;padding:6px 10px;border-radius:999px;background:rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.12);font-size:12px;font-weight:900}



/* ===== Extracted from dashboard/partials/view_rsvp.php (block 1) ===== */
/* RSVP LEVEL 2 (sticky bar + stats + pagination + actions bar) */

.rsvpTopRow{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.rsvpActions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
}

#rsvpControlBar{
  position:sticky;
  top:0;
  z-index:30;
  background:rgba(255, 255, 255, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.3);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  padding:10px;
  border-radius:14px;
  margin-top:10px;
}

#rsvpControlBar form{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:10px
}

.rsvpStats{
  display:flex;
  gap:10px;
  flex-wrap:wrap
}

.rsvpStat{
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  font-weight:900
}

.table tr{transition:.15s ease;}
.table tr:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,.25);}
tr[data-status="da"]{background:rgba(52,199,89,.10);}
tr[data-status="ne"]{background:rgba(255,59,48,.10);}
tr[data-status=""]{background:rgba(255,255,255,.04);}

#rsvpPagination{
  margin-top:14px;
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  align-items:center
}
.pageBtn{
  padding:6px 10px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  cursor:pointer;
  font-weight:800
}
.pageBtn.active{background:rgba(10,132,255,.25);border-color:rgba(10,132,255,.35)}
.pageLabel{opacity:.75;font-weight:800;margin-left:6px}

@media (max-width:720px){
  .rsvpActions{ width:100%; justify-content:flex-start; }
}



/* ===== Extracted from dashboard/partials/view_settings.php (block 1) ===== */
/* ===== SETTINGS (Premium) ===== */
.settingsWrap{ margin-top:14px; }
.settingsHead{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.settingsHead .h2{ margin:0; }
.settingsSub{ margin-top:6px; opacity:.75; max-width:920px; }

.settingsGrid{ display:grid; gap:12px; margin-top:12px; }
.settingsCols{ display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:start; }
@media(max-width:980px){ .settingsCols{ grid-template-columns:1fr; } }

.settingsCard{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  padding:14px;
}
.settingsCard .h2{ margin:0 0 6px 0; }
.settingsCard .muted{ opacity:.78; }

.settingsCard .btnRow{ display:flex; gap:10px; flex-wrap:wrap; margin-top:10px; }

.settingsHint{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  font-size:12px;
  opacity:.85;
}

/* Theme block: make segmented control feel more premium */
.settingsTheme .segWrap{ margin-top:10px; }
.settingsTheme .seg{
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  padding:6px;
  gap:6px;
}

/* Right column: ensure invite card sits nicely */
.settingsRight > .card{ margin-top:0 !important; } /* in case invite partial has margin-top */



/* ===== Extracted from dashboard/partials/view_stats.php (block 1) ===== */
/* ===== Finance + Expenses only (v2.0) ===== */

.sep{
  height:14px;
  border-bottom:1px solid rgba(255,255,255,.08);
  margin:12px 0;
}

.sectionCard{
  padding:14px;
  border-radius:16px;
}

.sectionHead{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:10px;
}

.btnRow{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.formGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
@media (max-width: 720px){
  .formGrid{ grid-template-columns:1fr; }
}
.miniLabel{ margin-bottom:6px; font-size:12px; }

/* ===== Finance widget ===== */
.financeMini{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
}

.financeWidget{
  margin-top:12px;
  padding:14px;
  border-radius:18px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.finTop{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:12px;
}
@media (max-width: 720px){
  .finTop{ grid-template-columns:1fr; }
}
.finKpi{
  padding:10px 12px;
  border-radius:14px;
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
}
.finBig{
  font-size:20px;
  font-weight:950;
  letter-spacing:.2px;
  margin-top:6px;
  white-space:nowrap;
}
.finDiffVal.good{ color:#34c759; }
.finDiffVal.bad{ color:#ff3b30; }
.finDiffVal.neutral{ color: var(--text); }

.finBarWrap{ margin-top:12px; }
.finBar{
  height:10px;
  border-radius:999px;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  overflow:hidden;
}
.finBarFill{
  height:100%;
  width:0%;
  border-radius:999px;
  background: rgba(0,122,255,.85);
  transition: width .22s ease;
}
.finBarFill.ok{ background: rgba(52,199,89,.85); }
.finBarFill.warn{ background: rgba(255,149,0,.85); }
.finBarFill.bad{ background: rgba(255,59,48,.85); }

.finBarMeta{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:8px;
  font-size:12px;
}

.finTip{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  font-size:12px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  color: var(--text);
}
.finTip.ok{
  background: rgba(52,199,89,.10);
  border-color: rgba(52,199,89,.22);
}
.finTip.warn{
  background: rgba(255,149,0,.10);
  border-color: rgba(255,149,0,.22);
}
.finTip.bad{
  background: rgba(255,59,48,.10);
  border-color: rgba(255,59,48,.22);
}

/* ===== Expenses (Prateći troškovi) (kept from your file) ===== */
.expWrap{margin-top:14px;}
.expTop{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px;}
@media(max-width:980px){.expTop{grid-template-columns:1fr;}}
.expKpi{
  padding:14px;border-radius:18px;border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.06);position:relative;overflow:hidden;
  transition:transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s ease, border-color .22s ease;
}
.expKpi:before{content:"";position:absolute;inset:0;background:radial-gradient(900px 240px at 0% 0%, rgba(255,255,255,.10), transparent 55%);pointer-events:none;}
.expKpi:hover{transform:translateY(-2px);box-shadow:0 18px 44px rgba(0,0,0,.14);border-color:rgba(255,255,255,.16);}
.expKpi.bump{transform:scale(1.04);box-shadow:0 16px 42px rgba(0,0,0,.18);}
.expKpi .muted{opacity:.75;font-size:12px}
.expKpi .val{font-size:26px;font-weight:950;letter-spacing:.2px;line-height:1.05;margin-top:4px}

.expBarWrap{margin-top:12px;padding:12px;border-radius:18px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);}
.expBar{height:12px;border-radius:999px;overflow:hidden;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.06);display:flex;}
.expBarPaid{height:100%;width:0%;background:rgba(52,199,89,.85);transition:width .22s ease;}
.expBarRemain{height:100%;width:0%;background:rgba(0,122,255,.75);transition:width .22s ease;}
.expBarMeta{display:flex;justify-content:space-between;gap:10px;margin-top:8px;font-size:12px;opacity:.85}
.expTip{margin-top:10px;padding:10px 12px;border-radius:14px;font-size:12px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);}
.expTip.warn{background:rgba(255,149,0,.10);border-color:rgba(255,149,0,.22);}
.expTip.ok{background:rgba(52,199,89,.10);border-color:rgba(52,199,89,.22);}

.expPresetGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:10px;}
@media(max-width:1100px){.expPresetGrid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:520px){.expPresetGrid{grid-template-columns:1fr;}}
.expPresetBtn{
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.05));
  color:inherit;padding:14px;border-radius:18px;font-weight:950;cursor:pointer;text-align:left;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
  position:relative;overflow:hidden;
}
.expPresetBtn:before{content:"";position:absolute;inset:0;background:radial-gradient(900px 260px at 0% 0%, rgba(255,255,255,.12), transparent 55%);pointer-events:none;}
.expPresetBtn:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(0,0,0,.12);border-color:rgba(255,255,255,.18);}
.expPresetBtn:active{transform:translateY(0) scale(.99)}
.expPresetBtn .muted{font-weight:650;font-size:12px;opacity:.75}
.expPresetBtn.add{background:linear-gradient(180deg, rgba(0,122,255,.14), rgba(255,255,255,.05));border-color:rgba(0,122,255,.28);}

.expTools{
  display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  margin: 10px 0 12px;
  padding:10px;border-radius:16px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);
}
.expTools .input{height:42px;line-height:42px;border-radius:999px !important;padding:0 14px !important;}
.expToolsLeft{flex:1;min-width:240px;}
.expChips{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.expChip{
  border-radius:999px;padding:10px 12px;font-weight:900;font-size:12px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.85);
  cursor:pointer;
  transition:transform .16s ease, background .16s ease, border-color .16s ease;
}
.expChip:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.20);background:rgba(255,255,255,.07);}
.expChip.active{background:rgba(0,122,255,.18);border-color:rgba(0,122,255,.35);color:#fff;}
.expChip.good.active{background:rgba(52,199,89,.18);border-color:rgba(52,199,89,.35);}
.expChip.bad.active{background:rgba(255,149,0,.16);border-color:rgba(255,149,0,.35);}

.expTableWrap{margin-top:10px;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);}
.expTableWrap table{width:100%;border-collapse:separate;border-spacing:0;}
.expTableWrap th,.expTableWrap td{padding:9px 12px;vertical-align:top;}
.expTableWrap thead th{
  position:sticky;top:0;z-index:3;background:rgba(255,255,255,.08);
  backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.10);
  font-size:12px;letter-spacing:.25px;color:rgba(255,255,255,.82);
}
.expTableWrap tbody tr:hover{background:rgba(255,255,255,.035);}
.expTableWrap tbody tr + tr td{border-top:1px solid rgba(255,255,255,.06);}
.expCellTitle{font-weight:950;letter-spacing:.2px;font-size:14px}
.expCellCat{font-size:12px;opacity:.72;margin-top:2px}
.expTableWrap .input{border-radius:12px !important;height:40px;line-height:40px;padding:0 12px !important;}
.expRowSum{margin-top:4px;font-size:12px;opacity:.72;}
.expActions{display:flex;flex-direction:column;align-items:flex-end;gap:7px;}
.expActions .btn{width:110px;justify-content:center;border-radius:999px;padding:10px 14px;}
@media(max-width:900px){
  .expTableWrap{overflow:visible;}
  .expTableWrap table,.expTableWrap thead,.expTableWrap tbody,.expTableWrap th,.expTableWrap td,.expTableWrap tr{display:block;}
  .expTableWrap thead{display:none;}
  .expTableWrap tbody tr{padding:12px;border-top:1px solid rgba(255,255,255,.08);}
  .expTableWrap tbody tr:first-child{border-top:none;}
  .expTableWrap td{padding:8px 0;border:none !important;}
  .expActions{align-items:stretch;}
  .expActions .btn{width:100%;}
}



/* ===== Extracted from dashboard/partials/view_tables.php (block 1) ===== */
.tablesTopBar{ margin-top:12px; display:flex; gap:12px; flex-wrap:wrap; align-items:center; justify-content:space-between; }
    .tablesActions{ display:flex; gap:10px; flex-wrap:wrap; }

    /* GLOBAL KPI grid */
    .globalKpiGrid{
      margin-top:12px;
      display:grid;
      grid-template-columns: repeat(4, minmax(0,1fr));
      gap: 10px;
    }
    @media(max-width:980px){
      .globalKpiGrid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
    }
    .kpiCardMini{
      padding: 12px;
      border-radius: 20px;
      background: rgba(255,255,255,.18);
      border: 1px solid rgba(255,255,255,.10);
      box-shadow: none;
    }
    @media (prefers-color-scheme: dark){
      .kpiCardMini{ background: rgba(255,255,255,.06); }
    }
    .kpiMiniLabel{ font-size:12px; font-weight:900; color: var(--text-secondary); display:flex; align-items:center; gap:8px; }
    .kpiMiniTag{ font-size:10px; font-weight:950; letter-spacing:.04em; padding:3px 8px; border-radius:999px;
      border:1px solid var(--separator); background: rgba(255,255,255,.12); color: var(--text-secondary); }
    .kpiMiniValue{ font-size:22px; font-weight:950; letter-spacing:.2px; margin-top:6px; line-height:1.05; }
    .kpiMiniHint{ margin-top:6px; font-size:12px; opacity:.8; }
    .kpiMiniBar{
      margin-top:10px; height:10px; border-radius:999px;
      background: rgba(255,255,255,.08);
      border: 1px solid rgba(255,255,255,.10);
      overflow:hidden;
    }
    .kpiMiniBar > i{
      display:block; height:100%; width:0%;
      border-radius:999px;
      background: rgba(10,132,255,.85);
      transition: width .25s ease;
    }

    /* Responsive grid for tables */
    #drag-map{ margin-top: 12px; display:grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); align-items: start; }

    .tableCard{ padding:12px; min-height:160px; transition: transform .12s ease, box-shadow .18s ease, border-color .18s ease; }
    .tableCard:hover{ transform: translateY(-1px); box-shadow: 0 14px 40px rgba(0,0,0,.12); }
    .tableCardOver { border: 1px solid rgba(255, 59, 48, .55) !important; box-shadow: 0 0 0 3px rgba(255, 59, 48, .10); }
    .tableOverBadge { display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; background: rgba(255, 59, 48, .12); color: rgba(255, 59, 48, .95); font-weight: 800; white-space: nowrap; }

    .tableTrashBtn{ border:0; background:transparent; cursor:pointer; padding:8px; border-radius:12px; transition: background .15s ease, transform .12s ease; }
    .tableTrashBtn:hover{ background: rgba(255,255,255,.08); }
    .tableTrashBtn:active{ transform: scale(.98); }

    .tableMetaPill{ display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.10); font-weight: 800; white-space: nowrap; }
    .freeCount.zero{ color:#ff3b30; }

    .tableProgress{ margin-top:10px; height:10px; border-radius:999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.10); overflow:hidden; }
    .tableProgress > i{ display:block; height:100%; width:0%; border-radius:999px; background: rgba(10, 132, 255, .85); transition: width .25s ease; }
    .tableProgress.over > i{ background: rgba(255, 59, 48, .85); }

    .dropzone{ list-style:none; padding:0; margin:10px 0 0; min-height:90px; border-radius: 18px; transition: background .15s ease, box-shadow .15s ease; }
    .dropzone.isOver{ background: rgba(10,132,255,.10); box-shadow: 0 0 0 3px rgba(10,132,255,.10); }

    .draggable{ padding:10px; margin:8px 0; border-radius:18px; cursor:grab; user-select:none; transition: transform .12s ease, box-shadow .15s ease; }
    .draggable:active{ cursor:grabbing; transform: scale(.995); }
    .draggable:hover{ box-shadow: 0 10px 26px rgba(0,0,0,.10); }

    .tableSavePill{ display:inline-flex; align-items:center; gap:8px; padding:10px 12px; border-radius:999px; border:1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.08); font-weight: 900; white-space: nowrap; }
    .dotState{ width:10px; height:10px; border-radius:999px; background: rgba(52,199,89,.95); box-shadow: 0 0 0 3px rgba(52,199,89,.10); }
    .dotSaving{ background: rgba(255,159,10,.95); box-shadow: 0 0 0 3px rgba(255,159,10,.12); }
    .dotError{ background: rgba(255,59,48,.95); box-shadow: 0 0 0 3px rgba(255,59,48,.12); }

    .card.glass.cardPad{ overflow: visible !important; }



/* ===== Extracted from dashboard/partials/view_costs.php (block 1) ===== */
/* ===== PREMIUM v1.5 polish ===== */
.costShell{margin-top:14px;}
.costHead{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.costHead .h2{margin:0;}
.costSub{margin-top:6px;max-width:860px;opacity:.78}

/* KPI */
.costTop{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px;}
@media(max-width:900px){.costTop{grid-template-columns:1fr;}}

.kpi{
  padding:14px;border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.06);
  position:relative;overflow:hidden;
  transition: transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s ease, border-color .22s ease;
  will-change: transform;
}
.kpi:before{
  content:"";position:absolute;inset:0;
  background: radial-gradient(900px 240px at 0% 0%, rgba(255,255,255,.10), transparent 55%);
  pointer-events:none;
}
.kpi::after{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  border-radius:18px 0 0 18px;opacity:.9;background:rgba(255,255,255,.22);
}
.kpi.kpiPaid::after{ background:rgba(52,199,89,.70); }
.kpi.kpiRemain::after{ background:rgba(255,149,0,.70); }

.kpi .muted{opacity:.75;font-size:12px}
.kpi .val{font-size:26px;font-weight:950;letter-spacing:.2px;line-height:1.05;margin-top:4px}
.kpi:hover{transform: translateY(-2px);box-shadow:0 18px 44px rgba(0,0,0,.14);border-color:rgba(255,255,255,.16);}
.kpi.bump{transform: scale(1.04);box-shadow:0 16px 42px rgba(0,0,0,.18);}

/* Budget bar */
.budgetBarWrap{
  margin-top:12px;padding:12px;border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
}
.budgetBar{
  height:12px;border-radius:999px;overflow:hidden;border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);display:flex;
}
.budgetPaid{height:100%;width:0%;background:rgba(52,199,89,.85);transition:width .22s ease;}
.budgetRemain{height:100%;width:0%;background:rgba(0,122,255,.75);transition:width .22s ease;}
.budgetMeta{display:flex;justify-content:space-between;gap:10px;margin-top:8px;font-size:12px;opacity:.85}
.budgetTip{
  margin-top:10px;padding:10px 12px;border-radius:14px;font-size:12px;
  border:1px solid rgba(255,255,255,.10);background: rgba(255,255,255,.05);
}
.budgetTip.warn{background: rgba(255,149,0,.10);border-color: rgba(255,149,0,.22);}
.budgetTip.ok{background: rgba(52,199,89,.10);border-color: rgba(52,199,89,.22);}

/* Sections */
.sectionCard{padding:14px;border-radius:18px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);}
.sectionHead{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
.sectionHead .h2{margin:0;}
.sectionRight{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.sep{height:14px;border-bottom:1px solid rgba(255,255,255,.08);margin:14px 0;}

/* Presets cards */
.costGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
@media(max-width:1100px){.costGrid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:520px){.costGrid{grid-template-columns:1fr;}}
.costBtn{
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.05));
  color:inherit;padding:14px;border-radius:18px;font-weight:950;cursor:pointer;text-align:left;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
  position:relative;overflow:hidden;
}
.costBtn:before{content:"";position:absolute;inset:0;background: radial-gradient(900px 260px at 0% 0%, rgba(255,255,255,.12), transparent 55%);pointer-events:none;}
.costBtn:hover{transform: translateY(-2px);box-shadow:0 16px 40px rgba(0,0,0,.12);border-color:rgba(255,255,255,.18);}
.costBtn:active{transform: translateY(0) scale(.99)}
.costBtn .muted{font-weight:650;font-size:12px;opacity:.75}
.costBtn.costBtnAdd{background: linear-gradient(180deg, rgba(0,122,255,.14), rgba(255,255,255,.05));border-color: rgba(0,122,255,.28);}

/* Tools bar (sticky on desktop) */
.costTools{
  display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  margin: 8px 0 12px;
  padding:10px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
}
@media(min-width:901px){
  .costTools{
    position: sticky;
    top: 10px;
    z-index: 5;
    backdrop-filter: blur(12px);
  }
}
.costSearch{ flex:1; min-width:240px; }
#costSearch{
  height:42px;line-height:42px;border-radius:999px !important;padding:0 14px !important;
}
.costFilters{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.chip{
  border-radius:999px;padding:10px 12px;font-weight:900;font-size:12px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.85);
  cursor:pointer;
  transition: transform .16s ease, background .16s ease, border-color .16s ease;
}
.chip:hover{transform: translateY(-1px);border-color: rgba(255,255,255,.20);background: rgba(255,255,255,.07);}
.chip.active{background: rgba(0,122,255,.18);border-color: rgba(0,122,255,.35);color:#fff;}
.chip.good.active{background: rgba(52,199,89,.18);border-color: rgba(52,199,89,.35);}
.chip.bad.active{background: rgba(255,149,0,.16);border-color: rgba(255,149,0,.35);}

/* Table wrapper */
.costTableWrap{
  margin-top:10px;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
}
.costTableWrap table{width:100%;border-collapse:separate;border-spacing:0;}
.costTableWrap th,.costTableWrap td{padding:9px 12px;vertical-align:top;}
.costTableWrap thead th{
  position: sticky;top: 0;z-index: 3;
  background: rgba(255,255,255,.08);
  backdrop-filter: blur(12px);
  border-bottom:1px solid rgba(255,255,255,.10);
  font-size:12px;letter-spacing:.25px;color: rgba(255,255,255,.82);
}
.costTableWrap tbody tr{transition: background .15s ease, transform .12s ease;}
.costTableWrap tbody tr:hover{background: rgba(255,255,255,.035);}
.costTableWrap tbody tr + tr td{border-top:1px solid rgba(255,255,255,.06);}

.cellTitle{font-weight:950;letter-spacing:.2px;font-size:14px}
.cellCat{font-size:12px;opacity:.72;margin-top:2px}

.costTableWrap .input{
  border-radius:12px !important;height:40px;line-height:40px;padding:0 12px !important;
}
.costTableWrap .input:focus{
  outline:none;
  box-shadow: 0 0 0 3px rgba(0,122,255,.22);
}
.costTableWrap .input.sm{min-width:90px;}
.costTableWrap .input.md{min-width:110px;}
.costTableWrap .rowSum{margin-top:4px;font-size:12px;opacity:.72;}
.costTableWrap .rowSum b{font-weight:900;opacity:1}

.pill{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 10px;border-radius:999px;font-weight:950;font-size:12px;line-height:1;white-space:nowrap
}
.pill-ok{background:rgba(52,199,89,.15);color:#34c759;border:1px solid rgba(52,199,89,.35)}
.pill-warn{background:rgba(255,159,10,.12);color:#ff9f0a;border:1px solid rgba(255,159,10,.30)}

.actions{
  display:flex;flex-direction:column;align-items:flex-end;gap:7px;flex-wrap:nowrap;
}
.actions .btn{
  width:110px;justify-content:center;border-radius:999px;padding:10px 14px;
}

/* Modal */
#customModal.zip-modal{
  position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:16px;
  background: rgba(0,0,0,.45);backdrop-filter: blur(10px);z-index: 9999;
}
#customModal .zip-box{
  width:min(640px,96vw);max-width:640px;border-radius:22px;
  box-shadow:0 30px 90px rgba(0,0,0,.45);
  padding:16px;border:1px solid rgba(255,255,255,.12);
  background: rgba(20,20,20,.68);backdrop-filter: blur(16px);
}
#customModal .zip-title{font-size:16px;font-weight:950;letter-spacing:.2px;margin-bottom:6px;}
.modalGrid{display:grid;gap:10px;margin-top:12px;}
.modalTwo{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
@media(max-width:520px){.modalTwo{grid-template-columns:1fr;}}
#customModal .modalGrid .input{height:44px;line-height:44px;}

/* Mobile cards for table */
@media (max-width: 900px){
  .costTableWrap{overflow:visible;}
  .costTableWrap table,.costTableWrap thead,.costTableWrap tbody,.costTableWrap th,.costTableWrap td,.costTableWrap tr{display:block;}
  .costTableWrap thead{display:none;}
  .costTableWrap tbody tr{padding:12px;border-top:1px solid rgba(255,255,255,.08);}
  .costTableWrap tbody tr:first-child{border-top:none;}
  .costTableWrap td{padding:8px 0;border:none !important;}
  .actions{align-items:stretch;}
  .actions .btn{width:100%;}
  .costTools{position:static;}
}



/* ===== Extracted from dashboard/export.php (block 1) ===== */
body{font-family:Arial,Helvetica,sans-serif;background:#fff;color:#111;margin:20px}
  h1{font-size:18px;margin:0 0 12px}
  .meta{color:#666;font-size:12px;margin-bottom:12px}
  table{border-collapse:collapse;width:100%}
  th,td{border:1px solid #ddd;padding:8px;font-size:12px;vertical-align:top}
  th{background:#f4f4f4;text-align:left}
  @media print { body{margin:0} }



/* ===== Extracted from dashboard/export_restaurant.php (block 1) ===== */
body{font-family:Arial;padding:20px;}
      table{border-collapse:collapse;width:100%;}
      th,td{border:1px solid #ccc;padding:8px;text-align:left;}
      th{background:#f2f2f2;}


/* ===== Legacy assets/style.css content (kept for compatibility) ===== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
    --primary: #4f46e5;
    --bg-main: #f8fafc;
    --text-main: #1e293b;
    --border: #e2e8f0;
}

body {
    background-color: var(--bg-main);
    font-family: 'Inter', sans-serif;
    color: var(--text-main);
    margin: 0;
    padding: 20px;
}

.container { max-width: 1100px; margin: 0 auto; }

.card {
    background: white;
    border-radius: 12px;
    border: 1px solid var(--border);
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

table {
    width: 100%;
    border-collapse: collapse;
    background: white;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border);
}

th {
    background: #f1f5f9;
    padding: 12px 15px;
    text-align: left;
    font-size: 11px;
    text-transform: uppercase;
    color: #64748b;
}

td {
    padding: 15px;
    border-top: 1px solid var(--border);
    font-size: 14px;
}

.btn {
    padding: 7px 12px;
    border-radius: 6px;
    border: 1px solid var(--border);
    cursor: pointer;
    background: white;
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
    color: var(--text-main);
}

.btn-primary { background: var(--primary); color: white; border: none; }

.badge {
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    display: inline-block;
}

.badge-active { background: #dcfce7; color: #166534; }
.badge-susp { background: #fee2e2; color: #991b1b; }

/* ===== KPI Apple Animation ===== */

.kpi{
  transition:
    transform .25s cubic-bezier(.2,.8,.2,1),
    box-shadow .25s ease;
}

.kpi.bump{
  transform: scale(1.05);
  box-shadow: 0 10px 30px rgba(0,0,0,.15);
}
/* ===== INVITO LIVE HEADER KPI ===== */

.statsPills{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.pill{
  display:flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  font-weight:600;

  transition:
    transform .22s cubic-bezier(.2,.8,.2,1),
    box-shadow .22s ease;
}

.pill.bump{
  transform:scale(1.08);
  box-shadow:0 8px 22px rgba(0,0,0,.15);
}

.dot{
  width:6px;
  height:6px;
  border-radius:50%;
}



/* ===== Compatibility helpers (auth/export pages) ===== */
.authPage{
  min-height: 100vh;
  padding: 22px;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-sf, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif);
}
.authPage form{
  max-width: 520px;
  margin: 14px auto 0;
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--r-xl, 24px);
  padding: 14px;
  box-shadow: var(--shadow-card);
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
}
.authPage input, .authPage button{
  width: 100%;
  box-sizing: border-box;
  margin-top: 10px;
}
.textDanger{ color: var(--danger, #ff3b30); font-weight: 700; }

.exportPage{
  padding: 18px;
  background: #fff;
  color: #111;
}
@media print{
  .exportPage{ padding: 0; }
}

/* =========================
   INVITO HEADER POLISH v1
   ========================= */

/* ===== INVITO FINAL KPI ===== */

.statsGrid{
  margin-top:8px;
  display:flex;
  gap:10px;
  overflow-x:auto;
  overflow-y:hidden;
  padding-bottom:6px;
  -webkit-overflow-scrolling:touch;
}

.statsGrid::-webkit-scrollbar{
  display:none;
}

.statsGrid > .kpiCard{
  min-width:180px;
  padding:10px 12px;
  border-radius:18px;
}

.kpiLabel{
  font-size:11px;
}

.kpiValue{
  font-size:20px;
  margin-top:3px;
}

.kpiHint{
  display:none;
}

/* =============================================================
   INVITO CLEAN CORE v4
   - single header system
   - compact premium shell
   - merged KPI header
   ============================================================= */
:root{
  --app-max: 1560px;
  --hdr-h: 0px;
  --shell-radius: 34px;
  --card-radius: 24px;
  --header-pad-y: 18px;
  --header-pad-x: 18px;
  --title-size: 22px;
  --title-size-condensed: 28px;
}

html, body{ overflow-x:hidden; }
body{ background:#eef1f5; color:#111827; }
.container{
  width:min(calc(100% - 32px), var(--app-max));
  margin: 0 auto;
  padding: 16px 0 calc(var(--tabbar-h) + 26px + env(safe-area-inset-bottom));
}
.header{
  position: sticky;
  top: 10px;
  z-index: 70;
  width:min(calc(100% - 32px), var(--app-max));
  margin: 14px auto 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.headerInner{
  border-radius: var(--shell-radius);
  padding: var(--header-pad-y) var(--header-pad-x) 18px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 18px 46px rgba(15,23,42,.08);
}
.heroRow{ display:flex; align-items:flex-start; gap:16px; }
.heroBurger,
.burger{
  width: 58px;
  height: 58px;
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(244,246,249,.96) 100%);
  color:#1f2937;
  box-shadow: 0 8px 22px rgba(15,23,42,.06);
}
.heroTextStack{ min-width:0; flex:1; }
.pageHeroKicker{
  display:inline-flex;
  align-items:center;
  height: 32px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.08);
  background: linear-gradient(180deg, #f5f7fa 0%, #ebeff4 100%);
  color:#6b7280;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
  margin: 0 0 14px;
}
.largeTitle{
  margin:0;
  font-size: var(--title-size);
  line-height: .98;
  letter-spacing: -.045em;
  font-weight: 900;
  color:#1f2f67;
}
.subtitle{
  margin: 8px 0 0;
  font-size: 15px;
  line-height: 1.3;
  font-weight: 700;
  color: #6b7280;
}
.statsGridCompact{
  display:grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 16px;
  margin-top: 18px;
}
.kpiCard{
  border-radius: var(--card-radius);
  border: 1px solid rgba(15,23,42,.08);
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,250,252,.96) 100%);
  box-shadow: 0 12px 28px rgba(15,23,42,.05);
  padding: 18px;
  min-width:0;
}
.kpiSummary{ box-shadow: inset 4px 0 0 rgba(100,116,139,.55), 0 12px 28px rgba(15,23,42,.05); }
.kpiArrivals{ box-shadow: inset 4px 0 0 rgba(34,197,94,.55), 0 12px 28px rgba(15,23,42,.05); }
.kpiHead{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:14px; }
.kpiLabelWrap{ display:flex; align-items:flex-start; gap:10px; min-width:0; }
.kpiIconBadge{
  width: 36px; height: 36px; border-radius: 13px; display:grid; place-items:center; flex:0 0 36px;
  border:1px solid rgba(15,23,42,.06); color:#64748b; background:#edf2f7;
}
.kpiIconBadge.isGreen{ color:#22c55e; background:rgba(34,197,94,.10); }
.kpiIconBadge.isSlate{ color:#64748b; background:#edf2f7; }
.kpiIconBadge svg{ width:18px; height:18px; }
.kpiTitle{ font-size:15px; line-height:1.15; font-weight:900; color:#111827; }
.kpiSub{ margin-top:4px; font-size:12px; color:#6b7280; font-weight:700; }
.kpiTag{
  display:inline-flex; align-items:center; justify-content:center; min-height:30px; padding:0 12px; white-space:nowrap;
  border-radius:999px; border:1px solid rgba(15,23,42,.06); background:#f3f4f6; color:#6b7280;
  font-size:12px; font-weight:900; letter-spacing:.12em; text-transform:uppercase;
}
.kpiMainRow{ display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:14px; }
.kpiMainValue{ font-size:56px; line-height:.95; letter-spacing:-.05em; font-weight:900; color:#0f172a; }
.kpiBlue{ color:#3b82f6; }
.kpiHint{ margin-top:4px; font-size:13px; color:#6b7280; font-weight:700; }
.kpiMiniStats{ display:grid; grid-template-columns:1fr; gap:8px; min-width:180px; }
.kpiMiniStat{
  display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; border-radius:14px;
  border:1px solid rgba(15,23,42,.06); background:#f8fafc;
}
.kpiMiniLabel{ font-size:12px; color:#6b7280; font-weight:800; }
.kpiMiniStat strong{ font-size:24px; line-height:1; font-weight:900; color:#111827; }
.kpiMiniStat.isBlue strong{ color:#3b82f6; }
.kpiMiniStat.isRed strong{ color:#ef4444; }
.kpiMiniStat.isGreen strong{ color:#22c55e; }
.compactRows{ gap:10px; }
.kpiPairRow{
  display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px;
  border-radius:16px; background:#f8f8f9; border:1px solid rgba(15,23,42,.06);
}
.kpiPairLabel{ display:flex; align-items:center; gap:8px; min-width:0; font-size:14px; color:#374151; font-weight:800; }
.kpiPairLabel svg{ width:18px; height:18px; flex:0 0 18px; color:#6b7280; }
.kpiPairValue{ display:flex; align-items:center; gap:8px; flex:0 0 auto; font-size:16px; font-weight:900; color:#111827; white-space:nowrap; }
.kpiSlash{ opacity:.35; }
.kpiWarnRow{ background:rgba(239,68,68,.06); border-color:rgba(239,68,68,.12); }
.kpiWarnRow .kpiPairLabel, .kpiWarnRow .kpiPairValue{ color:#b91c1c; }

body.is-condensed .header{ top: 6px; }
body.is-condensed .headerInner{ padding: 12px 14px 14px; border-radius: 28px; }
body.is-condensed .heroBurger,
body.is-condensed .burger{ width:46px; height:46px; border-radius:15px; }
body.is-condensed .pageHeroKicker{ height:28px; padding:0 12px; margin-bottom:8px; font-size:11px; }
body.is-condensed .largeTitle{ font-size: var(--title-size-condensed); }
body.is-condensed .subtitle{ margin-top:4px; font-size:13px; }
body.is-condensed .statsGridCompact{ margin-top:12px; gap:12px; }
body.is-condensed .kpiCard{ padding:14px; border-radius:20px; }
body.is-condensed .kpiMainValue{ font-size:42px; }
body.is-condensed .kpiPairRow{ padding:10px 12px; border-radius:14px; }
body.is-condensed .kpiMiniStat strong{ font-size:20px; }

.tabbar{ left:50%; transform:translateX(-50%); width:min(calc(100% - 32px), var(--app-max)); }
.tabbarInner{ border-radius:28px; }

.premiumUserCard{
  display:flex; align-items:center; gap:12px; padding:14px 14px 12px; border:1px solid rgba(0,0,0,.06); border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(248,248,250,.90) 100%); box-shadow:0 10px 30px rgba(16,24,40,.06); margin-bottom:14px;
}
.premiumUserAvatar{ width:42px; height:42px; border-radius:14px; display:grid; place-items:center; flex:0 0 42px; font-size:15px; font-weight:800; color:#111827; background:linear-gradient(180deg, #ffffff 0%, #eceff3 100%); border:1px solid rgba(15,23,42,.08); }
.premiumUserMeta{ min-width:0; flex:1; }
.premiumUserEyebrow{ font-size:11px; line-height:1.1; letter-spacing:.14em; text-transform:uppercase; color:rgba(17,24,39,.48); margin-bottom:5px; font-weight:700; }
.premiumUserName{ font-size:17px; line-height:1.15; font-weight:800; color:#111827; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:6px; }
.premiumUserIdRow{ display:flex; align-items:center; gap:8px; min-width:0; }
.premiumUserIdLabel{ font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:rgba(17,24,39,.42); flex:0 0 auto; }
.premiumUserIdValue{ min-width:0; display:inline-flex; align-items:center; max-width:100%; padding:5px 9px; border-radius:999px; background:rgba(17,24,39,.045); border:1px solid rgba(17,24,39,.06); color:#374151; font-size:12px; line-height:1; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

@media (max-width: 1180px){
  .statsGridCompact{ grid-template-columns: 1fr; }
}
@media (max-width: 768px){
  :root{ --title-size: 34px; --title-size-condensed: 24px; }
  .header{ width:calc(100% - 12px); margin-top:6px; top:6px; }
  .container{ width:calc(100% - 12px); padding-top:10px; }
  .headerInner{ border-radius:24px; padding:14px 14px 16px; }
  .heroRow{ gap:12px; }
  .heroBurger,.burger{ width:50px; height:50px; border-radius:16px; }
  .pageHeroKicker{ height:30px; padding:0 13px; margin-bottom:10px; font-size:11px; }
  .subtitle{ font-size:14px; max-width: 100%; }
  .kpiMainRow{ flex-direction:column; align-items:flex-start; }
  .kpiMiniStats{ width:100%; min-width:0; grid-template-columns:repeat(2, minmax(0,1fr)); }
  .kpiMainValue{ font-size:48px; }
  .kpiPairLabel{ font-size:13px; }
  .kpiPairValue{ font-size:15px; }
  .tabbar{ width:calc(100% - 8px); bottom:4px; }
}
@media (max-width: 560px){
  .kpiMiniStats{ grid-template-columns:1fr; }
  .kpiHead{ align-items:flex-start; }
  .kpiTag{ min-height:28px; padding:0 10px; font-size:11px; }
  .kpiPairRow{ align-items:flex-start; flex-direction:column; }
  .kpiPairValue{ width:100%; justify-content:flex-end; }
}
 .topActionBtn{
    width:38px;
    height:38px;
    border:0;
    border-radius:999px;
    background:transparent;
    color:#4b5563;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:all .18s ease;
    position:relative;
  }
  .topActionBtn:hover{
    background:rgba(17,24,39,.055);
    color:#111827;
  }
  .topActionBtn svg{
    width:22px;
    height:22px;
    display:block;
  }
  .topActionBtn.isStarred{
    color:#111827;
  }
  .topActionBtn .badgeDot{
    position:absolute;
    top:7px;
    right:7px;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#ff5d4d;
    box-shadow:0 0 0 2px #fff;
  }

/* ===== TOP ACTION ICON FIX ===== */
.topActionBar{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:10px !important;
  flex:0 0 auto !important;
}
.topActionBtn{
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  min-height:38px !important;
  border:0 !important;
  border-radius:999px !important;
  background:transparent !important;
  color:#374151 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:relative !important;
  font-size:0 !important;
  line-height:0 !important;
  padding:0 !important;
  box-shadow:none !important;
  -webkit-appearance:none !important;
  appearance:none !important;
}
.topActionBtn::before,
.topActionBtn::after{
  content:none !important;
  display:none !important;
}
.topActionBtn svg{
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  min-height:22px !important;
  display:block !important;
  overflow:visible !important;
  flex:0 0 22px !important;
  max-width:none !important;
}
.topActionBtn svg,
.topActionBtn svg *{
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:2 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  vector-effect:non-scaling-stroke;
}
.topActionBtn:hover{
  background:rgba(17,24,39,.06) !important;
  color:#111827 !important;
}
.topActionBtn .badgeDot{
  position:absolute !important;
  top:7px !important;
  right:7px !important;
  width:8px !important;
  height:8px !important;
  border-radius:50% !important;
  background:#ff5d4d !important;
  box-shadow:0 0 0 2px #fff !important;
}
@media (max-width:768px){
  .topActionBar{ gap:8px !important; }
  .topActionBtn{
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    min-height:34px !important;
  }
  .topActionBtn svg{
    width:20px !important;
    height:20px !important;
    min-width:20px !important;
    min-height:20px !important;
    flex-basis:20px !important;
  }
}