/* Tema Spre Sine peste Bootstrap 5.3 — culorile și tipografia din mockup */

:root, [data-bs-theme="light"] {
  --ss-paper: #F4F6F1;
  --ss-surface: #FFFFFF;
  --ss-surface-2: #EDF1EA;
  --ss-ink: #212B25;
  --ss-muted: #5C6B61;
  --ss-line: #DCE3DA;
  --ss-brand: #33604B;
  --ss-brand-hover: #2A5040;
  --ss-on-brand: #F4F6F1;
  --ss-sidebar-bg: #22352B;
  --ss-ok-bg: #DDEBDD;     --ss-ok-fg: #28513B;
  --ss-warn-bg: #F3E7CE;   --ss-warn-fg: #7A5A1E;
  --ss-bad-bg: #F2DFD8;    --ss-bad-fg: #8A3B28;
  --ss-info-bg: #E0E7EE;   --ss-info-fg: #3D5570;
  --ss-neutral-bg: #E7EAE6;--ss-neutral-fg: #5C6B61;
  --ss-shadow: 0 1px 2px rgba(33,43,37,.06), 0 8px 24px rgba(33,43,37,.07);
  --ss-serif: 'Iowan Old Style', 'Palatino Linotype', 'Book Antiqua', Palatino, Georgia, serif;
}
[data-bs-theme="dark"] {
  --ss-paper: #141917;
  --ss-surface: #1C2320;
  --ss-surface-2: #242C28;
  --ss-ink: #E6EBE5;
  --ss-muted: #94A399;
  --ss-line: #2E3833;
  --ss-brand: #7FB79C;
  --ss-brand-hover: #93C6AD;
  --ss-on-brand: #141917;
  --ss-sidebar-bg: #161D19;
  --ss-ok-bg: #243B2D;     --ss-ok-fg: #9FCDAE;
  --ss-warn-bg: #3B321D;   --ss-warn-fg: #DBB86A;
  --ss-bad-bg: #3E2721;    --ss-bad-fg: #DE9B85;
  --ss-info-bg: #25313E;   --ss-info-fg: #9FB8D2;
  --ss-neutral-bg: #2A322D;--ss-neutral-fg: #A3B0A6;
  --ss-shadow: 0 1px 2px rgba(0,0,0,.35), 0 8px 24px rgba(0,0,0,.35);
}

/* ---- maparea pe variabilele Bootstrap ---- */
:root, [data-bs-theme] {
  --bs-body-bg: var(--ss-paper);
  --bs-body-color: var(--ss-ink);
  --bs-secondary-color: var(--ss-muted);
  --bs-border-color: var(--ss-line);
  --bs-link-color-rgb: 51, 96, 75;
  --bs-link-hover-color-rgb: 42, 80, 64;
  --bs-body-font-size: .94rem;
  --bs-border-radius: .5rem;
}
[data-bs-theme="dark"] { --bs-link-color-rgb: 127, 183, 156; --bs-link-hover-color-rgb: 147, 198, 173; }

h1, h2, h3, .h1, .h2, .h3, .h5 { font-family: var(--ss-serif); font-weight: 600; text-wrap: balance; }
h1 { font-size: 1.7rem; } h2 { font-size: 1.25rem; } h3 { font-size: 1.05rem; }

.btn-primary {
  --bs-btn-bg: var(--ss-brand); --bs-btn-border-color: var(--ss-brand); --bs-btn-color: var(--ss-on-brand);
  --bs-btn-hover-bg: var(--ss-brand-hover); --bs-btn-hover-border-color: var(--ss-brand-hover); --bs-btn-hover-color: var(--ss-on-brand);
  --bs-btn-active-bg: var(--ss-brand-hover); --bs-btn-active-border-color: var(--ss-brand-hover); --bs-btn-active-color: var(--ss-on-brand);
  --bs-btn-disabled-bg: var(--ss-brand); --bs-btn-disabled-border-color: var(--ss-brand);
  font-weight: 600;
}
.btn-outline-secondary {
  --bs-btn-color: var(--ss-ink); --bs-btn-border-color: var(--ss-line); --bs-btn-bg: var(--ss-surface);
  --bs-btn-hover-bg: var(--ss-surface-2); --bs-btn-hover-color: var(--ss-ink); --bs-btn-hover-border-color: var(--ss-brand);
  --bs-btn-active-bg: var(--ss-surface-2); --bs-btn-active-color: var(--ss-ink); --bs-btn-active-border-color: var(--ss-brand);
  --bs-btn-disabled-color: var(--ss-muted); --bs-btn-disabled-border-color: var(--ss-line);
}
.btn-danger {
  --bs-btn-bg: var(--ss-bad-fg); --bs-btn-border-color: var(--ss-bad-fg); --bs-btn-color: var(--ss-paper);
  --bs-btn-hover-bg: var(--ss-bad-fg); --bs-btn-hover-border-color: var(--ss-bad-fg); --bs-btn-hover-color: var(--ss-paper);
}
.btn-danger:hover { filter: brightness(1.1); }
.btn-xs { --bs-btn-padding-y: .15rem; --bs-btn-padding-x: .55rem; --bs-btn-font-size: .78rem; }

