@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=Nunito:wght@400;500;600;700;800&display=swap');
body { margin:0; background:#e9f1fb; }
button, input[type="checkbox"] { cursor:pointer; }
#instagroup-warehouse-demo {
  color-scheme: light;
  --ig-bg: #e9f1fb;
  --ig-card: #fff;
  --ig-primary: #2563eb;
  --ig-glow: rgba(37,99,235,.14);
  --ig-text: #0f2340;
  --ig-muted: #5b7089;
  --ig-border: rgba(15,35,64,.10);
  --ig-fill: #eef4fc;
  --ig-radius: 28px 20px 30px 18px;
  --ig-small-radius: 16px 12px 18px 12px;
  --ig-body: 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --ig-display: 'Fraunces', Georgia, serif;
  display:grid; grid-template-columns:200px minmax(0,1fr);
  color:var(--ig-text); font:14px/1.5 var(--ig-body);
  background-color:var(--ig-bg);
  background-image:radial-gradient(at 8% 0%,rgba(37,99,235,.10),transparent 45%),radial-gradient(at 100% 12%,rgba(14,165,233,.10),transparent 50%);
  width:100%; min-height:100vh;
}
#instagroup-warehouse-demo * { box-sizing:border-box; }
#instagroup-warehouse-demo [hidden] { display:none !important; }
#instagroup-warehouse-demo h1, #instagroup-warehouse-demo h2, #instagroup-warehouse-demo p { margin:0; }
#instagroup-warehouse-demo h1, #instagroup-warehouse-demo h2 { font-family:var(--ig-display); font-weight:600; color:var(--ig-text); }
#instagroup-warehouse-demo h1 { font-size:28px; line-height:1.25; }
#instagroup-warehouse-demo h2 { font-size:21px; line-height:1.3; }
#instagroup-warehouse-demo button, #instagroup-warehouse-demo input, #instagroup-warehouse-demo select { font:inherit; }
#instagroup-warehouse-demo button { cursor:var(--cursor-interaction, pointer); }
#instagroup-warehouse-demo button:disabled { cursor:not-allowed; opacity:.45; }
#instagroup-warehouse-demo svg { height:17px; width:17px; flex-shrink:0; }
#instagroup-warehouse-demo .ig-side { padding:24px 18px; display:flex; flex-direction:column; background:var(--ig-card); background-image:radial-gradient(at 90% 100%,rgba(37,99,235,.06),transparent 55%); border-right:1px solid var(--ig-border); border-radius:0 40px 40px 0; box-shadow:0 14px 34px rgba(15,35,64,.10); }
#instagroup-warehouse-demo .ig-logo { display:block; width:144px; max-width:100%; height:auto; margin:0 auto 28px; }
#instagroup-warehouse-demo .ig-nav { display:flex; align-items:center; gap:10px; padding:12px 16px; border-radius:999px; background:linear-gradient(135deg,var(--ig-primary),#1d4ed8); color:white; box-shadow:0 4px 14px var(--ig-glow); font-weight:700; }
#instagroup-warehouse-demo .ig-side-account { margin-top:auto; padding:38px 10px 0; display:flex; gap:10px; align-items:center; }
#instagroup-warehouse-demo .ig-avatar { background:var(--ig-fill); color:var(--ig-primary); width:33px; height:33px; border-radius:50%; display:grid; place-items:center; font-weight:800; font-size:12px; }
#instagroup-warehouse-demo .ig-side-account strong { display:block; font-size:13px; font-weight:800; }
#instagroup-warehouse-demo .ig-side-account span:last-child { display:block; font-size:11px; color:var(--ig-muted); }
#instagroup-warehouse-demo .ig-main { padding:24px 28px; min-width:0; width:100%; max-width:1280px; margin-inline:auto; }
#instagroup-warehouse-demo .ig-header { display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:18px; }
#instagroup-warehouse-demo .ig-example { font-size:11px; font-weight:800; color:var(--ig-primary); background:var(--ig-glow); border-radius:999px; padding:6px 11px; white-space:nowrap; }
#instagroup-warehouse-demo .ig-box { padding:18px 20px; background:var(--ig-card); border:1px solid var(--ig-border); border-radius:var(--ig-radius); box-shadow:0 6px 16px rgba(15,35,64,.07); }
#instagroup-warehouse-demo .ig-box + .ig-box { margin-top:16px; }
#instagroup-warehouse-demo .ig-box-head { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:14px; }
#instagroup-warehouse-demo .ig-fields { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
#instagroup-warehouse-demo .ig-field { display:block; min-width:0; }
#instagroup-warehouse-demo .ig-field.ig-half { grid-column:span 2; }
#instagroup-warehouse-demo .ig-field > span { display:block; margin-bottom:7px; font-size:11px; font-weight:800; letter-spacing:.55px; text-transform:uppercase; color:var(--ig-muted); }
#instagroup-warehouse-demo .ig-field input, #instagroup-warehouse-demo .ig-field select { width:100%; min-width:0; padding:9px 12px; color:var(--ig-text); border:1px solid var(--ig-border); border-radius:var(--ig-small-radius); background:var(--ig-fill); font-size:14px; min-height:42px; }
#instagroup-warehouse-demo .ig-field input::placeholder { color:var(--ig-muted); opacity:.8; }
#instagroup-warehouse-demo #ig-tracking { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:13px; }
#instagroup-warehouse-demo .ig-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:10px; margin-top:14px; }
#instagroup-warehouse-demo .ig-button { display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:10px 19px; border:0; border-radius:999px; font-size:13px; font-weight:800; background:var(--ig-primary); color:#fff; box-shadow:0 4px 14px var(--ig-glow); }
#instagroup-warehouse-demo .ig-button:hover { filter:brightness(.97); }
#instagroup-warehouse-demo .ig-secondary { color:var(--ig-muted); background:var(--ig-fill); box-shadow:none; border:1px solid var(--ig-border); }
#instagroup-warehouse-demo .ig-sample { margin-right:auto; }
#instagroup-warehouse-demo .ig-tabs { display:flex; gap:6px; flex-wrap:wrap; }
#instagroup-warehouse-demo .ig-tabs button { border:1px solid var(--ig-border); border-radius:999px; background:var(--ig-card); color:var(--ig-muted); padding:7px 13px; font-weight:800; font-size:12px; }
#instagroup-warehouse-demo .ig-tabs button[aria-selected="true"] { background:var(--ig-primary); color:#fff; border-color:var(--ig-primary); }
#instagroup-warehouse-demo .ig-table-wrap { max-width:100%; overflow-x:auto; }
#instagroup-warehouse-demo table { border-collapse:collapse; width:100%; text-align:left; }
#instagroup-warehouse-demo th { border-bottom:2px solid var(--ig-border); padding:0 9px 12px; color:var(--ig-muted); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.45px; white-space:nowrap; }
#instagroup-warehouse-demo td { border-bottom:1px solid var(--ig-border); padding:11px 9px; font-size:14px; color:var(--ig-text); background:#fff; }
#instagroup-warehouse-demo tr:last-child td { border-bottom:0; }
#instagroup-warehouse-demo th:first-child, #instagroup-warehouse-demo td:first-child { padding-left:0; }
#instagroup-warehouse-demo th:last-child, #instagroup-warehouse-demo td:last-child { padding-right:0; }
#instagroup-warehouse-demo .ig-number { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
#instagroup-warehouse-demo .ig-code { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:11px; white-space:nowrap; color:var(--ig-muted); }
#instagroup-warehouse-demo .ig-mobile-code { display:none; }
#instagroup-warehouse-demo input[type="checkbox"] { accent-color:var(--ig-primary); width:16px; height:16px; margin:0; vertical-align:middle; }
#instagroup-warehouse-demo .ig-table-actions { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; border-top:1px solid var(--ig-border); padding-top:12px; margin-top:4px; }
#instagroup-warehouse-demo .ig-hint { font-size:12px; color:var(--ig-muted); }
#instagroup-warehouse-demo .ig-selection-needed #ig-selection { position:relative; isolation:isolate; color:#173c83; border-radius:8px; padding:10px 12px; font-weight:800; }
#instagroup-warehouse-demo .ig-selection-needed #ig-selection::before { content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; background:linear-gradient(110deg,#93c5fd,#c4b5fd,#67e8f9); box-shadow:0 0 16px #818cf866; pointer-events:none; animation:ig-selection-glow 1.8s ease-in-out infinite; }
#instagroup-warehouse-demo .ig-selection-needed th:first-child,
#instagroup-warehouse-demo .ig-selection-needed td:first-child { position:relative; }
#instagroup-warehouse-demo .ig-selection-needed th:first-child::before,
#instagroup-warehouse-demo .ig-selection-needed td:first-child::before { content:""; position:absolute; width:32px; height:32px; left:-8px; top:50%; transform:translateY(-50%); border-radius:9px; background:linear-gradient(135deg,#60a5fa,#a78bfa,#22d3ee); box-shadow:0 0 14px #818cf877; pointer-events:none; animation:ig-selection-glow 1.8s ease-in-out infinite; }
#instagroup-warehouse-demo .ig-selection-needed input[type="checkbox"] { position:relative; }
@keyframes ig-selection-glow { 0%,100% { opacity:0; } 50% { opacity:1; } }
@media(prefers-reduced-motion:reduce) {
  #instagroup-warehouse-demo .ig-selection-needed #ig-selection::before,
  #instagroup-warehouse-demo .ig-selection-needed th:first-child::before,
  #instagroup-warehouse-demo .ig-selection-needed td:first-child::before { animation:none; opacity:.65; }
}
#instagroup-warehouse-demo .ig-message { color:#047857; background:#e9f7f0; border-radius:var(--ig-small-radius); padding:11px 15px; margin-bottom:18px; font-size:13px; }
#instagroup-warehouse-demo .ig-message[data-error="true"] { color:#b91c1c; background:#fff1f2; }
#instagroup-warehouse-demo .ig-footer { font-size:11px; color:var(--ig-muted); padding-top:17px; text-align:right; }
#instagroup-warehouse-demo .ig-status { padding:4px 9px; display:inline-block; border-radius:999px; font-size:11px; font-weight:800; background:var(--ig-fill); color:var(--ig-muted); white-space:nowrap; }
#instagroup-warehouse-demo .ig-shipment-form { padding:17px; border-radius:var(--ig-small-radius); background:var(--ig-fill); border:1px solid var(--ig-border); margin-bottom:18px; }
#instagroup-warehouse-demo .ig-shipment-form .ig-fields { grid-template-columns:1fr 1fr; }
#instagroup-warehouse-demo .ig-shipment-form input { background:var(--ig-card); }
@media(max-width:800px) {
  #instagroup-warehouse-demo { grid-template-columns:165px minmax(0,1fr); }
  #instagroup-warehouse-demo .ig-side { padding:24px 14px; }
  #instagroup-warehouse-demo .ig-main { padding:24px 18px; }
  #instagroup-warehouse-demo .ig-box { padding:19px; }
  #instagroup-warehouse-demo .ig-fields { grid-template-columns:1fr 1fr; gap:14px; }
  #instagroup-warehouse-demo .ig-field.ig-half { grid-column:span 2; }
  #instagroup-warehouse-demo .ig-desktop-code { display:none; }
  #instagroup-warehouse-demo .ig-mobile-code { display:block; margin-top:3px; }
}
@media(max-width:580px) {
  #instagroup-warehouse-demo { grid-template-columns:1fr; }
  #instagroup-warehouse-demo .ig-side { flex-direction:row; align-items:center; gap:15px; padding:15px 19px; border-radius:0 0 28px 18px; }
  #instagroup-warehouse-demo .ig-logo { width:98px; margin:0 auto 0 0; }
  #instagroup-warehouse-demo .ig-nav { display:none; }
  #instagroup-warehouse-demo .ig-side-account { margin:0; padding:0; }
  #instagroup-warehouse-demo .ig-avatar { display:none; }
  #instagroup-warehouse-demo .ig-main { padding:22px 15px; }
  #instagroup-warehouse-demo h1 { font-size:25px; }
  #instagroup-warehouse-demo h2 { font-size:21px; }
  #instagroup-warehouse-demo .ig-box { padding:19px 16px; }
  #instagroup-warehouse-demo .ig-carrier-cell { display:none; }
  #instagroup-warehouse-demo .ig-shipment-form .ig-fields { grid-template-columns:1fr; }
  #instagroup-warehouse-demo .ig-button { padding:10px 15px; font-size:12px; }
  #instagroup-warehouse-demo .ig-example { padding:5px 9px; font-size:10px; }
  #instagroup-warehouse-demo .ig-footer { text-align:center; }
}
@media(pointer:coarse) {
  #instagroup-warehouse-demo .ig-field input, #instagroup-warehouse-demo .ig-field select, #instagroup-warehouse-demo #ig-tracking { font-size:16px; min-height:44px; }
  #instagroup-warehouse-demo button { min-height:44px; }
}

#ig-login { max-width:420px; margin:70px auto; padding:28px; background:white; border-radius:24px; font:16px Nunito,sans-serif; color:#0f2340; }
#ig-login label { display:block; margin:16px 0; }
#ig-login input { display:block; width:100%; box-sizing:border-box; padding:12px; margin-top:6px; border:1px solid #ccd7e5; border-radius:10px; font:inherit; }
#ig-login button { padding:12px 20px; border:0; border-radius:20px; background:#2563eb; color:white; font:inherit; }
#ig-login [hidden] { display:none; }
#ig-login-error { color:#b91c1c; }

#instagroup-warehouse-demo[hidden], #ig-login[hidden] { display:none !important; }