/* V63 modul: Osnovni izgled, zajedničke komponente i početna pravila. */
:root{
      --bg:#fffaf5;
      --bg2:#f3e9df;
      --panel:#fffefd;
      --panel2:#fff9f2;
      --card:#fffdf9;
      --card2:#f7eee6;
      --text:#2f241f;
      --muted:#6f5a50;
      --faint:#9a8175;
      --line:rgba(70,48,40,.13);
      --red:#b4232a;
      --red2:#7f1117;
      --amber:#c7a46a;
      --green:#3f8f63;
      --blue:#668da5;
      --danger:#b91c1c;
      --soft:#f4e8dc;
      --soft2:#ead8c8;
      --soft3:#dfc6b5;
      --softText:#4c382f;
      --softMuted:#755f53;
      --softBorder:rgba(120,82,64,.24);
      --shadow:0 18px 48px rgba(73,52,43,.10);
      --radius:24px;
      --radius2:18px;
      --font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:var(--font);
      color:var(--text);
      min-height:100vh;
      background:
        radial-gradient(circle at 12% 0%, rgba(155,106,96,.045), transparent 30rem),
        radial-gradient(circle at 90% 15%, rgba(199,164,106,.075), transparent 32rem),
        linear-gradient(135deg,var(--bg),var(--bg2) 64%,#fffdf8);
    }
    button,input,select,textarea{font:inherit}
    button{cursor:pointer;-webkit-tap-highlight-color:transparent}
    a{color:inherit;text-decoration:none}
    .app{max-width:1440px;margin:0 auto;padding:18px}
    .topbar{
      position:sticky;top:0;z-index:80;
      margin:0 -18px 18px;padding:12px 18px;
      background:linear-gradient(180deg,rgba(255,250,244,.97),rgba(255,250,244,.88));
      border-bottom:1px solid var(--line);
      backdrop-filter:blur(18px);
    }
    .topbar-inner{max-width:1440px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:14px}
    .brand{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;width:232px;flex:0 0 auto}
    .brand-logo{
      width:232px;height:64px;border-radius:0;overflow:visible;display:grid;place-items:center;
      background:transparent;padding:0;
      border:0;box-shadow:none;flex:0 0 auto;
    }
    .brand-logo img{width:100%;height:100%;object-fit:contain;display:block;background:transparent;filter:drop-shadow(0 8px 14px rgba(73,52,43,.08))}
    .brand-logo .fallback{font-weight:950;color:#fff;font-size:22px}
    .brand-copy{width:232px;min-width:0;text-align:center}
    .brand-copy h1{margin:0;font-size:17px;line-height:1.05;letter-spacing:.15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text);font-weight:900}
    .brand-copy p{margin:5px 0 0;color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

    .call-wrap{position:relative;display:flex;align-items:center;justify-content:flex-end;margin-left:auto}
    .call-btn{border:1px solid rgba(70,48,40,.16);background:linear-gradient(135deg,var(--red),var(--red2));color:#fffaf5;border-radius:999px;padding:11px 15px;font-weight:950;display:inline-flex;align-items:center;gap:8px;box-shadow:0 12px 24px rgba(155,106,96,.12);white-space:nowrap}
    .call-btn svg{width:18px;height:18px}
    .call-list{position:absolute;top:calc(100% + 10px);right:0;z-index:60;display:grid;gap:8px;width:230px;padding:8px;border:1px solid var(--line);border-radius:22px;background:rgba(255,253,249,.98);box-shadow:0 22px 48px rgba(70,48,40,.14)}
    .call-list[hidden]{display:none}
    .call-list a{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 14px;border:1px solid rgba(70,48,40,.16);border-radius:999px;background:linear-gradient(135deg,var(--red),var(--red2));font-weight:950;color:#fffaf5;text-align:center;box-shadow:0 10px 22px rgba(155,106,96,.10)}
    .call-list a:hover{filter:brightness(.98);transform:translateY(-1px)}
    .tabs{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
    .tab-btn{
      border:1px solid var(--line);background:rgba(112,83,70,.055);color:var(--text);
      padding:11px 14px;border-radius:999px;font-weight:900;display:flex;align-items:center;gap:8px;
    }
    .tab-btn.active{background:linear-gradient(135deg,var(--red),var(--red2));border-color:rgba(70,48,40,.16);box-shadow:0 12px 24px rgba(155,106,96,.12);color:#fffaf5}
    .hero{
      position:relative;overflow:hidden;border-radius:var(--radius);padding:28px;min-height:260px;
      border:1px solid var(--line);box-shadow:var(--shadow);
      background:
        linear-gradient(90deg,rgba(255,250,244,.93),rgba(255,250,244,.70),rgba(255,248,239,.90)),
        radial-gradient(circle at 65% 22%,rgba(216,154,58,.18),transparent 18rem),
        linear-gradient(145deg,#fff6ec,#f7e7d9 56%,#fffdf8);
    }
    .hero:after{
      content:"";position:absolute;inset:auto -10% -42% auto;width:680px;height:420px;opacity:.32;
      background:radial-gradient(circle,rgba(255,255,255,.45),transparent 58%),linear-gradient(135deg,transparent,rgba(155,106,96,.07));
      transform:rotate(-10deg);border-radius:45%;pointer-events:none;
    }
    .pill{display:inline-flex;gap:8px;align-items:center;border:1px solid rgba(199,164,106,.34);background:rgba(199,164,106,.12);color:#7b6246;padding:8px 12px;border-radius:999px;font-size:13px;font-weight:900;letter-spacing:.1px}
    .hero h2{margin:18px 0 10px;font-size:clamp(34px,6vw,72px);line-height:.96;letter-spacing:-2.5px;max-width:900px}
    .hero p{margin:0;color:var(--muted);font-size:clamp(16px,2vw,20px);line-height:1.55;max-width:780px}
    .hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
    .btn{
      border:1px solid var(--line);background:rgba(112,83,70,.055);color:var(--text);border-radius:16px;
      padding:13px 15px;font-weight:950;display:inline-flex;align-items:center;gap:9px;justify-content:center;min-height:48px;
    }
    .btn.primary{background:linear-gradient(135deg,var(--red),var(--red2));border-color:rgba(70,48,40,.16);box-shadow:0 12px 24px rgba(155,106,96,.12);color:#fffaf5}
    .btn.amber{background:linear-gradient(135deg,#fde68a,#f59e0b);border-color:rgba(146,64,14,.20);color:#2f241f}
    .btn.green{background:linear-gradient(135deg,#41df89,#16834b);border-color:rgba(88,49,34,.16);color:#0f2a1b}
    .btn.danger{background:linear-gradient(135deg,#ef4444,#991b1b);border-color:rgba(153,27,27,.22);color:#fffaf5}
    .btn.ghost{background:rgba(112,83,70,.045)}
    .btn:disabled{opacity:.42;cursor:not-allowed;filter:saturate(.6)}
    .layout{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:18px;margin-top:18px;align-items:start}
    .order-area{display:block}
    .panel{background:rgba(255,253,249,.96);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
    .panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(255,247,238,.88),rgba(255,253,249,.66))}
    .panel-head h3{margin:0;font-size:20px;letter-spacing:-.4px}
    .panel-head p{margin:5px 0 0;color:var(--muted);font-size:14px;line-height:1.35}
    .panel-body{padding:18px}
    .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
    .branch-grid{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px;align-items:center}
    .branch-card{
      border:1px solid rgba(70,48,40,.16);background:rgba(112,83,70,.055);border-radius:999px;padding:10px 15px;min-height:44px;
      display:inline-flex;align-items:center;justify-content:center;gap:8px;text-align:center;color:var(--text);width:auto;
      box-shadow:none;
    }
    .branch-card.active{border-color:rgba(70,48,40,.24);background:linear-gradient(135deg,var(--red),var(--red2));box-shadow:0 14px 28px rgba(155,106,96,.16);color:#fffaf5;outline:2px solid rgba(255,250,245,.92);outline-offset:-4px}
    .branch-card strong{font-size:14px;letter-spacing:-.15px;white-space:nowrap}
    .branch-card span{font-size:12px;color:var(--muted);font-weight:800}
    .status-dot{display:inline-flex;align-items:center;gap:6px;color:#1f7348;font-size:12px;font-weight:900}.status-dot:before{content:"";width:8px;height:8px;border-radius:99px;background:var(--green);box-shadow:0 0 0 4px rgba(53,201,120,.14)}
    .category-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
    .chip{border:1px solid rgba(70,48,40,.16);background:rgba(112,83,70,.055);color:var(--text);border-radius:999px;padding:9px 12px;font-weight:900;font-size:13px;box-shadow:none}.chip.active{background:linear-gradient(135deg,var(--red),var(--red2));border-color:rgba(70,48,40,.24);color:#fffaf5;box-shadow:0 14px 28px rgba(155,106,96,.16);outline:2px solid rgba(255,250,245,.92);outline-offset:-4px}
    .item{
      border:1px solid var(--line);background:linear-gradient(145deg,rgba(255,255,255,.80),rgba(255,246,237,.82));border-radius:20px;overflow:hidden;
    }
    .item-main{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:15px}
    .item h4{margin:0;font-size:18px;letter-spacing:-.35px}.item p{margin:6px 0 0;color:var(--muted);font-size:13px;line-height:1.35}.price{font-weight:950;color:#765149;margin-top:9px}
    .qty{display:flex;align-items:center;gap:8px;justify-content:flex-end}.round{width:42px;height:42px;border-radius:999px;border:1px solid var(--line);background:rgba(112,83,70,.065);color:var(--text);font-weight:950;font-size:19px;display:grid;place-items:center}.round.plus{background:linear-gradient(135deg,var(--red),var(--red2));color:#fffaf5}.qty strong{min-width:26px;text-align:center}
    .toppings-open{border-top:1px solid var(--line);padding:12px 15px 15px;background:rgba(255,249,242,.92)}
    .toppings-title{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:10px;color:#765149;font-weight:950;font-size:13px}
    .toppings{display:flex;gap:7px;flex-wrap:wrap}
    .check-pill input{position:absolute;opacity:0;pointer-events:none}.check-pill span{display:inline-flex;border:1px solid rgba(70,48,40,.16);background:rgba(112,83,70,.055);padding:8px 10px;border-radius:999px;color:var(--text);font-size:13px;font-weight:850;box-shadow:none}.check-pill input:checked+span{border-color:rgba(70,48,40,.24);background:linear-gradient(135deg,var(--red),var(--red2));color:#fffaf5;box-shadow:0 14px 28px rgba(155,106,96,.16);outline:2px solid rgba(255,250,245,.92);outline-offset:-4px}
    .serving-options{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 10px}
    .serving-pill{border:1px solid rgba(70,48,40,.16);background:rgba(112,83,70,.055);color:var(--text);border-radius:999px;padding:9px 11px;font-size:13px;font-weight:950;box-shadow:none}
    .serving-pill.active{border-color:rgba(70,48,40,.24);background:linear-gradient(135deg,var(--red),var(--red2));color:#fffaf5;box-shadow:0 14px 28px rgba(155,106,96,.16);outline:2px solid rgba(255,250,245,.92);outline-offset:-4px}
    .serving-note{margin:8px 0 0;color:#7b6246;font-size:12px;font-weight:850;line-height:1.35}

    .unit-toppings{border-top:1px solid rgba(88,49,34,.10);padding-top:10px;margin-top:10px}
    .unit-toppings:first-child{border-top:0;padding-top:0;margin-top:0}
    .unit-toppings .toppings-title{margin-bottom:8px}
    .unit-top-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;flex-wrap:wrap}
    .unit-label{color:#765149;font-weight:950;font-size:13px}
    .line-qty{display:inline-flex;align-items:center;gap:6px;margin-left:auto}
    .mini-round{width:32px;height:32px;border-radius:999px;border:1px solid var(--line);background:rgba(112,83,70,.065);color:var(--text);font-weight:950;font-size:16px;display:grid;place-items:center}
    .mini-round.plus{background:linear-gradient(135deg,var(--red),var(--red2));color:#fffaf5}
    .line-qty strong{min-width:20px;text-align:center;color:var(--text)}
    .portion-tools{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
    .tiny-action{border:1px solid rgba(70,48,40,.16);background:rgba(112,83,70,.055);color:var(--text);border-radius:999px;padding:8px 10px;font-size:12px;font-weight:950}
    .cart{position:sticky;top:94px;background:#fffdf9;border:1px solid var(--line);box-shadow:var(--shadow)}
    .cart-empty{padding:22px;color:var(--muted);text-align:center;border:1px dashed rgba(88,49,34,.22);border-radius:18px;background:rgba(255,246,237,.65)}
    .cart-line{border:1px solid var(--line);background:rgba(112,83,70,.055);border-radius:18px;padding:13px;margin-bottom:10px}.cart-line-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.cart-line strong{font-size:15px}.cart-line small{display:block;margin-top:5px;color:var(--muted);line-height:1.35}.cart-total{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:14px;margin-top:14px;font-size:18px}.cart-total b{font-size:24px;color:#765149}
    .cart-line-actions{display:flex;justify-content:flex-end;margin-top:10px}.cart-line-actions .btn{min-height:38px;padding:8px 11px;border-radius:12px;font-size:13px}
    .cart-review{max-width:860px;margin:18px auto 0}
    .cart-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:14px}
    .cart-actions .btn{background:linear-gradient(135deg,var(--red),var(--red2));border-color:rgba(70,48,40,.16);box-shadow:0 12px 24px rgba(155,106,96,.12);color:#fffaf5}
    .cart-fab{position:fixed;right:22px;bottom:22px;z-index:140;width:68px;height:68px;border-radius:24px;border:1px solid rgba(88,49,34,.22);background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;box-shadow:0 22px 55px rgba(73,52,43,.13),0 12px 28px rgba(155,106,96,.10);display:none;align-items:center;justify-content:center}
    .cart-fab.show{display:flex}.cart-fab svg{width:30px;height:30px}.cart-fab-count{position:absolute;right:-6px;top:-7px;min-width:28px;height:28px;border-radius:999px;background:#8f6b54;color:#fffdf8;border:2px solid #fffaf4;display:grid;place-items:center;font-size:13px;font-weight:950;padding:0 7px}
    @media (max-width:760px){.cart-actions{grid-template-columns:1fr}.cart-fab{right:16px;bottom:16px;width:64px;height:64px;border-radius:22px}}
    .field{display:grid;gap:7px;margin-top:12px}.field label{font-size:13px;color:var(--muted);font-weight:900}.field input,.field select,.field textarea{width:100%;border:1px solid rgba(88,49,34,.18);background:#fffaf4;color:var(--text);border-radius:15px;padding:13px 14px;outline:none;min-height:48px}.field textarea{min-height:86px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:rgba(216,154,58,.62);box-shadow:0 0 0 4px rgba(216,154,58,.12)}
    .notice{border:1px solid rgba(216,154,58,.28);background:rgba(255,241,223,.82);border-radius:18px;padding:13px;color:#4e3d35;font-size:14px;line-height:1.4}
    .start-panel{max-width:920px;margin-left:auto;margin-right:auto}
    .start-notice{padding:18px 18px 17px;margin-bottom:18px;background:linear-gradient(145deg,rgba(255,244,230,.96),rgba(255,235,224,.78));}
    .start-notice strong{display:block;font-size:21px;letter-spacing:-.45px;color:#2b1a14;margin-bottom:7px}
    .start-notice span{display:block;color:#665349;font-size:15px;line-height:1.5}
    .order-area[hidden]{display:none!important}
    .screen{display:none}.screen.active{display:block}
    .toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin-bottom:14px}.toolbar-left,.toolbar-right{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.select-sm{border:1px solid var(--line);background:#fffaf4;color:var(--text);border-radius:999px;padding:10px 12px;font-weight:850;min-height:42px}.search{border:1px solid var(--line);background:#fffaf4;color:var(--text);border-radius:999px;padding:10px 14px;min-height:42px;min-width:220px}
    .orders{display:grid;gap:12px}.order-card{border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(255,246,237,.82));overflow:hidden}.order-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:15px;border-bottom:1px solid var(--line)}.order-head h4{margin:0;font-size:22px;letter-spacing:-.55px}.order-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}.tag{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:rgba(112,83,70,.055);border-radius:999px;padding:6px 9px;color:var(--muted);font-size:12px;font-weight:900}.tag.green{color:#1f7348;border-color:rgba(53,201,120,.32);background:rgba(53,201,120,.1)}.tag.amber{color:#765149;border-color:rgba(199,164,106,.32);background:rgba(245,178,65,.11)}.tag.red{color:#991b1b;border-color:rgba(239,68,68,.24);background:rgba(239,68,68,.08)}.order-body{padding:15px}.order-items{display:grid;gap:8px;margin-bottom:12px}.order-item{display:flex;justify-content:space-between;gap:10px;padding:10px;border-radius:14px;background:rgba(255,247,239,.82);border:1px solid rgba(88,49,34,.09)}.order-item small{display:block;color:var(--muted);margin-top:5px;line-height:1.35}.order-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.minute-buttons{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;margin-top:10px}.minute-btn{border:1px solid var(--line);background:rgba(112,83,70,.065);color:var(--text);border-radius:13px;padding:10px 5px;font-weight:950}.minute-btn.active{background:linear-gradient(135deg,#fde68a,#f59e0b);color:#2f241f;border-color:rgba(146,64,14,.20)}
    .status-new{border-color:rgba(199,164,106,.32)}.status-accepted{border-color:rgba(102,196,255,.32)}.status-grilling{border-color:rgba(155,106,96,.28)}.status-ready{border-color:rgba(53,201,120,.40)}.status-done{opacity:.74}
    .kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}.kpi{border:1px solid var(--line);background:rgba(255,247,239,.78);border-radius:18px;padding:15px}.kpi span{display:block;color:var(--muted);font-size:13px;font-weight:900}.kpi b{display:block;margin-top:8px;font-size:28px;color:#765149;letter-spacing:-.8px}.table{width:100%;border-collapse:collapse;overflow:hidden;border-radius:18px}.table th,.table td{text-align:left;border-bottom:1px solid var(--line);padding:12px 10px;color:var(--muted);font-size:14px}.table th{color:#765149;font-size:12px;text-transform:uppercase;letter-spacing:.6px;background:rgba(255,239,225,.72)}.table td b{color:var(--text)}
    .toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%) translateY(120px);z-index:200;background:#fffaf4;border:1px solid rgba(216,154,58,.42);box-shadow:0 20px 70px rgba(73,52,43,.13);border-radius:18px;padding:13px 16px;color:#4e3d35;font-weight:900;transition:.25s ease;max-width:calc(100vw - 32px);text-align:center}.toast.show{transform:translateX(-50%) translateY(0)}
    .modal{position:fixed;inset:0;background:rgba(35,20,13,.34);display:none;align-items:center;justify-content:center;padding:18px;z-index:160}.modal.show{display:flex}.modal-card{max-width:560px;width:100%;background:#fffdf9;border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);overflow:hidden}.modal-card .panel-body{max-height:70vh;overflow:auto}.qr-box{border:1px dashed rgba(88,49,34,.25);border-radius:20px;padding:18px;text-align:center;background:linear-gradient(145deg,rgba(255,248,239,.96),rgba(255,239,226,.88));color:#3b2821}.qr-box h3{color:#2b1a14;font-weight:950}.qr-box div{color:#5b463d;font-weight:850}

    .customer-status{max-width:820px;margin:18px auto 0}
    .customer-status-card{border:1px solid rgba(70,48,40,.13);border-radius:20px;background:linear-gradient(145deg,rgba(255,253,249,.96),rgba(255,246,237,.82));padding:14px}
    .customer-status-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
    .customer-status-top h4{margin:0;font-size:20px;letter-spacing:-.4px}.customer-status-top p{margin:5px 0 0;color:var(--muted);font-size:14px;line-height:1.35}
    .status-main-text{font-size:18px;font-weight:950;color:#2b1a14;margin-top:6px;line-height:1.35}
    .status-sub-text{font-size:14px;color:var(--muted);margin-top:5px;line-height:1.45}
    .status-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0}
    .status-step{border:1px solid rgba(70,48,40,.12);background:rgba(112,83,70,.045);border-radius:14px;padding:10px;text-align:center;color:var(--muted);font-weight:900;font-size:12px}
    .status-step.done{background:rgba(53,201,120,.10);border-color:rgba(53,201,120,.30);color:#1f7348}.status-step.active{background:linear-gradient(135deg,var(--red),var(--red2));border-color:rgba(70,48,40,.18);color:#fffaf5}
    .ready-alert{border:1px solid rgba(53,201,120,.38);background:linear-gradient(145deg,rgba(53,201,120,.15),rgba(255,253,249,.92));border-radius:18px;padding:14px;margin:12px 0;color:#1d6542;font-weight:950;text-align:center}

    .tag.blue{color:#3f6f8f;border-color:rgba(102,141,165,.30);background:rgba(102,141,165,.12)}
    .customer-status-card{transition:background .25s ease,border-color .25s ease,box-shadow .25s ease}
    .customer-status-new .panel-head,.customer-status-new .customer-status-card{background:linear-gradient(145deg,rgba(255,236,233,.96),rgba(255,250,246,.92));border-color:rgba(155,106,96,.22)}
    .customer-status-accepted .panel-head,.customer-status-accepted .customer-status-card{background:linear-gradient(145deg,rgba(255,248,220,.96),rgba(255,253,247,.92));border-color:rgba(199,164,106,.30)}
    .customer-status-grilling .panel-head,.customer-status-grilling .customer-status-card{background:linear-gradient(145deg,rgba(231,244,252,.96),rgba(250,253,255,.92));border-color:rgba(102,141,165,.28)}
    .customer-status-ready .panel-head,.customer-status-ready .customer-status-card{background:linear-gradient(145deg,rgba(229,247,237,.96),rgba(250,255,252,.92));border-color:rgba(63,143,99,.30)}
    .status-step.status-step-new{background:rgba(155,106,96,.10);border-color:rgba(155,106,96,.24);color:#7b5048}
    .status-step.status-step-accepted{background:rgba(245,207,88,.16);border-color:rgba(199,164,106,.34);color:#7b6246}
    .status-step.status-step-grilling{background:rgba(102,141,165,.14);border-color:rgba(102,141,165,.34);color:#3f6f8f}
    .status-step.status-step-ready{background:rgba(63,143,99,.13);border-color:rgba(63,143,99,.34);color:#1f7348}
    .status-step.active,.status-step.done{box-shadow:0 8px 18px rgba(73,52,43,.08);transform:translateY(-1px)}
    .status-step.status-step-new.active,.status-step.status-step-new.done{background:rgba(155,106,96,.18);border-color:rgba(155,106,96,.40);color:#6f463e}
    .status-step.status-step-accepted.active,.status-step.status-step-accepted.done{background:rgba(245,207,88,.26);border-color:rgba(199,164,106,.48);color:#6f5638}
    .status-step.status-step-grilling.active,.status-step.status-step-grilling.done{background:rgba(102,141,165,.24);border-color:rgba(102,141,165,.48);color:#325d79}
    .status-step.status-step-ready.active,.status-step.status-step-ready.done{background:rgba(63,143,99,.22);border-color:rgba(63,143,99,.48);color:#1d6542}
    .ready-smiley{
      position:relative;display:inline-grid;place-items:center;vertical-align:-7px;margin-left:9px;
      width:34px;height:34px;border-radius:999px;overflow:hidden;isolation:isolate;
      background:
        radial-gradient(circle at 32% 26%,rgba(255,255,255,.92),rgba(255,255,255,.12) 24%,transparent 38%),
        linear-gradient(145deg,#ffe49a 0%,#f5b941 42%,#dc3342 100%);
      box-shadow:0 10px 24px rgba(220,51,66,.22),0 0 0 1px rgba(255,255,255,.75) inset;
      animation:readySmileyFloat 1.8s ease-in-out infinite;
      transform-origin:center;
    }
    .ready-smiley:before{
      content:"";position:absolute;inset:-45%;z-index:0;
      background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.70) 46%,transparent 60%);
      transform:translateX(-65%) rotate(8deg);
      animation:readySmileyShine 2.4s ease-in-out infinite;
    }
    .ready-smiley:after{
      content:"";position:absolute;inset:3px;border-radius:999px;z-index:0;
      border:1px solid rgba(255,255,255,.48);
    }
    .ready-smiley-face{
      position:relative;z-index:1;color:#fffaf5;font-size:20px;line-height:1;
      text-shadow:0 2px 5px rgba(80,12,18,.24);
      transform:translateY(-1px);
      animation:readySmileyFace 1.8s ease-in-out infinite;
    }
    @keyframes readySmileyFloat{
      0%,100%{transform:translateY(0) scale(1);filter:saturate(1)}
      50%{transform:translateY(-3px) scale(1.06);filter:saturate(1.08)}
    }
    @keyframes readySmileyFace{
      0%,100%{transform:translateY(-1px) rotate(0deg)}
      50%{transform:translateY(-2px) rotate(-4deg)}
    }
    @keyframes readySmileyShine{
      0%,35%{transform:translateX(-70%) rotate(8deg);opacity:0}
      50%{opacity:1}
      75%,100%{transform:translateX(70%) rotate(8deg);opacity:0}
    }
    .eta-box{border:1px solid rgba(199,164,106,.34);background:linear-gradient(145deg,rgba(255,248,220,.96),rgba(255,253,247,.92));border-radius:18px;padding:13px 14px;margin:12px 0 12px;color:#5c4634;font-weight:950;line-height:1.4;box-shadow:0 10px 22px rgba(73,52,43,.06)}
    .eta-box span{display:block;margin-top:4px;color:var(--muted);font-size:13px;font-weight:850}
    .customer-status-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.customer-status-actions .btn{flex:1 1 180px}
    @media(max-width:760px){.status-steps{grid-template-columns:1fr 1fr}.customer-status-top{display:block}.customer-status-actions .btn{width:100%}}
    @media (max-width:1100px){.layout{grid-template-columns:1fr}.cart{position:relative;top:auto}.branch-grid{display:flex}.kpi-grid{grid-template-columns:repeat(2,1fr)}}
    @media (max-width:760px){.app{padding:12px}.topbar{margin:0 -12px 12px;padding:10px 12px}.topbar-inner{align-items:center;flex-direction:row}.brand{width:184px}.brand-logo{width:184px;height:52px;border-radius:0}.brand-copy{width:184px}.brand-copy h1{font-size:13px;letter-spacing:.1px}.call-wrap{width:auto;justify-content:flex-end}.call-btn{min-height:40px;padding:9px 11px;font-size:13px}.call-list{right:0;width:210px}.tabs{width:100%;justify-content:stretch}.tab-btn{flex:1;justify-content:center;padding:10px 8px;font-size:13px}.hero{padding:20px;min-height:unset}.hero h2{font-size:38px;letter-spacing:-1.5px}.branch-grid{display:flex;gap:8px}.branch-card{padding:9px 12px;min-height:40px}.branch-card strong{font-size:13px}.grid{grid-template-columns:1fr}.panel-head{padding:15px}.panel-body{padding:14px}.cart{background:#fffdf9}.minute-buttons{grid-template-columns:repeat(4,1fr)}.kpi-grid{grid-template-columns:1fr}.toolbar{align-items:stretch}.toolbar-left,.toolbar-right{width:100%}.search,.select-sm{width:100%}.order-head{flex-direction:column}.order-actions .btn{flex:1}.table{display:block;overflow:auto}.item-main{grid-template-columns:1fr}.qty{justify-content:flex-start}.hero-actions .btn{width:100%}}


    /* Red theme applied across all panels and secondary surfaces */
    .panel,
    .cart,
    .modal-card{
      border-color:rgba(180,35,42,.14);
      box-shadow:0 18px 48px rgba(127,17,23,.08);
    }
    .panel-head{
      background:linear-gradient(180deg,rgba(255,238,239,.96),rgba(255,250,250,.72));
      border-bottom-color:rgba(180,35,42,.14);
    }
    .panel-head h3,
    .price,
    .toppings-title,
    .unit-label,
    .cart-total b,
    .kpi b,
    .table th{
      color:var(--red2);
    }
    .branch-card,
    .chip,
    .btn.ghost,
    .tiny-action,
    .round,
    .mini-round,
    .minute-btn,
    .tag,
    .serving-pill,
    .check-pill span,
    .cart-line,
    .status-step{
      background:rgba(180,35,42,.045);
      border-color:rgba(180,35,42,.14);
    }
    .item,
    .cart-empty,
    .order-card,
    .order-item,
    .kpi,
    .customer-status-card{
      background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(255,240,241,.74));
      border-color:rgba(180,35,42,.12);
    }
    .notice,
    .start-notice,
    .toast,
    .qr-box{
      background:linear-gradient(145deg,rgba(255,239,240,.96),rgba(255,250,250,.90));
      border-color:rgba(180,35,42,.18);
      color:#3b171b;
    }
    .start-notice strong,
    .qr-box h3,
    .status-main-text{
      color:#2b0b0f;
    }
    .start-notice span,
    .qr-box div{
      color:#6f2e35;
    }
    .field input,
    .field select,
    .field textarea,
    .select-sm,
    .search{
      background:#fff7f7;
      border-color:rgba(180,35,42,.14);
    }
    .field input:focus,
    .field select:focus,
    .field textarea:focus,
    .select-sm:focus,
    .search:focus{
      border-color:rgba(180,35,42,.42);
      box-shadow:0 0 0 4px rgba(180,35,42,.10);
      outline:none;
    }
    .table th{
      background:rgba(180,35,42,.075);
    }
    .cart-fab-count{
      background:#ffd6da;
      color:var(--red2);
      border-color:#fff7f7;
    }
    .status-new{border-color:rgba(180,35,42,.24)}
    .status-grilling{border-color:rgba(59,130,246,.24)}
    .eta-box{
      background:linear-gradient(145deg,rgba(255,247,220,.96),rgba(255,252,244,.92));
      border-color:rgba(245,158,11,.30);
      color:#5f3d0b;
    }

    /* Unified button color across the whole system */
    .btn,
    .btn.primary,
    .btn.ghost,
    .btn.danger,
    .btn.amber,
    .btn.green,
    .call-btn,
    .call-list a,
    .tab-btn.active,
    .branch-card.active,
    .chip.active,
    .round.plus,
    .mini-round.plus,
    .serving-pill.active,
    .check-pill input:checked + span,
    .tiny-action,
    .minute-btn.active,
    .cart-actions .btn,
    .cart-line-actions .btn,
    .order-actions .btn,
    .customer-status-actions .btn,
    .hero-actions .btn{
      background:linear-gradient(135deg,var(--red),var(--red2)) !important;
      border-color:rgba(127,17,23,.22) !important;
      color:#fffaf5 !important;
      box-shadow:0 12px 24px rgba(127,17,23,.13) !important;
    }
    .btn:hover,
    .call-btn:hover,
    .call-list a:hover,
    .branch-card.active:hover,
    .chip.active:hover,
    .tiny-action:hover,
    .minute-btn.active:hover{
      filter:brightness(.98);
      transform:translateY(-1px);
    }
    .btn:disabled{
      opacity:.42 !important;
      cursor:not-allowed !important;
      filter:saturate(.6) !important;
      transform:none !important;
      box-shadow:none !important;
    }


    /* Final override: every clickable button uses the same bordo/red theme */
    button.btn,
    .btn,
    .btn.primary,
    .btn.ghost,
    .btn.danger,
    .btn.amber,
    .btn.green,
    .call-btn,
    .call-list a,
    .tab-btn,
    .branch-card,
    .chip,
    .round,
    .mini-round,
    .serving-pill,
    .tiny-action,
    .minute-btn,
    .cart-fab,
    .cart-actions .btn,
    .cart-line-actions .btn,
    .order-actions .btn,
    .customer-status-actions .btn,
    .hero-actions .btn,
    .check-pill span{
      background:linear-gradient(135deg,#b4232a,#7f1117) !important;
      border-color:rgba(127,17,23,.26) !important;
      color:#fffaf5 !important;
      box-shadow:0 12px 24px rgba(127,17,23,.13) !important;
    }
    .branch-card.active,
    .chip.active,
    .tab-btn.active,
    .serving-pill.active,
    .check-pill input:checked + span,
    .minute-btn.active,
    .round.plus,
    .mini-round.plus{
      background:linear-gradient(135deg,#d22b33,#6f0f14) !important;
      border-color:rgba(111,15,20,.34) !important;
      color:#fffaf5 !important;
      outline:2px solid rgba(255,250,245,.86) !important;
      outline-offset:-4px !important;
    }
    .btn:hover,
    .call-btn:hover,
    .call-list a:hover,
    .branch-card:hover,
    .chip:hover,
    .round:hover,
    .mini-round:hover,
    .serving-pill:hover,
    .tiny-action:hover,
    .minute-btn:hover,
    .cart-fab:hover,
    .check-pill span:hover{
      filter:brightness(.98);
      transform:translateY(-1px);
    }
    button:disabled,
    .btn:disabled,
    .round:disabled,
    .mini-round:disabled{
      background:linear-gradient(135deg,#efd7d9,#d8b6b9) !important;
      border-color:rgba(127,17,23,.16) !important;
      color:#7f1117 !important;
      opacity:.58 !important;
      cursor:not-allowed !important;
      filter:saturate(.75) !important;
      transform:none !important;
      box-shadow:none !important;
    }
    .order-actions .btn,
    .toolbar .btn,
    .toolbar .chip,
    .minute-buttons .minute-btn,
    #adminOrders .btn,
    #grillOrders .btn,
    #seedDemo,
    #clearOrders,
    #exportJson,
    #printAdmin{
      background:linear-gradient(135deg,#b4232a,#7f1117) !important;
      border-color:rgba(127,17,23,.26) !important;
      color:#fffaf5 !important;
    }



    /* V16: roštilj panel visok kontrast - važi samo kad je aktivan roštilj ekran */
    body.screen-grill{
      background:#070b14 !important;
    }
    body.screen-grill .topbar{
      background:linear-gradient(180deg,#0b1020,#111827) !important;
      border-bottom:3px solid #facc15 !important;
    }
    body.screen-grill .brand-copy h1{
      color:#fff !important;
    }
    body.screen-grill #grill{
      color:#fff !important;
    }
    body.screen-grill #grill .panel{
      background:#0b1020 !important;
      border:4px solid #facc15 !important;
      box-shadow:0 0 0 4px rgba(255,255,255,.08),0 26px 80px rgba(0,0,0,.42) !important;
    }
    body.screen-grill #grill .panel-head{
      background:linear-gradient(135deg,#111827,#7f1117) !important;
      border-bottom:4px solid #facc15 !important;
      padding:22px !important;
    }
    body.screen-grill #grill .panel-head h3{
      color:#fff !important;
      font-size:38px !important;
      line-height:1.05 !important;
      letter-spacing:-.8px !important;
      text-shadow:0 3px 0 rgba(0,0,0,.35) !important;
    }
    body.screen-grill #grill .panel-head p{
      color:#fde68a !important;
      font-size:19px !important;
      font-weight:950 !important;
    }
    body.screen-grill #grill .panel-body{
      background:linear-gradient(180deg,#070b14,#111827) !important;
      padding:22px !important;
    }
    body.screen-grill #grill .toolbar{
      background:#111827 !important;
      border:3px solid rgba(250,204,21,.65) !important;
      border-radius:24px !important;
      padding:16px !important;
      margin-bottom:22px !important;
      box-shadow:0 16px 40px rgba(0,0,0,.30) !important;
    }
    body.screen-grill #grill .select-sm{
      min-height:66px !important;
      font-size:23px !important;
      font-weight:950 !important;
      color:#0f172a !important;
      background:#fff !important;
      border:4px solid #facc15 !important;
      border-radius:18px !important;
      box-shadow:0 12px 28px rgba(0,0,0,.30) !important;
    }
    body.screen-grill #grill .toolbar .chip,
    body.screen-grill #grill .toolbar .btn{
      min-height:66px !important;
      font-size:20px !important;
      font-weight:950 !important;
      border-radius:18px !important;
      padding:14px 20px !important;
      background:#334155 !important;
      color:#fff !important;
      border:3px solid rgba(255,255,255,.88) !important;
      box-shadow:0 12px 28px rgba(0,0,0,.30) !important;
    }
    body.screen-grill #grill .toolbar .chip.active{
      background:linear-gradient(135deg,#fde047,#f59e0b) !important;
      color:#111827 !important;
      border-color:#fff !important;
      outline:4px solid rgba(250,204,21,.30) !important;
      outline-offset:2px !important;
    }
    body.screen-grill #grill #grillOrders{
      gap:22px !important;
    }
    body.screen-grill #grill .cart-empty{
      background:#fff !important;
      color:#111827 !important;
      border:5px dashed #facc15 !important;
      font-size:30px !important;
      font-weight:950 !important;
      padding:38px !important;
      text-align:center !important;
      border-radius:26px !important;
    }
    body.screen-grill #grill .order-card{
      background:#fff !important;
      border:6px solid #fff !important;
      border-radius:32px !important;
      overflow:hidden !important;
      box-shadow:0 28px 75px rgba(0,0,0,.38) !important;
    }
    body.screen-grill #grill .order-card.status-new{border-color:#ef4444 !important;}
    body.screen-grill #grill .order-card.status-accepted{border-color:#facc15 !important;}
    body.screen-grill #grill .order-card.status-grilling{border-color:#3b82f6 !important;}
    body.screen-grill #grill .order-card.status-ready{border-color:#22c55e !important;}
    body.screen-grill #grill .order-card.status-done{border-color:#94a3b8 !important;opacity:.78 !important;}

    body.screen-grill #grill .order-card.status-new .order-head{background:linear-gradient(135deg,#dc2626,#7f1d1d) !important;}
    body.screen-grill #grill .order-card.status-accepted .order-head{background:linear-gradient(135deg,#fde047,#f59e0b) !important;}
    body.screen-grill #grill .order-card.status-grilling .order-head{background:linear-gradient(135deg,#3b82f6,#1e3a8a) !important;}
    body.screen-grill #grill .order-card.status-ready .order-head{background:linear-gradient(135deg,#22c55e,#166534) !important;}
    body.screen-grill #grill .order-card.status-done .order-head{background:linear-gradient(135deg,#64748b,#334155) !important;}
    body.screen-grill #grill .order-head{
      padding:24px !important;
      border-bottom:5px solid rgba(0,0,0,.20) !important;
    }
    body.screen-grill #grill .order-head h4{
      color:#fff !important;
      font-size:46px !important;
      line-height:1.02 !important;
      letter-spacing:-1px !important;
      text-transform:uppercase !important;
      text-shadow:0 3px 0 rgba(0,0,0,.32) !important;
    }
    body.screen-grill #grill .order-card.status-accepted .order-head h4{
      color:#111827 !important;
      text-shadow:none !important;
    }
    body.screen-grill #grill .order-meta{
      gap:11px !important;
      margin-top:15px !important;
    }
    body.screen-grill #grill .tag{
      min-height:40px !important;
      padding:9px 14px !important;
      border-radius:999px !important;
      background:#fff !important;
      color:#111827 !important;
      border:3px solid rgba(0,0,0,.16) !important;
      font-size:17px !important;
      font-weight:950 !important;
      box-shadow:none !important;
    }
    body.screen-grill #grill .order-meta .tag:first-child{
      font-size:20px !important;
      padding:10px 17px !important;
      border-width:4px !important;
      text-transform:uppercase !important;
    }
    body.screen-grill #grill .order-body{
      background:#fff !important;
      color:#111827 !important;
      padding:24px !important;
    }
    body.screen-grill #grill .order-items{
      gap:13px !important;
      margin-bottom:18px !important;
    }
    body.screen-grill #grill .order-item{
      background:#f8fafc !important;
      border:3px solid #cbd5e1 !important;
      border-radius:22px !important;
      padding:18px 20px !important;
      color:#111827 !important;
    }
    body.screen-grill #grill .order-item b{
      color:#0f172a !important;
      font-size:32px !important;
      line-height:1.1 !important;
      letter-spacing:-.45px !important;
    }
    body.screen-grill #grill .order-item small{
      color:#334155 !important;
      font-size:23px !important;
      font-weight:900 !important;
      line-height:1.35 !important;
      margin-top:8px !important;
    }
    body.screen-grill #grill .notice{
      background:#fff7ed !important;
      border:4px solid #fb923c !important;
      color:#7c2d12 !important;
      font-size:25px !important;
      font-weight:950 !important;
      padding:17px 19px !important;
      border-radius:22px !important;
    }
    body.screen-grill #grill .order-body b[style]{
      color:#0f172a !important;
      font-size:25px !important;
    }
    body.screen-grill #grill .minute-buttons{
      grid-template-columns:repeat(6,minmax(0,1fr)) !important;
      gap:12px !important;
      margin-top:15px !important;
    }
    body.screen-grill #grill .minute-btn{
      min-height:66px !important;
      border-radius:18px !important;
      font-size:25px !important;
      font-weight:950 !important;
      background:#111827 !important;
      color:#fff !important;
      border:3px solid #94a3b8 !important;
      box-shadow:0 10px 24px rgba(0,0,0,.24) !important;
    }
    body.screen-grill #grill .minute-btn.active{
      background:linear-gradient(135deg,#fde047,#f59e0b) !important;
      color:#111827 !important;
      border:4px solid #111827 !important;
      outline:4px solid rgba(250,204,21,.40) !important;
      outline-offset:2px !important;
    }
    body.screen-grill #grill .order-actions{
      gap:13px !important;
      margin-top:20px !important;
    }
    body.screen-grill #grill .order-actions .btn{
      min-height:76px !important;
      flex:1 1 220px !important;
      font-size:25px !important;
      line-height:1.05 !important;
      font-weight:950 !important;
      border-radius:24px !important;
      border:4px solid #fff !important;
      box-shadow:0 14px 30px rgba(0,0,0,.32) !important;
      text-transform:uppercase !important;
      letter-spacing:.2px !important;
    }
    body.screen-grill #grill .order-actions .btn.primary,
    body.screen-grill #grill .order-actions .btn[data-accept]{
      background:linear-gradient(135deg,#22c55e,#15803d) !important;
      color:#fff !important;
    }
    body.screen-grill #grill .order-actions .btn.danger,
    body.screen-grill #grill .order-actions .btn[data-status$=':cancelled']{
      background:linear-gradient(135deg,#ef4444,#991b1b) !important;
      color:#fff !important;
    }
    body.screen-grill #grill .order-actions .btn.amber,
    body.screen-grill #grill .order-actions .btn[data-status$=':grilling']{
      background:linear-gradient(135deg,#3b82f6,#1e40af) !important;
      color:#fff !important;
    }
    body.screen-grill #grill .order-actions .btn.green,
    body.screen-grill #grill .order-actions .btn[data-status$=':ready']{
      background:linear-gradient(135deg,#22c55e,#166534) !important;
      color:#fff !important;
    }
    body.screen-grill #grill .order-actions .btn[data-status$=':done']{
      background:linear-gradient(135deg,#14b8a6,#0f766e) !important;
      color:#fff !important;
    }
    @media (max-width:760px){
      body.screen-grill #grill .panel-head h3{font-size:30px !important;}
      body.screen-grill #grill .order-head h4{font-size:34px !important;}
      body.screen-grill #grill .order-item b{font-size:26px !important;}
      body.screen-grill #grill .order-item small{font-size:19px !important;}
      body.screen-grill #grill .minute-buttons{grid-template-columns:repeat(4,minmax(0,1fr)) !important;}
      body.screen-grill #grill .order-actions .btn{font-size:21px !important;}
    }


    /* V17: korisnički meni - ne bojiti izbor začina i selektore kao glavnu akciju.
       Neaktivno je svetlo/krem; izabrano ostaje bordo/crveno. */
    #customer .check-pill span,
    #customer .serving-pill,
    #customer .branch-card:not(.active),
    #customer .chip:not(.active),
    #customer .tiny-action,
    #customer .round:not(.plus),
    #customer .mini-round:not(.plus){
      background:linear-gradient(145deg,rgba(255,253,249,.94),rgba(255,246,237,.86)) !important;
      border-color:rgba(70,48,40,.16) !important;
      color:var(--text) !important;
      box-shadow:none !important;
      outline:none !important;
    }
    #customer .check-pill input:checked + span,
    #customer .serving-pill.active,
    #customer .branch-card.active,
    #customer .chip.active,
    #customer .round.plus,
    #customer .mini-round.plus{
      background:linear-gradient(135deg,#b4232a,#7f1117) !important;
      border-color:rgba(127,17,23,.28) !important;
      color:#fffaf5 !important;
      box-shadow:0 12px 24px rgba(127,17,23,.13) !important;
      outline:2px solid rgba(255,250,245,.86) !important;
      outline-offset:-4px !important;
    }
    #customer .check-pill span:hover,
    #customer .serving-pill:hover,
    #customer .branch-card:hover,
    #customer .chip:hover{
      filter:brightness(.985) !important;
      transform:translateY(-1px) !important;
    }