.form-control, .form-select { background-color: var(--ss-paper); border-color: var(--ss-line); color: var(--ss-ink); }
.form-control:focus, .form-select:focus { background-color: var(--ss-paper); color: var(--ss-ink); border-color: var(--ss-brand); box-shadow: 0 0 0 .2rem rgba(51, 96, 75, .2); }
.form-label { font-size: .78rem; font-weight: 600; color: var(--ss-muted); margin-bottom: .3rem; }
.form-check-input:checked { background-color: var(--ss-brand); border-color: var(--ss-brand); }

.card, .modal-content { background: var(--ss-surface); border-color: var(--ss-line); box-shadow: var(--ss-shadow); border-radius: 10px; }

.table { --bs-table-bg: transparent; --bs-table-color: var(--ss-ink); --bs-table-border-color: var(--ss-line); --bs-table-hover-bg: var(--ss-surface-2); margin-bottom: 0; font-size: .9rem; }
.table > thead th { font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ss-muted); font-weight: 600; white-space: nowrap; padding: .7rem .9rem; }
.table > tbody td { padding: .6rem .9rem; vertical-align: middle; }
.table > tbody tr:last-child td { border-bottom: 0; }
.num { font-variant-numeric: tabular-nums; }

.alert-success { --bs-alert-bg: var(--ss-ok-bg); --bs-alert-color: var(--ss-ok-fg); --bs-alert-border-color: transparent; }
.alert-warning { --bs-alert-bg: var(--ss-warn-bg); --bs-alert-color: var(--ss-warn-fg); --bs-alert-border-color: transparent; }
.alert-danger  { --bs-alert-bg: var(--ss-bad-bg); --bs-alert-color: var(--ss-bad-fg); --bs-alert-border-color: transparent; }
.alert-info    { --bs-alert-bg: var(--ss-info-bg); --bs-alert-color: var(--ss-info-fg); --bs-alert-border-color: transparent; }

