/* =============================================================================
   fh-split-event.css v1.1.0  (2026-10-04)
   Split Expense › Special Events & Occasions
   Reuses .gp-sx-* / .gp-exp-* building blocks from fh-split-expense.css.
   ============================================================================= */

/* Mode bar + event-mode hiding rules live in fh-split-expense.css (v10.3),
   because the mode bar markup belongs to the Split Expense tab. */

/* Workspace hero + breadcrumb */
.gp-sev-hero { display:flex; align-items:center; gap:14px; padding:16px 18px; margin-bottom:12px; border-radius:14px;
  background:linear-gradient(135deg,#fdf2f8 0%,#fff7ed 100%); border:1px solid #fbcfe8; }
.gp-sev-hero-ico { width:46px; height:46px; border-radius:12px; background:linear-gradient(135deg,#db2777,#f59e0b); color:#fff;
  display:inline-flex; align-items:center; justify-content:center; font-size:20px; flex-shrink:0; box-shadow:0 4px 12px rgba(219,39,119,.25); }
.gp-sev-hero-text { flex:1; min-width:0; }
.gp-sev-hero-text h4 { margin:0 0 3px; font-size:16px; color:#831843; }
.gp-sev-hero-text p { margin:0; font-size:12.5px; color:#9d174d; opacity:.85; line-height:1.4; }
.gp-sev-btn-primary { background:#be185d !important; border-color:#be185d !important; color:#fff !important; white-space:nowrap; }
.gp-sev-crumb { display:flex; align-items:center; gap:8px; font-size:12px; color:#94a3b8; margin:0 0 10px; padding:7px 12px;
  background:linear-gradient(90deg,#fdf2f8,#fff); border-left:3px solid #db2777; border-radius:6px; min-width:0; }
.gp-sev-crumb a { color:#be185d; text-decoration:none; font-weight:600; white-space:nowrap; }
.gp-sev-crumb a:hover { text-decoration:underline; }
.gp-sev-crumb span { color:#334155; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }

/* Type accent colours */
.gp-sev-card, .gp-sev-detail { --sev:#6366f1; --sev-bg:#eef2ff; }
.t-wedding      { --sev:#db2777; --sev-bg:#fdf2f8; }
.t-festival     { --sev:#d97706; --sev-bg:#fffbeb; }
.t-puja         { --sev:#ea580c; --sev-bg:#fff7ed; }
.t-birthday     { --sev:#7c3aed; --sev-bg:#f5f3ff; }
.t-anniversary  { --sev:#e11d48; --sev-bg:#fff1f2; }
.t-trip         { --sev:#0284c7; --sev-bg:#f0f9ff; }
.t-party        { --sev:#9333ea; --sev-bg:#faf5ff; }
.t-funeral      { --sev:#475569; --sev-bg:#f1f5f9; }
.t-housewarming { --sev:#059669; --sev-bg:#ecfdf5; }
.t-other        { --sev:#6366f1; --sev-bg:#eef2ff; }

/* ── List ── */
.gp-sev-list-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:8px; flex-wrap:wrap; }
.gp-sev-list-head h4 { margin:0 0 2px; font-size:15px; color:#0f172a; display:flex; gap:8px; align-items:center; }
.gp-sev-list-head p { margin:0; font-size:12px; max-width:520px; }
.gp-sx-chip small { opacity:.7; margin-left:2px; }

.gp-sev-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px; margin-top:4px; }
.gp-sev-card { background:#fff; border:1px solid #e2e8f0; border-top:3px solid var(--sev); border-radius:12px; padding:14px; cursor:pointer;
  display:flex; flex-direction:column; gap:8px; transition:box-shadow .15s, transform .15s, border-color .15s; }
.gp-sev-card:hover { box-shadow:0 6px 18px rgba(15,23,42,.08); transform:translateY(-1px); }
.gp-sev-card:focus { outline:2px solid var(--sev); outline-offset:2px; }   /* Safari < 15.4 has no :focus-visible — kept as its own rule */
@media (hover:none) { .gp-sev-card:hover { transform:none; box-shadow:none; } }   /* no sticky hover on touch screens */
.gp-sev-card-top { display:flex; gap:10px; align-items:flex-start; }
.gp-sev-card-title { flex:1; min-width:0; }
.gp-sev-card-name { font-weight:700; color:#0f172a; font-size:14px; line-height:1.3; overflow:hidden; text-overflow:ellipsis; }
.gp-sev-card-meta { font-size:11.5px; color:#64748b; margin-top:2px; }
.gp-sev-card-amt { font-size:19px; font-weight:800; color:#0f172a; font-variant-numeric:tabular-nums; }
.gp-sev-card-amt small { font-size:11.5px; font-weight:500; color:#64748b; margin-left:4px; }
.gp-sev-card-foot { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:auto; font-size:12px; color:#475569; }
.gp-sev-card-net { white-space:nowrap; }
.gp-sev-avs { display:flex; }
.gp-sev-avs .gp-exp-av { width:26px; height:26px; font-size:10px; border:2px solid #fff; margin-left:-6px; }
.gp-sev-avs .gp-exp-av:first-child { margin-left:0; }
.gp-sev-av-more { background:#f1f5f9 !important; color:#475569 !important; }

.gp-sev-ico { width:34px; height:34px; border-radius:10px; background:var(--sev-bg); color:var(--sev); display:inline-flex;
  align-items:center; justify-content:center; flex-shrink:0; font-size:15px; }
.gp-sev-ico.lg { width:42px; height:42px; font-size:18px; border-radius:12px; }

.gp-sev-budget { height:6px; background:#f1f5f9; border-radius:4px; overflow:hidden; }
.gp-sev-budget span { display:block; height:100%; background:var(--sev); border-radius:4px; }
.gp-sev-budget.over span { background:#dc2626; }

.gp-sev-pill { display:inline-flex; align-items:center; gap:4px; padding:2px 9px; border-radius:10px; font-size:10.5px; font-weight:700; white-space:nowrap; vertical-align:middle; }
.gp-sev-pill.active  { background:#e0f2fe; color:#075985; }
.gp-sev-pill.closed  { background:#f1f5f9; color:#475569; }
.gp-sev-pill.settled { background:#dcfce7; color:#166534; }

/* ── Detail ── */
.gp-sev-dhead { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:8px; }
.gp-sev-dhead-title { flex:1; min-width:180px; }
.gp-sev-dhead-title h4 { margin:0 0 2px; font-size:16px; color:#0f172a; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.gp-sev-dhead-title .gp-sx-muted { font-size:12px; }
.gp-sev-dhead-actions { display:flex; gap:6px; flex-wrap:wrap; }
.gp-sev-dhead-actions .gp-btn:disabled { opacity:.5; cursor:not-allowed; }
.gp-sev-btn-danger { background:#fee2e2 !important; color:#b91c1c !important; }
.gp-sev-desc { font-size:12.5px; color:#475569; background:var(--sev-bg); border-radius:8px; padding:8px 12px; margin-bottom:8px; white-space:pre-line; }
.gp-sev-member-strip { display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-bottom:10px; }
.gp-sev-mchip { display:inline-flex; align-items:center; gap:6px; padding:2px 10px 2px 2px; border:1px solid #e2e8f0; border-radius:16px; font-size:12px; color:#334155; background:#fff; }
.gp-sev-mchip .gp-exp-av { width:22px; height:22px; font-size:9.5px; }
.gp-sev-mchip.me { border-color:#a5b4fc; background:#eef2ff; }

.gp-sev-tabs { display:flex; gap:2px; border-bottom:1px solid #e2e8f0; margin:12px 0; overflow-x:auto; scrollbar-width:none; }
.gp-sev-tabs::-webkit-scrollbar { display:none; }
.gp-sev-tab { background:none; border:0; padding:9px 14px; font-size:13px; font-weight:600; color:#94a3b8; cursor:pointer; white-space:nowrap;
  border-bottom:2px solid transparent; margin-bottom:-1px; font-family:inherit; display:inline-flex; gap:6px; align-items:center; }
.gp-sev-tab:hover { color:#0f172a; }
.gp-sev-tab.active { color:var(--sev); border-bottom-color:var(--sev); }

/* Payments */
.gp-sev-pay-row { display:grid; grid-template-columns:auto 1fr auto auto; gap:12px; align-items:center; padding:10px 14px; border-bottom:1px solid #f1f5f9; font-size:13px; }
.gp-sev-pay-row:last-child { border-bottom:0; }
.gp-sev-pay-avs { display:flex; align-items:center; gap:5px; }
.gp-sev-pay-avs .fa { color:#94a3b8; font-size:11px; }
.gp-sev-kind { display:inline-block; margin-left:6px; padding:1px 8px; border-radius:9px; font-size:10.5px; font-weight:700; }
.gp-sev-kind.contribution { background:#fef3c7; color:#92400e; }
.gp-sev-kind.settlement   { background:#dcfce7; color:#166534; }

.gp-sev-banner { display:flex; align-items:center; gap:8px; padding:10px 14px; border-radius:8px; font-size:13px; margin-bottom:8px; }
.gp-sev-banner.warn { background:#fffbeb; border:1px solid #fde68a; color:#92400e; }
.gp-sev-settle-preview { display:flex; align-items:center; gap:6px; flex-wrap:wrap; padding:12px 14px; background:#f0fdf4; border:1px solid #bbf7d0; border-radius:10px; margin-bottom:12px; font-size:14px; }
.gp-sev-settle-preview span { margin-left:auto; font-weight:800; font-size:16px; color:#166534; }

/* Modal helpers */
.gp-sev-modal-ov { z-index:100001; }
.gp-sev-modal { width:100%; }
.gp-sev-checklist { max-height:220px; overflow-y:auto; }
.gp-sev-checklist-tools { display:flex; justify-content:flex-end; margin:-4px 0 4px; }
.gp-sev-locked label { color:#64748b; cursor:not-allowed; }


/* Robust form sizing inside the event dialogs (theme-independent) */
#gp-sev-modal input, #gp-sev-modal select, #gp-sev-modal textarea { box-sizing:border-box; max-width:100%; }
#gp-sev-modal .gp-uh-form-row input, #gp-sev-modal .gp-uh-form-row select, #gp-sev-modal .gp-uh-form-row textarea { width:100%; }
#gp-sev-modal .gp-exp-form-grid > * { min-width:0; }
/* Money values never break between sign and amount */
.gp-sev-detail .gp-exp-scard-value, .gp-sev-card-net, .gp-sx-bal-val { white-space:nowrap; }

/* Toast */
.gp-sev-toast { position:fixed; left:50%; bottom:24px; transform:translate(-50%,20px); background:#0f172a; color:#fff; padding:10px 18px; border-radius:10px;
  font-size:13px; box-shadow:0 8px 24px rgba(0,0,0,.2); opacity:0; pointer-events:none; transition:opacity .2s, transform .2s; z-index:100002; max-width:90vw; }
.gp-sev-toast.show { opacity:1; transform:translate(-50%,0); }

@media (max-width:380px) {
  .gp-sev-tab .fa { display:none; }
}
@media (max-width:600px) {
  .gp-sev-hero { flex-wrap:wrap; padding:14px; }
  .gp-sev-hero .gp-sev-btn-primary { width:100%; justify-content:center; }
  .gp-sev-grid { grid-template-columns:1fr; }
  /* Compact event header on phones so the tabs stay near the top */
  .gp-sev-detail .gp-sx-cards { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .gp-sev-detail .gp-exp-scard { padding:9px 11px; }
  .gp-sev-detail .gp-exp-scard-value { font-size:15px; }
  .gp-sev-detail .gp-exp-scard-sub { display:none; }
  .gp-sev-member-strip { flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
  .gp-sev-member-strip::-webkit-scrollbar { display:none; }
  .gp-sev-mchip { flex-shrink:0; }
  .gp-sev-tab { flex:1 0 auto; justify-content:center; padding:9px 10px; font-size:12.5px; }
  .gp-sev-dhead-title h4 { font-size:15px; }
  .gp-sev-dhead-actions { width:100%; }
  .gp-sev-dhead-actions .gp-btn { flex:1; justify-content:center; }
  .gp-sev-pay-row { grid-template-columns:1fr auto; }
  .gp-sev-pay-row .gp-sev-pay-avs { display:none; }
}