/* static/status-halden.css — pagina publică de status (status.html) în stilul Halden deschis (25.10.2026).
   Se încarcă înaintea <style>-ului din pagină, de aceea selectorii încep cu `html body`.
   Antetul = bara Halden cu marca; titlul = cardul petrol cu grilă (.h-adanc, ca pe login);
   cardurile = albe, cu linie fină; butoanele principale = petrol plin, fără gradient. */

/* antetul */
html body .header { background: var(--h-topbar); border-bottom: 1px solid var(--h-hair);
  -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); }
html body .header-content { height: 64px; padding: 0 24px; }
html body .header-logo a { text-decoration: none; }
html body .nav-links a.btn-login { background: var(--h-accent); color: var(--h-on-accent); border-radius: var(--h-r-sm);
  box-shadow: none; font-weight: 700; padding: 10px 16px; }
html body .nav-links a.btn-login:hover { background: var(--h-accent-hover); }

/* titlul: cardul petrol cu grilă */
html body .hero { background: none; border: 0; padding: 18px 22px 0; overflow: visible; }
html body .hero::before { display: none; }
html body .hero .status-header.h-adanc { max-width: 1120px; margin: 0 auto; padding: 34px 32px 36px; border-radius: var(--h-r-lg); text-align: left; }
/* aceeași lățime cu cardurile de dedesubt: căutarea (500px − 2×22px) și rezultatul (1120px − 2×26px) */
html body .hero:not(.compact) .status-header.h-adanc { max-width: 456px; padding: 28px 26px 30px; }
html body .hero:not(.compact) .status-header.h-adanc h1 { font-size: 30px; }
html body .hero.compact .status-header.h-adanc { max-width: 1068px; padding: 22px 28px; }
html body .status-header.h-adanc .h-sprinceana { color: #c5e0e1; }
html body .status-header.h-adanc h1 { color: #f4fafa; font-size: clamp(26px, 3.4vw, 38px); font-weight: 800; letter-spacing: -.04em; line-height: 1.05; margin-bottom: 8px; }
html body .hero.compact .status-header.h-adanc h1 { font-size: 24px; margin-bottom: 0; }
html body .status-header.h-adanc p { color: #c5e0e1; font-size: 15px; }

/* containerul și cardurile */
html body .status-container { background: transparent; border: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; margin: 22px auto 36px; }
html body :is(.status-search, .status-details, .contact-section, .chat-section, .recenzie-card) {
  background: var(--h-card) !important; border: 1px solid var(--h-hair) !important; border-radius: var(--h-r-lg) !important;
  box-shadow: var(--h-shadow) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
html body .status-search { padding: 22px; }
html body .instruction { color: var(--h-muted); }
html body :is(.status-search input, .chat-section textarea) { background: var(--h-card) !important; border: 1px solid var(--h-hair-strong) !important;
  border-radius: var(--h-r-sm) !important; color: var(--h-ink) !important; box-shadow: none !important; }
html body :is(.status-search input, .chat-section textarea):focus { border-color: var(--h-a-600) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--h-a-600) 18%, transparent) !important; outline: none; }
html body :is(.status-search button[type=submit], .chat-section .contact-btn) { background: var(--h-accent) !important; color: var(--h-on-accent) !important;
  border-radius: var(--h-r-sm) !important; box-shadow: none !important; font-weight: 700; }
html body :is(.status-search button[type=submit], .chat-section .contact-btn):hover { background: var(--h-accent-hover) !important; }
html body :is(.qr-scan-btn, .search-toggle-btn) { background: var(--h-card) !important; color: var(--h-ink) !important; border: 1px solid var(--h-hair-strong) !important;
  border-radius: var(--h-r-sm) !important; box-shadow: var(--h-shadow) !important; }
html body :is(.qr-scan-btn, .search-toggle-btn):hover { background: var(--h-panel) !important; }
html body .repair-info p { border-bottom-color: var(--h-hair); }
html body .repair-info span { color: var(--h-ink); }

/* subsolul */
html body .footer { background: var(--h-card); border-top: 1px solid var(--h-hair); color: var(--h-faint); }
html body .footer::before, html body .footer::after { display: none; }

@media (max-width: 600px) {
  html body .hero { padding: 12px 12px 0; }
  html body .hero .status-header.h-adanc { padding: 24px 18px; border-radius: var(--h-r-md); }
  html body .header-content { padding: 0 14px; }
}