/* K.OPS visual identity: ember, steel and kitchen-warm light. */
:root {
  --ink: #222321;
  --muted: #777a76;
  --line: #e6e2da;
  --canvas: #f3f1eb;
  --green: #267854;
  --soft: #edf4ef;
  --orange: #f36c36;
  --red: #be6255;
  --blue: #617fb2;
  --brand-charcoal: #111214;
  --brand-orange: #ff6938;
}

/* Public landing page */
body.landing-mode { background:#0b0c0e; color:#f8f7f4; }
body.landing-mode .landing-wrap {
  max-width:none; min-height:100vh; padding:0 max(5vw,32px) 36px; overflow:hidden;
  background:radial-gradient(ellipse at 77% 38%,#472010 0,transparent 34%),
    radial-gradient(ellipse at 18% 55%,#27130c 0,transparent 28%),
    linear-gradient(145deg,#0b0c0e 0%,#151414 54%,#090a0b 100%);
  position:relative; isolation:isolate;
}
body.landing-mode .landing-wrap:before {
  content:""; position:absolute; z-index:-1; inset:0; pointer-events:none; opacity:.9;
  background:linear-gradient(157deg,transparent 0 25%,#ff5b27 25.1%,#ffb075 25.25%,transparent 25.5% 53%,#9d351b 53.2%,#ff6a31 53.35%,transparent 53.65%),
    linear-gradient(168deg,transparent 0 73%,#ff692e 73.15%,#ff9a54 73.3%,transparent 73.6%);
  mask-image:linear-gradient(90deg,transparent,#000 30%,#000 100%);
}
.landing-nav { height:82px; border-color:#ffffff1b; position:relative; z-index:2; }
.landing-brand { color:#fff; font-size:20px; letter-spacing:-.6px; }
.landing-brand .brand-icon { background:var(--brand-orange); color:#111; width:40px; height:40px; border-radius:10px; box-shadow:0 0 28px #ff693842; }
.landing-brand .brand-icon span { color:#171717; }
.landing-brand .brand-light { color:#ff7547; font-weight:800; }
.landing-nav-right span { color:#c0bdb8; font-size:11px; }
.login-button { background:#ffffff0b; border:1px solid #ffffff35; color:#fff; border-radius:5px; padding:10px 16px; transition:.2s; }
.login-button:hover { border-color:var(--brand-orange); color:#ff9b70; }
.hero { min-height:560px; padding:55px 0 52px; gap:4vw; grid-template-columns:1fr .95fr; }
.hero-copy { max-width:650px; }
.hero-kicker { background:#ff69381b; border:1px solid #ff69384d; color:#ff956d; border-radius:3px; padding:8px 12px; letter-spacing:1.3px; font-size:10px; }
.hero-kicker span { background:#ff713d; box-shadow:0 0 12px #ff713d; }
.hero h1 { color:#fbfaf8; font:800 clamp(58px,7vw,96px)/.9 'Barlow Condensed',Manrope,sans-serif; letter-spacing:-1px; text-transform:uppercase; margin:24px 0 19px; max-width:680px; }
.hero h1 em { color:var(--brand-orange); font-style:normal; text-shadow:0 0 35px #f36c3633; }
.hero-copy>p { color:#b7b4af; max-width:510px; font-size:15px; line-height:1.7; }
.hero-actions { margin-top:28px; gap:13px; }
.hero-actions .primary, .hero-actions .secondary { padding:14px 20px; font-size:12px; border-radius:4px; }
.hero-actions .primary { background:linear-gradient(135deg,#ff8149,#f25427); box-shadow:0 8px 28px #f054273d; color:#151311; font-weight:800; }
.hero-actions .primary:hover { filter:brightness(1.1); transform:translateY(-2px); }
.hero-actions .secondary { background:#ffffff0b; border:1px solid #ffffff38; color:#f7f5f2; }
.hero-note { color:#8b8985; font-size:10px; }
.hero-art { min-height:430px; }
.orbit { width:min(34vw,410px); height:min(34vw,410px); border:1px solid #ff713a4a; box-shadow:0 0 70px #ff64221a,inset 0 0 80px #ff64220b; }
.orbit:before,.orbit:after { border-color:#ffffff18; }
.orbit:before { inset:32px; }.orbit:after { inset:78px; }
.hub { width:142px;height:142px;border-radius:25px;background:linear-gradient(145deg,#ff8151,#ee512a);color:#171311;box-shadow:0 16px 55px #fa532c55,0 0 0 8px #ff693817;font-size:16px; }
.hub .brand-icon { color:#111;background:transparent;font-size:36px; }.hub .brand-icon span { color:#111; }
.hub small { color:#412014; font-size:10px; }
.orbit-node { background:#171819ed; border-color:#ffffff20; color:#f8f5f1; box-shadow:0 12px 35px #0008; min-width:145px; padding:12px; }
.orbit-node b { font-size:10px; }.orbit-node small { color:#a7a39e; font-size:9px; }
.orbit-node .node-ico { background:#ff69381c;color:#ff8b61; }
.landing-proof { border-color:#ffffff1b; color:#bcb8b1; padding:17px 0; gap:clamp(18px,4vw,52px); font-size:10px; }
.landing-proof b { color:#ff7547; font-size:15px; }
.account-section { padding:44px 0 0; }
.section-heading h2 { color:#f9f7f3; font:800 35px/1 'Barlow Condensed',Manrope,sans-serif; text-transform:uppercase; letter-spacing:.4px; }
.section-heading p { color:#aaa7a2; font-size:11px; }
.account-cards { max-width:1080px; gap:15px; }
.account-card { background:linear-gradient(145deg,#1b1c1d,#141516); border-color:#ffffff20; border-radius:7px; padding:20px; box-shadow:0 14px 34px #0004; transition:transform .2s,border-color .2s,box-shadow .2s; }
.account-card:hover { transform:translateY(-4px); border-color:#ff754766; box-shadow:0 18px 40px #0007,0 0 24px #ff69380d; }
.account-icon,.account-icon.orange,.account-icon.blue { background:#ff69381d; color:#ff8759; border-radius:7px; }
.account-card h3 { color:#f7f4ef; font-size:13px; }
.account-card p { color:#aaa7a2; font-size:10px; }
.account-card button,.landing-footer button { color:#ff865e; }
.landing-footer { color:#8e8a85; border-top:1px solid #ffffff1a; padding-top:17px; max-width:1080px; }
.landing-screen.account { margin:48px auto; }
.back-link { color:#ff865e; }
.auth-card { color:#f8f5f0; background:#191a1b; border-color:#ffffff22; box-shadow:0 24px 80px #0008; }
.auth-card h1 { color:#fff; }
.auth-card>p,.auth-foot,.landing-screen.account>p { color:#aaa7a2!important; }
.auth-type { color:#ff956e;background:#ff69381b; }
.auth-foot button { color:#ff865e; }

/* Restaurant and supplier workspace */
body:not(.landing-mode) { background:#f2f0ea; color:#232321; }
body:not(.landing-mode) .sidebar { background:#151617; color:#f4f2ed; border-right:1px solid #292a2a; box-shadow:5px 0 24px #11110f0a; }
body:not(.landing-mode) .brand { color:#fff; }
body:not(.landing-mode) .brand-icon { background:var(--brand-orange); color:#151413; box-shadow:0 0 20px #ff693820; }
body:not(.landing-mode) .brand-icon span { color:#151413; }
body:not(.landing-mode) .brand-light { color:#ff8357; }
body:not(.landing-mode) .venue-switch { color:#f1eee8;background:#202122;border-color:#343535; }
body:not(.landing-mode) .venue-mark { color:#151413;background:#ff7547; }
body:not(.landing-mode) .venue-switch small,body:not(.landing-mode) .profile small { color:#a09d97; }
body:not(.landing-mode) .nav-label { color:#8b8881; }
body:not(.landing-mode) .nav-item { color:#c0bdb7; }
body:not(.landing-mode) .nav-item.active { background:#2a2b2b;color:#ff875d;box-shadow:inset 3px 0 #ff6938; }
body:not(.landing-mode) .nav-item.active .nav-ico { color:#ff875d; }
body:not(.landing-mode) .nav-ico,body:not(.landing-mode) .count { color:#9c9992; }
body:not(.landing-mode) .sidebar nav.restaurant-nav { background:linear-gradient(180deg,#1b1c1d,#151617 68%,#201915); border:1px solid #ffffff0d; box-shadow:inset 0 1px #ffffff08; scrollbar-color:#555 transparent; }
body:not(.landing-mode) .sidebar .restaurant-nav>.nav-item[data-view="dashboard"] { background:#ffffff0d;color:#f5f2ec;border-color:#ffffff18;box-shadow:none; }
body:not(.landing-mode) .sidebar .restaurant-nav>.nav-item[data-view="dashboard"] .nav-ico { color:#ff875d; }
body:not(.landing-mode) .sidebar .restaurant-nav .nav-item.nav-subitem { background:#ffffff08;border-color:#ffffff0c;color:#c0bdb7; }
body:not(.landing-mode) .sidebar .restaurant-nav .nav-item.nav-subitem.active { background:#2a2b2b;color:#ff875d; }
body:not(.landing-mode) .sidebar nav.restaurant-nav>button.nav-group-toggle[data-nav-toggle="operation"] { background:linear-gradient(110deg,#ff8149,#f2552b);color:#171412;box-shadow:0 5px 18px #f36c3633; }
body:not(.landing-mode) .sidebar nav.restaurant-nav>button.nav-group-toggle[data-nav-toggle="monitoring"] { background:linear-gradient(110deg,#287c53,#39a26b);color:#fff;box-shadow:0 5px 18px #26785435; }
body:not(.landing-mode) .sidebar-bottom .profile { border-color:#333433; }
body:not(.landing-mode) .avatar { background:#ff75472b;color:#ff9a74; }
body:not(.landing-mode) .settings-shortcut { color:#d1cdc5; }
body:not(.landing-mode) .main { color:#242422; }
body:not(.landing-mode) .topbar { border-color:#e2ded5; }
body:not(.landing-mode) .crumb b { color:#292a27; }
body:not(.landing-mode) .logout-btn { border-color:#e5ded4; }
body:not(.landing-mode) .view h1 { color:#20211f; }
body:not(.landing-mode) .eyebrow { color:#c9572d; }
body:not(.landing-mode) .primary { background:linear-gradient(135deg,#ff8048,#f15a2e);color:#171412;box-shadow:0 3px 10px #f36c3623; }
body:not(.landing-mode) .primary:hover { background:linear-gradient(135deg,#ff905c,#fa693d); }
body:not(.landing-mode) .secondary { background:#f7e8df;color:#9b4525; }
body:not(.landing-mode) .link-btn,body:not(.landing-mode) .plan button { color:#b6502b; }
body:not(.landing-mode) .stat,body:not(.landing-mode) .card { border-color:#e5e0d7;box-shadow:0 5px 18px #30261808; }
body:not(.landing-mode) .stat-ico,body:not(.landing-mode) .record-icon { background:#fff0e8;color:#cb5b30; }
body:not(.landing-mode) .stat-num { color:#252421; }
body:not(.landing-mode) .banner { background:#fff4eb;border-color:#f4d7c6;color:#77533e; }
body:not(.landing-mode) .banner b { color:#a74725; }
body:not(.landing-mode) .badge { background:#edf4ef;color:#39744f; }
body:not(.landing-mode) footer { color:#8b8881; }
body:not(.landing-mode) .toast { background:#202122;border-left:3px solid #ff6938; }

@media(max-width:800px) {
  .hero { min-height:auto; }
  .hero-art { min-height:340px; }
  .orbit { width:300px;height:300px; }
}
@media(max-width:480px) {
  body.landing-mode .landing-wrap { padding-left:18px;padding-right:18px; }
  .hero h1 { font-size:54px; }
  .hero-art { min-height:275px; }
  .orbit { width:225px;height:225px; }
  .hub { width:100px;height:100px;font-size:12px; }
  .hub .brand-icon { font-size:28px;height:31px; }
  .orbit-node { min-width:106px;padding:8px; }
  .orbit-node small { font-size:7px; }
}
