/* QRJ Modern v2 — shared visual system for public, customer and staff screens */
:root{
  --qrj-bg:#f6f8fb;--qrj-surface:#fff;--qrj-soft:#eef3f8;--qrj-text:#14202b;
  --qrj-muted:#657180;--qrj-line:#dfe5ec;--qrj-primary:#176b5b;--qrj-primary-2:#0e5145;
  --qrj-accent:#d9f36a;--qrj-danger:#d84b5b;--qrj-warning:#f5b942;--qrj-info:#4f7cff;
  --qrj-radius:18px;--qrj-radius-sm:12px;--qrj-shadow:0 14px 38px rgba(20,32,43,.08);
  --qrj-font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
html[data-theme="dark"]{
  --qrj-bg:#101715;--qrj-surface:#17211e;--qrj-soft:#202c28;--qrj-text:#f2f6f4;
  --qrj-muted:#a3b0aa;--qrj-line:#2d3b36;--qrj-primary:#72d5bd;--qrj-primary-2:#9be5d3;
  --qrj-accent:#d9f36a;--qrj-shadow:0 18px 45px rgba(0,0,0,.25)
}
html{color-scheme:light;scroll-behavior:smooth}html[data-theme="dark"]{color-scheme:dark}
body{font-family:var(--qrj-font)!important;background:var(--qrj-bg)!important;color:var(--qrj-text)!important;line-height:1.55;-webkit-font-smoothing:antialiased}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(circle at 90% 0,rgba(217,243,106,.18),transparent 25rem),radial-gradient(circle at 0 35%,rgba(23,107,91,.08),transparent 28rem)}
*,*:before,*:after{box-sizing:border-box}a{color:inherit}img{max-width:100%;height:auto}
:focus-visible{outline:3px solid color-mix(in srgb,var(--qrj-primary) 38%,transparent);outline-offset:3px}

/* shared header */
.qrj-site-header{position:sticky!important;top:0!important;z-index:1000!important;background:color-mix(in srgb,var(--qrj-bg) 88%,transparent)!important;border-bottom:1px solid color-mix(in srgb,var(--qrj-line) 75%,transparent)!important;backdrop-filter:blur(18px)!important;box-shadow:none!important}
.qrj-header-container{width:min(1180px,calc(100% - 32px))!important;min-height:72px!important;margin:auto!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:24px!important}
.qrj-brand{display:flex!important;align-items:center!important;gap:11px!important;text-decoration:none!important;color:var(--qrj-text)!important}.qrj-brand-mark{width:40px!important;height:40px!important;display:grid!important;place-items:center!important;border-radius:13px!important;background:var(--qrj-text)!important;color:var(--qrj-accent)!important;font-size:12px!important;font-weight:900!important;letter-spacing:-.3px!important;box-shadow:none!important}.qrj-brand-name{display:grid!important;line-height:1.08!important}.qrj-brand-name strong{font-size:16px!important;letter-spacing:-.35px!important}.qrj-brand-name span{font-size:10px!important;margin-top:4px!important;color:var(--qrj-muted)!important;letter-spacing:.1px!important}
.qrj-nav{display:flex!important;align-items:center!important;gap:5px!important}.qrj-nav a,.qrj-btn{min-height:40px!important;padding:0 13px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border:0!important;border-radius:11px!important;background:transparent!important;color:var(--qrj-muted)!important;font-size:13px!important;font-weight:700!important;text-decoration:none!important;box-shadow:none!important}.qrj-nav a:hover{background:var(--qrj-soft)!important;color:var(--qrj-text)!important;transform:none!important}.qrj-nav .qrj-btn-primary{background:var(--qrj-text)!important;color:var(--qrj-surface)!important;padding-inline:17px!important}.qrj-user-pill{background:var(--qrj-soft)!important;color:var(--qrj-text)!important}.qrj-theme-toggle{width:40px;height:40px;border:1px solid var(--qrj-line);border-radius:12px;background:var(--qrj-surface);color:var(--qrj-text);display:grid;place-items:center;font-size:16px}.qrj-mobile-menu-btn{border:1px solid var(--qrj-line)!important;background:var(--qrj-surface)!important;color:var(--qrj-text)!important;border-radius:12px!important;width:42px!important;height:42px!important}

/* consistent surfaces */
.container,.page-container,.dashboard-container,.admin-container,.content-wrapper,.main-container,.form-container{width:min(1120px,calc(100% - 32px))!important;margin-left:auto!important;margin-right:auto!important}
.card,.panel,.section-card,.dashboard-card,.queue-card,.analytics-card,.settings-card,.form-card,.login-box,.register-container,.auth-card,.success-box,.error-box,.info-box,.modal-content,.admin-section,section[class*="card"]{background:var(--qrj-surface)!important;color:var(--qrj-text)!important;border:1px solid var(--qrj-line)!important;border-radius:var(--qrj-radius)!important;box-shadow:var(--qrj-shadow)!important}
h1,h2,h3,h4,h5,h6{color:var(--qrj-text)!important;letter-spacing:-.025em!important;line-height:1.15!important}p,.subtitle,.description,.helper-text,.muted,small{color:var(--qrj-muted)}
hr{border:0;border-top:1px solid var(--qrj-line)}

/* forms */
input,select,textarea{width:100%;min-height:46px;border:1px solid var(--qrj-line)!important;border-radius:var(--qrj-radius-sm)!important;background:var(--qrj-surface)!important;color:var(--qrj-text)!important;padding:11px 13px!important;box-shadow:none!important;transition:border-color .18s,box-shadow .18s}textarea{min-height:104px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:var(--qrj-primary)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--qrj-primary) 12%,transparent)!important;outline:0}label{color:var(--qrj-text);font-weight:700;font-size:13px}input[type="checkbox"],input[type="radio"]{width:18px!important;min-height:18px!important;accent-color:var(--qrj-primary);padding:0!important}
button,.button,.btn,input[type="submit"],a.button{min-height:44px;border:0;border-radius:12px;padding:10px 17px;font-weight:750;transition:transform .18s,background .18s,box-shadow .18s}button:hover,.button:hover,.btn:hover,input[type="submit"]:hover{transform:translateY(-1px)}button[type="submit"],input[type="submit"],.btn-primary,.primary-button,.create-btn,.join-button,.call-next-btn{background:var(--qrj-primary)!important;color:#fff!important;box-shadow:0 8px 20px color-mix(in srgb,var(--qrj-primary) 20%,transparent)!important}.btn-secondary,.secondary-button{background:var(--qrj-soft)!important;color:var(--qrj-text)!important;border:1px solid var(--qrj-line)!important}.btn-danger,.danger-button,.delete-btn{background:color-mix(in srgb,var(--qrj-danger) 10%,var(--qrj-surface))!important;color:var(--qrj-danger)!important}

/* data, status and queue controls */
table{width:100%;border-collapse:separate!important;border-spacing:0!important;background:var(--qrj-surface)!important;border:1px solid var(--qrj-line)!important;border-radius:15px!important;overflow:hidden!important}th{background:var(--qrj-soft)!important;color:var(--qrj-muted)!important;text-transform:uppercase;font-size:10px!important;letter-spacing:.08em!important;font-weight:800!important}th,td{padding:13px 14px!important;border-bottom:1px solid var(--qrj-line)!important;text-align:left}tr:last-child td{border-bottom:0!important}tr:hover td{background:color-mix(in srgb,var(--qrj-soft) 60%,transparent)}
.status,.badge,.pill,[class*="status-"]{display:inline-flex;align-items:center;gap:6px;border-radius:99px!important;padding:6px 10px!important;font-size:11px!important;font-weight:800!important}.status-open,.open,.success,.badge-success{background:color-mix(in srgb,#43a047 13%,var(--qrj-surface))!important;color:#27813b!important}.status-paused,.warning,.badge-warning{background:color-mix(in srgb,var(--qrj-warning) 15%,var(--qrj-surface))!important;color:#94680b!important}.status-closed,.error,.badge-danger{background:color-mix(in srgb,var(--qrj-danger) 12%,var(--qrj-surface))!important;color:var(--qrj-danger)!important}
.queue-number,.token-number,.now-serving,.current-number{font-weight:900!important;letter-spacing:-.05em!important;color:var(--qrj-primary)!important}.qr-code,.qr-container img{padding:12px!important;background:#fff!important;border:1px solid var(--qrj-line)!important;border-radius:16px!important}

/* marketing page polish without changing its content */
.hero,.hero-section{background:transparent!important}.hero h1,.hero-title{font-weight:850!important;letter-spacing:-.055em!important}.hero-card,.demo-card{border:1px solid var(--qrj-line)!important;background:var(--qrj-surface)!important;border-radius:24px!important;box-shadow:var(--qrj-shadow)!important}.feature-card,.step-card,.plan-card,.pricing-card{border:1px solid var(--qrj-line)!important;background:var(--qrj-surface)!important;border-radius:18px!important;box-shadow:none!important}.feature-card:hover,.step-card:hover,.plan-card:hover{transform:translateY(-3px);box-shadow:var(--qrj-shadow)!important}.site-header-fallback{background:color-mix(in srgb,var(--qrj-bg) 90%,transparent)!important;border-color:var(--qrj-line)!important}.brand-mark{background:var(--qrj-text)!important;color:var(--qrj-accent)!important;box-shadow:none!important}.btn-primary{background:var(--qrj-text)!important}.btn-secondary{background:var(--qrj-surface)!important}.trust-item,.metric-card{background:var(--qrj-surface)!important;border-color:var(--qrj-line)!important}

/* utility added to old pages */
.qrj-page-shell{width:min(1120px,calc(100% - 32px));margin:36px auto 80px}.qrj-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.qrj-page-head h1{margin:0}.qrj-page-head p{margin:7px 0 0}.qrj-empty{padding:38px;text-align:center;border:1px dashed var(--qrj-line);border-radius:16px;background:var(--qrj-surface)}
.qrj-mobile-dock{display:none}.qrj-theme-fab{position:fixed;right:18px;bottom:18px;z-index:950;width:44px;height:44px;border-radius:14px;border:1px solid var(--qrj-line);background:var(--qrj-surface);color:var(--qrj-text);box-shadow:var(--qrj-shadow);padding:0}

@media(max-width:820px){
  .qrj-header-container{min-height:64px!important}.qrj-brand-name span{display:none!important}.qrj-nav{display:none!important;position:absolute!important;top:64px!important;left:12px!important;right:12px!important;background:var(--qrj-surface)!important;border:1px solid var(--qrj-line)!important;border-radius:16px!important;padding:10px!important;box-shadow:var(--qrj-shadow)!important;flex-direction:column!important;align-items:stretch!important}.qrj-site-header.menu-open .qrj-nav,.qrj-nav.active{display:flex!important}.qrj-nav a{justify-content:flex-start!important;width:100%!important}.qrj-mobile-menu-btn{display:block!important}
  .container,.page-container,.dashboard-container,.admin-container,.content-wrapper,.main-container,.form-container{width:min(100% - 20px,1120px)!important}.grid,.dashboard-grid,.form-grid,.analytics-grid,.cards-grid{grid-template-columns:1fr!important}.qrj-page-head{display:block}.qrj-page-head>*+*{margin-top:14px}
  table{display:block;overflow-x:auto}.actions,.button-group,.form-actions{flex-wrap:wrap}.actions>*{flex:1 1 auto}
  .qrj-mobile-dock{display:grid;position:fixed;left:10px;right:10px;bottom:10px;z-index:900;grid-template-columns:repeat(3,1fr);padding:7px;border:1px solid var(--qrj-line);border-radius:17px;background:color-mix(in srgb,var(--qrj-surface) 93%,transparent);box-shadow:var(--qrj-shadow);backdrop-filter:blur(16px)}.qrj-mobile-dock a{display:grid;place-items:center;gap:2px;min-height:48px;border-radius:12px;text-decoration:none;color:var(--qrj-muted);font-size:10px;font-weight:800}.qrj-mobile-dock a span{font-size:18px}.qrj-mobile-dock a:hover{background:var(--qrj-soft);color:var(--qrj-text)}.qrj-theme-fab{bottom:78px}body{padding-bottom:78px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

