/* =========================================================================
   PFAPlus — Design System (inspirat din Cal.com)
   Canvas alb, CTA negru, near-monochrome. Inter peste tot.
   Vezi docs/psplus-design-system.md pentru reguli complete.
   ========================================================================= */

:root{
  /* Brand & action */
  --primary:#111111; --primary-active:#242424; --primary-disabled:#e5e7eb;
  --brand-accent:#3b82f6;

  /* Text */
  --ink:#111111; --body:#374151; --muted:#6b7280; --muted-soft:#898989;
  --on-primary:#ffffff; --on-dark:#ffffff; --on-dark-soft:#a1a1aa;

  /* Surfaces */
  --canvas:#ffffff; --surface-soft:#f8f9fa; --surface-card:#f5f5f5;
  --surface-strong:#e5e7eb; --surface-dark:#101010; --surface-dark-elevated:#1a1a1a;

  /* Lines */
  --hairline:#e5e7eb; --hairline-soft:#f3f4f6;

  /* Semantic */
  --success:#10b981; --warning:#f59e0b; --error:#ef4444;
  --badge-orange:#fb923c; --badge-pink:#ec4899; --badge-violet:#8b5cf6; --badge-emerald:#34d399;

  /* Radius */
  --r-xs:4px; --r-sm:6px; --r-md:8px; --r-lg:12px; --r-xl:16px; --r-pill:9999px;

  /* Spacing (baza 4px) */
  --s-xxs:4px; --s-xs:8px; --s-sm:12px; --s-md:16px; --s-lg:24px; --s-xl:32px; --s-xxl:48px; --s-section:96px;

  /* Shadow */
  --shadow-sm:0 1px 2px rgba(0,0,0,.05); --shadow-md:0 4px 12px rgba(0,0,0,.08);

  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:16px;line-height:1.5;background:var(--canvas);color:var(--body);-webkit-font-smoothing:antialiased}

/* --- Tipografie: titluri = Inter 600 cu letter-spacing negativ (substitut Cal Sans) --- */
h1,h2,h3{color:var(--ink);font-weight:600;margin:0 0 var(--s-md)}
h1{font-size:48px;line-height:1.1;letter-spacing:-1.5px}
h2{font-size:32px;line-height:1.15;letter-spacing:-1px}
h3{font-size:22px;line-height:1.3;letter-spacing:-.3px}
h4{color:var(--ink);font-weight:600;font-size:18px;line-height:1.4;margin:0 0 var(--s-sm)}
p{margin:0 0 var(--s-md)}
a{color:var(--ink)}
small,.caption{font-size:13px;font-weight:500;color:var(--muted-soft)}
code,pre{font-family:var(--font-mono);font-size:14px}

/* --- Layout aplicatie --- */
.app{display:flex;min-height:100vh}
.sidebar{width:248px;background:var(--canvas);border-right:1px solid var(--hairline);padding:var(--s-md)}
.sidebar .brand{font-weight:600;color:var(--ink);font-size:20px;letter-spacing:-.5px;margin-bottom:var(--s-lg);padding:0 var(--s-xs)}
.sidebar .sec{margin-bottom:var(--s-md)}
.sidebar .sec-title{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:0 0 var(--s-xs);padding:0 var(--s-xs)}
.sidebar a{display:block;padding:8px 10px;border-radius:var(--r-md);color:var(--body);text-decoration:none;font-size:14px;font-weight:500}
.sidebar a:hover,.sidebar a.active{background:var(--surface-soft);color:var(--ink)}
.main{flex:1;display:flex;flex-direction:column;min-width:0}
.topbar{display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 var(--s-lg);background:var(--canvas);border-bottom:1px solid var(--hairline)}
.content{padding:var(--s-lg);max-width:1200px;width:100%}