/* ---- layout ---- */
body.has-sidebar { display: flex; min-height: 100vh; }
.sidebar {
  width: 232px; flex: none; background: var(--ss-sidebar-bg); color: #E9EFE7;
  display: flex; flex-direction: column; padding: 26px 16px 18px;
  position: sticky; top: 0; height: 100vh;
}
.logo { display: flex; align-items: center; gap: 11px; padding: 0 8px 22px; color: inherit; text-decoration: none; }
.logo .word { font-family: var(--ss-serif); font-size: 1.12rem; line-height: 1.15; }
.logo .word small { display: block; font-family: var(--bs-body-font-family); font-size: .62rem; letter-spacing: .17em; text-transform: uppercase; color: #9DB2A3; margin-top: 3px; }
.sidenav { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.sidenav a { color: #9DB2A3; text-decoration: none; padding: 9px 10px; border-radius: 8px; font-size: .92rem; }
.sidenav a:hover { color: #E9EFE7; background: rgba(255,255,255,.05); }
.sidenav a.active { color: #E9EFE7; background: rgba(255,255,255,.09); font-weight: 600; }
.whoami { padding: 10px; border-top: 1px solid rgba(255,255,255,.12); font-size: .85rem; min-width: 0; }
.whoami .role-tag { color: #9DB2A3; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }

.main { flex: 1; min-width: 0; padding: 30px 38px 70px; max-width: 1160px; }
body.auth-page .main { max-width: 460px; margin: 0 auto; padding: 8vh 20px 40px; }

.eyebrow { font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ss-muted); }
.pagehead { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 22px; flex-wrap: wrap; }
.pagehead .lead-sub { color: var(--ss-muted); margin-top: 5px; max-width: 58ch; }
.backlink { display: inline-block; color: var(--ss-muted); font-size: .85rem; text-decoration: none; margin-bottom: 4px; }
.backlink:hover { color: var(--ss-brand); }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 28px 0 10px; }

/* ---- pastile de status ---- */
.pill { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 2.5px 10px; font-size: .75rem; font-weight: 600; white-space: nowrap; }
.pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .75; }
.pill-plain::before { display: none; }
.pill-ok { background: var(--ss-ok-bg); color: var(--ss-ok-fg); }
.pill-warn { background: var(--ss-warn-bg); color: var(--ss-warn-fg); }
.pill-bad { background: var(--ss-bad-bg); color: var(--ss-bad-fg); }
.pill-info { background: var(--ss-info-bg); color: var(--ss-info-fg); }
.pill-neutral { background: var(--ss-neutral-bg); color: var(--ss-neutral-fg); }

/* ---- statistici ---- */
.statgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 22px; }
.stat { padding: 14px 18px; }
.stat .v { font-family: var(--ss-serif); font-size: 1.55rem; line-height: 1.2; font-variant-numeric: tabular-nums; }
.stat .l { font-size: .72rem; color: var(--ss-muted); letter-spacing: .06em; text-transform: uppercase; margin-top: 3px; }

/* ---- carduri de retreat ---- */
.retreat-card { display: grid; grid-template-columns: 86px 1fr auto; gap: 20px; align-items: center; padding: 18px 22px; color: inherit; text-decoration: none; }
a.retreat-card:hover { border-color: var(--ss-brand); }
.retreat-card + .retreat-card { margin-top: 12px; }
.retreat-card.is-past { opacity: .72; }
.datebox { text-align: center; border-right: 1px solid var(--ss-line); padding-right: 20px; font-variant-numeric: tabular-nums; }
.datebox .mo { font-size: .68rem; letter-spacing: .14em; color: var(--ss-brand); font-weight: 700; }
.datebox .dd { font-family: var(--ss-serif); font-size: 1.45rem; line-height: 1.25; }
.datebox .yy { font-size: .75rem; color: var(--ss-muted); }
.retreat-card h3 { margin-bottom: 2px; }
.retreat-card .meta { color: var(--ss-muted); font-size: .85rem; display: flex; gap: 14px; flex-wrap: wrap; }
.retreat-right { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.cap { min-width: 170px; }
.capbar { height: 6px; border-radius: 4px; background: var(--ss-neutral-bg); overflow: hidden; }
.capbar i { display: block; height: 100%; background: var(--ss-brand); border-radius: 4px; }
.cap .cnum { font-size: .78rem; color: var(--ss-muted); margin-top: 5px; }

/* ---- tabelele de participanți: coloane identice între liste ---- */
.ptable { table-layout: fixed; min-width: 900px; }
.ptable th:nth-child(2) { width: 118px; }
.ptable th:nth-child(3) { width: 178px; }
.ptable th:nth-child(4) { width: 150px; }
.ptable th:nth-child(5) { width: 300px; }
.ptable td.actions { white-space: nowrap; }
.ptable td.actions form { display: inline-block; }
.ptable .pname { color: inherit; font-weight: 600; text-decoration: none; }
.ptable .pname:hover { color: var(--ss-brand); text-decoration: underline; }
.ordnum { display: inline-block; min-width: 2.2em; color: var(--ss-muted); font-size: .8rem; font-variant-numeric: tabular-nums; }
tr.freeslot td { color: var(--ss-muted); }
.slotlabel { display: inline-block; border: 1px dashed var(--ss-line); border-radius: 999px; padding: 1.5px 12px; font-size: .75rem; color: var(--ss-muted); }
.pay-select { width: auto; display: inline-block; font-size: .78rem; padding-top: .15rem; padding-bottom: .15rem; }
tr.rowlink { cursor: pointer; }

.kv { display: grid; grid-template-columns: 130px 1fr; gap: 7px 14px; font-size: .9rem; margin: 0; }
.kv dt { color: var(--ss-muted); font-weight: 400; }
.kv dd { margin: 0; }

@media (max-width: 900px) {
  .sidebar { width: 100%; height: auto; position: static; flex-direction: row; align-items: center; padding: 10px 14px; gap: 10px; flex-wrap: wrap; }
  body.has-sidebar { flex-direction: column; }
  .logo { padding: 0; }
  .sidenav { flex-direction: row; }
  .whoami { border: 0; padding: 0; }
  .whoami .small, .whoami .role-tag, .whoami .fw-semibold { display: none; }
  .whoami .mt-2 { margin-top: 0 !important; }
  .main { padding: 22px 16px 60px; }
  .retreat-card { grid-template-columns: 70px 1fr; }
  .retreat-right { align-items: flex-start; grid-column: 2; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }