/* Perubahan #35 -- kartu ikon 3D (customer Pesan & kasir Pesankan). Dipakai bersama. */

  .ik-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
  .ik-tile{position:relative;min-height:176px;display:flex;flex-direction:column;align-items:center;background:var(--tk3-bg,#e9eef6);border-radius:22px;padding:14px 10px 12px;text-align:center;
    box-shadow:8px 8px 16px rgba(163,177,198,.55),-8px -8px 16px rgba(255,255,255,.9)}
  .ik-tile.sel{box-shadow:inset 6px 6px 12px rgba(163,177,198,.6),inset -6px -6px 12px rgba(255,255,255,.9)}
  .ik-tile.sel .ik-ico,.ik-tile.sel .ik-foto{transform:perspective(200px) rotateX(8deg) scale(.94)}
  .ik-ok{position:absolute;top:9px;right:9px;width:22px;height:22px;border-radius:50%;background:linear-gradient(145deg,#3b82f6,#1d4ed8);color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 6px rgba(29,78,216,.45)}
  .ik-cam{position:absolute;top:9px;left:9px;width:26px;height:26px;border-radius:50%;background:#fff;color:#475569;font-size:12px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 5px rgba(0,0,0,.2)}
  .ik-ico{position:relative;width:64px;height:64px;margin:2px auto 10px;border-radius:20px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:28px;transform:perspective(200px) rotateX(8deg);text-shadow:0 2px 3px rgba(0,0,0,.25)}
  .ik-ico::before{content:'';position:absolute;inset:3px 3px auto 3px;height:45%;border-radius:17px 17px 30px 30px;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0))}
  .ik-ico i{position:relative;z-index:1}
  .ik-foto{width:64px;height:64px;margin:2px auto 10px;border-radius:20px;overflow:hidden;box-shadow:0 10px 18px rgba(0,0,0,.25);border:3px solid #fff}
  .ik-foto svg{width:100%;height:100%;display:block}
  .ik-badge{position:absolute;right:-8px;bottom:-6px;background:#fff;color:#c2410c;font-weight:800;font-size:12px;border-radius:9px;padding:2px 6px;box-shadow:0 2px 5px rgba(0,0,0,.2);z-index:2;text-shadow:none}
  .g-cuci{background:linear-gradient(145deg,#7dd3fc,#3b82f6 55%,#1d4ed8);box-shadow:0 10px 18px rgba(37,99,235,.40),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-kering{background:linear-gradient(145deg,#fdba74,#f97316 55%,#c2410c);box-shadow:0 10px 18px rgba(234,88,12,.40),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-lipat{background:linear-gradient(145deg,#c4b5fd,#8b5cf6 55%,#6d28d9);box-shadow:0 10px 18px rgba(124,58,237,.38),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-setrika{background:linear-gradient(145deg,#fda4af,#f43f5e 55%,#be123c);box-shadow:0 10px 18px rgba(225,29,72,.38),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-antar{background:linear-gradient(145deg,#86efac,#22c55e 55%,#15803d);box-shadow:0 10px 18px rgba(22,163,74,.38),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-aj{background:linear-gradient(145deg,#5eead4,#14b8a6 55%,#0f766e);box-shadow:0 10px 18px rgba(13,148,136,.38),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-drop{background:linear-gradient(145deg,#f9a8d4,#ec4899 55%,#be185d);box-shadow:0 10px 18px rgba(219,39,119,.38),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-berat{background:linear-gradient(145deg,#cbd5e1,#64748b 55%,#334155);box-shadow:0 10px 18px rgba(51,65,85,.38),inset 0 -5px 8px rgba(0,0,0,.2)}
  .g-sabun{background:linear-gradient(145deg,#bae6fd,#0ea5e9 55%,#0369a1);box-shadow:0 10px 18px rgba(2,132,199,.38),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-wangi{background:linear-gradient(145deg,#f5d0fe,#d946ef 55%,#a21caf);box-shadow:0 10px 18px rgba(192,38,211,.38),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-teh{background:linear-gradient(145deg,#fde68a,#d97706 60%,#92400e);box-shadow:0 10px 18px rgba(217,119,6,.38),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-air{background:linear-gradient(145deg,#a5f3fc,#06b6d4 55%,#0e7490);box-shadow:0 10px 18px rgba(8,145,178,.38),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-mie{background:linear-gradient(145deg,#fecaca,#ef4444 55%,#991b1b);box-shadow:0 10px 18px rgba(220,38,38,.38),inset 0 -5px 8px rgba(0,0,0,.18)}
  .g-kopi{background:linear-gradient(145deg,#d6a77a,#92400e 60%,#5b2a0c);box-shadow:0 10px 18px rgba(120,53,15,.40),inset 0 -5px 8px rgba(0,0,0,.2)}
  .ik-name{font-weight:800;font-size:14.5px;color:var(--tk3-ink,#1e293b);line-height:1.2}
  .ik-desc{font-size:11px;color:#64748b;margin-top:2px}
  .ik-price{margin-top:6px;font-weight:800;font-size:13px;color:var(--primary,#2563eb)}
  .ik-promo{display:inline-flex;gap:5px;align-items:center;margin-top:8px;font-size:11px;font-weight:700;color:#15803d;background:#dcfce7;padding:4px 9px;border-radius:999px}
  .ik-rek{margin-top:6px;font-size:10px;font-weight:700;color:#c2410c;background:#ffedd5;border-radius:999px;padding:2px 8px}
  .ik-qty{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:auto;padding-top:8px}
  .ik-qty button{width:28px;height:28px;border:none;border-radius:9px;background:var(--tk3-bg,#e9eef6);box-shadow:3px 3px 6px rgba(163,177,198,.55),-3px -3px 6px #fff;font-weight:800;color:#2563eb}
  .ik-stok{font-size:10px;color:#64748b;margin-top:2px}
  .ik-sec{display:flex;align-items:center;justify-content:space-between;font-weight:700;color:#475569;font-size:15px;margin:6px 0 12px}
  .ik-sec i.fa-chevron-down,.ik-sec i.fa-chevron-up{font-size:12px;color:#94a3b8}
  .ik-sec small{font-weight:500;font-size:11px;color:#16a34a}
  .ik-search{width:100%;border:none;border-radius:12px;padding:12px 14px;font-size:13px;margin-bottom:12px;background:var(--tk3-bg,#e9eef6);box-shadow:inset 3px 3px 6px rgba(163,177,198,.5),inset -3px -3px 6px #fff}
  .ik-cap{font-size:10.5px;color:#64748b;text-align:center;margin:-6px 0 14px}
  .ik-berat{display:flex;align-items:center;gap:14px;background:var(--tk3-bg,#e9eef6);border-radius:22px;padding:14px;box-shadow:8px 8px 16px rgba(163,177,198,.55),-8px -8px 16px rgba(255,255,255,.9);margin-bottom:16px}
  .ik-berat .ik-ico{margin:0}
  .ik-bin{flex:1}.ik-bin label{font-size:12px;font-weight:700;color:#475569}
  .ik-brow{display:flex;align-items:center;gap:8px;margin-top:6px}
  .ik-brow button{width:38px;height:38px;border:none;border-radius:12px;background:var(--tk3-bg,#e9eef6);box-shadow:3px 3px 6px rgba(163,177,198,.55),-3px -3px 6px #fff;font-weight:800;font-size:18px;color:#334155}
  .ik-brow .v{flex:1;text-align:center;font-size:24px;font-weight:800;color:#0f172a;border-radius:12px;padding:6px 0;box-shadow:inset 3px 3px 6px rgba(163,177,198,.5),inset -3px -3px 6px #fff}
  .ik-brow .v small{font-size:13px;color:#64748b;font-weight:700}
  .ik-bh{font-size:10.5px;color:#64748b;margin-top:6px}
  .ik-sticky{position:fixed;left:0;right:0;bottom:68px;z-index:99;background:var(--tk3-bg,#e9eef6);border-radius:22px 22px 0 0;box-shadow:0 -10px 22px rgba(100,116,139,.35);padding:10px 14px 12px}
  .ik-met{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
  .ik-met div{border-radius:12px;padding:7px 4px;text-align:center;font-size:12px;font-weight:800;color:#1e3a8a;background:var(--tk3-bg,#e9eef6);box-shadow:3px 3px 7px rgba(163,177,198,.55),-3px -3px 7px #fff;position:relative}
  .ik-met div.sel{box-shadow:inset 3px 3px 7px rgba(163,177,198,.6),inset -3px -3px 7px #fff}
  .ik-met div.sel::after{content:'\f00c';font-family:'Font Awesome 6 Free';font-weight:900;position:absolute;top:-6px;right:-4px;width:18px;height:18px;border-radius:50%;background:#2563eb;color:#fff;font-size:9px;display:flex;align-items:center;justify-content:center}
  .ik-met small{display:block;font-size:9.5px;font-weight:600;color:#64748b}
  .ik-res{display:flex;gap:10px;overflow-x:auto;padding:4px 2px 10px;border-bottom:1px dashed #cbd5e1;margin-bottom:10px}
  .ik-ri{position:relative;flex:0 0 auto;width:40px;height:40px;border-radius:13px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:17px}
  .ik-ri::before{content:'';position:absolute;inset:2px 2px auto 2px;height:45%;border-radius:11px 11px 20px 20px;background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0))}
  .ik-ri .b{position:absolute;right:-6px;bottom:-5px;background:#fff;color:#0f172a;font-size:10px;font-weight:800;border-radius:8px;padding:1px 5px;box-shadow:0 2px 4px rgba(0,0,0,.2)}
  .ik-ri.foto{background:#fff;border:2px solid #fff;padding:0;box-shadow:0 4px 8px rgba(0,0,0,.2)}
  .ik-ri.foto .fw{width:100%;height:100%;border-radius:11px;overflow:hidden}
  .ik-ri.foto svg{width:100%;height:100%}
  .ik-tot{display:flex;align-items:center;gap:12px}
  .ik-tot .t{flex:1}.ik-tot small{font-size:11px;color:#64748b;display:block}.ik-tot b{font-size:20px;color:#1d4ed8}
  .ik-tot button{border:none;border-radius:14px;padding:13px 26px;color:#fff;font-weight:800;font-size:15px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);box-shadow:0 6px 14px rgba(29,78,216,.35)}
  .ik-chip-out{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.18);border-radius:999px;padding:6px 12px;font-size:13px;color:#fff;font-weight:600}
  .ik-chip-out .sw{background:#fff;color:#1d4ed8;border-radius:999px;padding:2px 8px;font-size:11px;font-weight:800}
  .ik-cab{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;margin-bottom:10px;background:var(--tk3-bg,#e9eef6);box-shadow:5px 5px 10px rgba(163,177,198,.5),-5px -5px 10px #fff}
  .ik-cab.sel{box-shadow:inset 4px 4px 9px rgba(163,177,198,.55),inset -4px -4px 9px #fff}
  .ik-cab .nm{flex:1;font-weight:800;font-size:14px}.ik-cab .nm small{display:block;font-weight:500;font-size:11.5px;color:#64748b}
  .ik-cab .akt{font-size:11px;font-weight:800;color:#b45309;background:#fef3c7;border-radius:999px;padding:3px 8px}
  
.ik-tile{cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;transition:box-shadow .12s}
.ik-tile.dis{opacity:.45;pointer-events:none}
.ik-tile .ik-qty button:disabled{opacity:.4}
.ik-sec{cursor:pointer}
.ik-cap{font-size:10.5px;color:#64748b;text-align:center;margin:-6px 0 14px}
.ik-panel{flex-direction:column;align-items:stretch!important;gap:0!important;padding:10px 14px 12px!important;border-radius:22px 22px 0 0}
.ik-panel .ik-met div{cursor:pointer}
.ik-panel .ik-met div.dis{opacity:.45;cursor:not-allowed}
.ik-panel .ik-tot button{flex:0 0 auto}
.ik-res:empty{display:none}
.ik-brow .v{display:flex;align-items:baseline;justify-content:center;gap:5px;cursor:text}
.ik-brow .v:focus-within{box-shadow:inset 3px 3px 6px rgba(163,177,198,.5),inset -3px -3px 6px #fff,0 0 0 2px rgba(37,99,235,.35)}
.ik-brow .vin,.ik-brow .vin:focus{-webkit-appearance:none;appearance:none;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;
  margin:0;padding:0;width:1.4em;min-width:0;max-width:5em;text-align:center;font-family:inherit;font-size:26px;font-weight:800;line-height:1.15;color:#0f172a;border-radius:0}
.ik-brow .vin::placeholder{color:#94a3b8;font-weight:800}
.ik-foto img{width:100%;height:100%;object-fit:cover;display:block}
.ik-ri.foto img{width:100%;height:100%;object-fit:cover;display:block}
.ik-hemat{font-size:10px;color:#16a34a;font-weight:700}
.ik-sheet-foto{display:flex;flex-direction:column;align-items:center;gap:12px}
.ik-sheet-foto .pv{width:160px;height:160px;border-radius:28px;overflow:hidden;box-shadow:0 10px 22px rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center;background:#f1f5f9}
.ik-sheet-foto .pv img{width:100%;height:100%;object-fit:cover}

/* Perubahan #40: foto barang bisa diperbesar */
.ik-foto.zm { position:relative; cursor:zoom-in; }
.ik-zm { position:absolute; right:4px; bottom:4px; width:22px; height:22px; border-radius:8px; background:rgba(15,23,42,.55); color:#fff; font-size:11px; display:flex; align-items:center; justify-content:center; pointer-events:none; }
.ik-lb { position:fixed; inset:0; z-index:9999; background:rgba(15,23,42,.82); display:flex; align-items:center; justify-content:center; padding:20px; animation:ikLb .15s ease-out; }
@keyframes ikLb { from { opacity:0; } to { opacity:1; } }
.ik-lb-in { display:flex; flex-direction:column; align-items:center; max-width:min(92vw,440px); }
.ik-lb-in img { width:min(86vw,400px); height:min(86vw,400px); object-fit:cover; border-radius:22px; box-shadow:0 12px 32px rgba(0,0,0,.45); background:#fff; }
.ik-lb-n { color:#fff; font-weight:800; font-size:17px; margin-top:14px; text-align:center; }
.ik-lb-i { color:#cbd5e1; font-size:13px; margin-top:2px; text-align:center; }
.ik-lb-b { margin-top:14px; border:none; font-family:inherit; background:linear-gradient(145deg,#3b82f6,#1d4ed8); color:#fff; font-weight:700; border-radius:14px; padding:12px 40px; font-size:14px; cursor:pointer; box-shadow:0 6px 14px rgba(37,99,235,.4); }
.ik-lb-b:disabled { opacity:.5; cursor:default; }
.ik-lb-x { position:absolute; top:14px; right:14px; width:40px; height:40px; border-radius:50%; border:none; background:rgba(255,255,255,.15); color:#fff; font-size:20px; cursor:pointer; }

/* Perubahan #47: bar owner di app manager / kasir */
#owner-bar { position:sticky; top:0; z-index:120; display:flex; align-items:center; gap:6px; padding:6px 10px; background:#0f172a; color:#e2e8f0; font-size:11.5px; font-family:inherit; }
#owner-bar .ob-l { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#owner-bar .ob-l i { color:#fbbf24; margin-right:3px; }
#owner-bar .ob-b { border:none; font-family:inherit; font-size:11px; font-weight:700; padding:5px 9px; border-radius:9px; background:rgba(255,255,255,.12); color:#fff; cursor:pointer; text-decoration:none; white-space:nowrap; }
.ob-sheet-bg { position:fixed; inset:0; z-index:9998; background:rgba(15,23,42,.5); display:flex; align-items:flex-end; justify-content:center; }
.ob-sheet { width:100%; max-width:480px; background:#fff; border-radius:22px 22px 0 0; padding:16px 16px 22px; font-family:inherit; }
.ob-t { font-weight:800; font-size:16px; margin-bottom:10px; color:#0f172a; }
.ob-c { width:100%; display:flex; align-items:center; gap:10px; border:1px solid #e2e8f0; background:#f8fafc; border-radius:14px; padding:12px 14px; margin-bottom:8px; font-family:inherit; font-size:13px; cursor:pointer; text-align:left; color:#0f172a; }
.ob-c b { color:#1d4ed8; } .ob-c span { flex:1; } .ob-c.on { border-color:#2563eb; background:#eff6ff; } .ob-c i { color:#2563eb; }
.ob-x { width:100%; border:none; background:#f1f5f9; border-radius:12px; padding:11px; font-family:inherit; font-weight:700; cursor:pointer; margin-top:4px; }

/* Perubahan #51: panel bawah customer ringkas -- chip item + [estimasi | metode | Pesan] */
.ik-chips { display:flex; gap:6px; overflow-x:auto; padding:2px 2px 8px; scrollbar-width:none; }
.ik-chips::-webkit-scrollbar { display:none; }
.ik-chips:empty { display:none; }
.ik-chip { flex:0 0 auto; display:inline-flex; align-items:center; gap:4px; border-radius:99px; padding:3px 9px 3px 3px; background:#fff; font-size:11px; font-weight:700; color:#334155; box-shadow:0 1px 3px rgba(0,0,0,.08); white-space:nowrap; }
.ik-chip > i { width:20px; height:20px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-size:10px; font-style:normal; overflow:hidden; }
.ik-chip > i.f img { width:100%; height:100%; object-fit:cover; }
.ik-row1 { display:flex; align-items:center; gap:8px; border-top:1px dashed #cbd5e1; padding-top:8px; }
.ik-row1 .t { flex:0 1 auto; min-width:0; }
.ik-row1 .t small { font-size:10px; color:#64748b; display:block; }
.ik-row1 .t b { font-size:17px; color:#1d4ed8; white-space:nowrap; }
.ik-row1 .ik-hemat { font-size:9.5px; }
.ik-met2 { flex:1; display:flex; gap:4px; justify-content:center; }
.ik-met2 div { width:44px; flex:0 0 44px; border-radius:11px; text-align:center; padding:5px 0 4px; font-size:9px; font-weight:800; color:#1e3a8a; cursor:pointer; background:var(--tk3-bg,#e9eef6); box-shadow:2px 2px 5px rgba(163,177,198,.5),-2px -2px 5px #fff; }
.ik-met2 div i { display:block; font-size:13px; margin-bottom:1px; }
.ik-met2 div.sel { box-shadow:inset 2px 2px 5px rgba(163,177,198,.6),inset -2px -2px 5px #fff; color:#1d4ed8; }
.ik-met2 div.dis { opacity:.45; cursor:not-allowed; }
.ik-row1 button { flex:0 0 auto; border:none; border-radius:14px; padding:11px 16px; color:#fff; font-weight:800; font-size:14px; background:linear-gradient(135deg,#3b82f6,#1d4ed8); box-shadow:0 6px 14px rgba(29,78,216,.35); font-family:inherit; }

/* Perubahan #54 -- ikon 3D kecil untuk kartu dashboard kasir */
  .ik-mini{position:relative;width:38px;height:38px;border-radius:12px;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;transform:perspective(200px) rotateX(8deg);text-shadow:0 2px 3px rgba(0,0,0,.25)}
  .ik-mini::before{content:'';position:absolute;inset:2px 2px auto 2px;height:45%;border-radius:10px 10px 18px 18px;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0))}
  .ik-mini i{position:relative;z-index:1}
  .ik-mini.g-cuci,.ik-mini.g-kering,.ik-mini.g-lipat,.ik-mini.g-setrika,.ik-mini.g-antar,.ik-mini.g-aj,.ik-mini.g-berat,.ik-mini.g-sabun,.ik-mini.g-teh,.ik-mini.g-mie{box-shadow:0 5px 10px rgba(15,23,42,.22),inset 0 -4px 6px rgba(0,0,0,.18)}

/* Perubahan #56 -- kartu mesin dashboard (kasir, manager, owner) satu gaya:
   kotak ikon timbul berwarna sesuai status. */
  .mz-ico{width:34px;height:34px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;margin:0 auto 5px;
    box-shadow:inset 2px 2px 5px rgba(163,177,198,.45),inset -2px -2px 5px rgba(255,255,255,.9)}
  .mz-run{background:linear-gradient(145deg,#fecaca,#fff1f2);color:#dc2626}
  .mz-idle{background:linear-gradient(145deg,#bbf7d0,#ecfdf5);color:#16a34a}
  .mz-alloc{background:linear-gradient(145deg,#fde68a,#fffbeb);color:#d97706}
  .mz-maint,.mz-off{background:linear-gradient(145deg,#e2e8f0,#f8fafc);color:#94a3b8}
  .mz-dep{background:linear-gradient(145deg,#cbd5e1,#f1f5f9);color:#94a3b8}
  .mz-grid{display:grid;gap:6px;grid-template-columns:repeat(var(--mz-kol,4),minmax(0,1fr))}
  .mz-card{min-width:0;background:var(--tk3-bg,#fff);border-radius:13px;padding:8px 3px 7px;text-align:center;display:flex;flex-direction:column;align-items:center;
    box-shadow:var(--tk3-shadow-out-sm,0 1px 4px rgba(0,0,0,.08));box-sizing:border-box}
  .mz-kode{font-size:12px;font-weight:800;color:var(--tk3-ink,#0f172a);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25}
  .mz-sub{font-size:9.5px;color:var(--tk3-ink-soft,#64748b);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.35}
  .mz-bdg{display:inline-block;max-width:100%;font-size:9px;font-weight:800;border-radius:6px;padding:1px 6px;margin:2px 0 1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mz-bdg.mz-run,.mz-bdg.mz-idle,.mz-bdg.mz-alloc,.mz-bdg.mz-maint,.mz-bdg.mz-off{box-shadow:none}
  .mz-bdg.mz-run{background:#fee2e2}.mz-bdg.mz-idle{background:#dcfce7}.mz-bdg.mz-alloc{background:#fef3c7;color:#b45309}.mz-bdg.mz-maint,.mz-bdg.mz-off{background:#f1f5f9;color:#64748b}