/* --- Butoane --- */
.btn{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 20px;border-radius:var(--r-md);background:var(--primary);color:var(--on-primary);border:1px solid var(--primary);font:inherit;font-size:14px;font-weight:600;line-height:1;text-decoration:none;cursor:pointer;transition:background .12s ease}
.btn:hover{background:var(--primary-active);border-color:var(--primary-active)}
.btn:active{background:var(--primary-active)}
.btn[disabled],.btn.disabled{background:var(--primary-disabled);border-color:var(--primary-disabled);color:var(--muted);cursor:not-allowed}
.btn.secondary{background:var(--canvas);color:var(--ink);border:1px solid var(--hairline)}
.btn.secondary:hover{background:var(--surface-soft);border-color:var(--surface-strong)}
.btn.sm{height:32px;padding:0 14px;border-radius:var(--r-sm)}

/* --- Carduri --- */
.card{background:var(--canvas);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:var(--s-xl);margin-bottom:var(--s-md)}
.card.soft{background:var(--surface-card);border-color:transparent}
.card.dark{background:var(--surface-dark);border-color:transparent;color:var(--on-dark-soft)}
.card.dark h1,.card.dark h2,.card.dark h3,.card.dark h4{color:var(--on-dark)}

/* --- Flash / alerte --- */
.flash{padding:12px 16px;border-radius:var(--r-md);margin-bottom:var(--s-md);font-size:14px;border:1px solid transparent}
.flash.success{background:#ecfdf5;color:#065f46;border-color:#a7f3d0}
.flash.warning{background:#fffbeb;color:#92400e;border-color:#fde68a}
.flash.danger{background:#fef2f2;color:#991b1b;border-color:#fecaca}

/* --- Formulare --- */
label{display:block;margin:var(--s-sm) 0 var(--s-xxs);font-weight:600;font-size:14px;color:var(--ink)}
input,select,textarea{width:100%;height:40px;padding:0 14px;border:1px solid var(--hairline);border-radius:var(--r-md);font:inherit;font-size:14px;color:var(--ink);background:var(--canvas)}
textarea{height:auto;padding:10px 14px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
input[type=checkbox]{width:auto;height:auto}

/* --- Tabele --- */
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-weight:600;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--hairline)}
td{padding:12px;border-bottom:1px solid var(--hairline-soft)}

/* --- Badge / pill --- */
.badge{display:inline-block;padding:4px 12px;border-radius:var(--r-pill);background:var(--surface-card);color:var(--ink);font-size:13px;font-weight:500}
.badge.green{background:#ecfdf5;color:#065f46}
.badge.gray{background:var(--surface-card);color:var(--muted)}

/* --- Utilitare --- */
.muted{color:var(--muted)}
.text-center{text-align:center}
.stack-sm>*+*{margin-top:var(--s-sm)}
.row{display:flex;gap:var(--s-sm);align-items:center}
.spacer{flex:1}

/* --- Footer dark (inchide paginile publice) --- */
.footer-dark{background:var(--surface-dark);color:var(--on-dark-soft);padding:64px var(--s-lg);font-size:14px}
.footer-dark a{color:var(--on-dark-soft);text-decoration:none}
.footer-dark a:hover{color:var(--on-dark)}
.footer-app{padding:var(--s-md) var(--s-lg);color:var(--muted-soft);font-size:13px;border-top:1px solid var(--hairline-soft)}

/* --- Pagini publice (auth/landing) --- */
.public-wrap{max-width:440px;margin:64px auto;padding:0 var(--s-md)}
.public-hero{max-width:720px;margin:96px auto;padding:0 var(--s-md);text-align:center}
.public-hero h1{font-size:64px;line-height:1.05;letter-spacing:-2px}

/* --- Responsive --- */
@media(max-width:768px){
  .app{flex-direction:column}
  .sidebar{width:100%;border-right:0;border-bottom:1px solid var(--hairline)}
  h1{font-size:36px;letter-spacing:-1px}
  .public-hero h1{font-size:40px;letter-spacing:-1.5px}
}
