/* Compact cloud status: all screen-only styling leaves print output intact. */
@media screen {
  #cloudPrimary { display:flex; align-items:center; gap:8px; position:relative; flex:0 0 auto; font:13px/1.5 Inter,system-ui,sans-serif; color:#152238; }
  #headerDataSafetyBtn { min-height:38px; padding:7px 10px; border:1px solid #879fb9; border-radius:8px; background:#17334f; color:#fff; font:inherit; font-size:12px; font-weight:600; white-space:nowrap; cursor:pointer; }
  #headerDataSafetyBtn:hover { background:#244966; border-color:#c0d5eb; }
  #headerDataSafetyBtn:focus-visible { outline:3px solid #8fb8ff; outline-offset:3px; }
  #cloudPrimary[data-floating="true"] #headerDataSafetyBtn { display:none; }
  #cloudPrimary[data-floating="true"] { position:fixed; top:14px; right:24px; z-index:10000; }
  #cloudPrimaryToggle { display:flex; align-items:center; gap:8px; min-height:40px; padding:8px 13px; border:1px solid #bc7d12; border-radius:999px; background:#fff3d4; color:#674609; font:inherit; font-weight:750; white-space:nowrap; box-shadow:0 5px 18px rgba(13,34,59,.1); cursor:pointer; }
  #cloudPrimary[data-state="saved"] #cloudPrimaryToggle { background:#e6f5ea; color:#21663c; border-color:#75a987; }
  #cloudPrimary[data-state="error"] #cloudPrimaryToggle { background:#fdecec; color:#a52c23; border-color:#cf8d88; }
  #cloudPrimaryToggle:focus-visible, #cloudPrimaryPanel button:focus-visible { outline:3px solid #8fb8ff; outline-offset:3px; }
  #cloudPrimaryPanel { position:absolute; right:0; top:calc(100% + 12px); width:356px; max-width:calc(100vw - 28px); box-sizing:border-box; padding:22px; background:#fff; border:1px solid #dbe3ee; border-radius:18px; box-shadow:0 24px 60px rgba(13,34,59,.18); z-index:10001; max-height:calc(100dvh - 95px); overflow:auto; }
  #cloudPrimaryPanel[hidden] { display:none; }
  .cloud-panel-heading { display:flex; align-items:center; gap:9px; margin-bottom:14px; color:#0d223b; font-size:14px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
  .cloud-panel-heading small { margin-left:auto; padding:4px 7px; border-radius:999px; background:#fdecec; color:#b42318; font-size:9px; letter-spacing:.08em; }
  .cloud-panel-activity { width:9px; height:9px; border-radius:50%; background:#155eef; box-shadow:0 0 0 5px #e8f0ff; }
  #cloudPrimaryText { display:block; padding:13px 14px; border:1px solid #e7edf5; border-radius:11px; background:#f8fafc; color:#26384d; font-size:13px; line-height:1.45; }
  #cloudPrimaryPanel p { display:block !important; margin:11px 2px 16px; font-size:12px; line-height:1.5; color:#68778a; }
  #cloudPrimaryPanel button { display:flex; align-items:center; gap:10px; width:100%; min-height:44px; margin:9px 0 0; padding:10px 13px; border:1px solid #d0d8e5; border-radius:10px; background:#fff; color:#152238; text-align:left; font:inherit; font-weight:700; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease,background .16s ease; }
  #cloudPrimaryPanel button:hover:not(:disabled) { transform:translateY(-1px); box-shadow:0 5px 15px rgba(13,34,59,.08); background:#f8fafc; }
  #cloudPrimaryPanel button > span:last-child { flex:1; }
  #cloudPrimaryRetry > span:last-child { flex:0; margin-left:auto; font-size:19px; }
  #cloudPrimary[data-state="error"] #cloudPrimaryRetry { background:#b42318; color:#fff; border-color:#b42318; }
  #cloudPrimaryPanel button:disabled { opacity:.5; cursor:not-allowed; }
  #cloudPrimaryAccount { margin-top:14px; padding-top:12px; border-top:1px solid #dbe3ee; }
  #cloudPrimaryAccount .cloud-controls { display:block; color:#526277; }
  #cloudPrimaryAccount .cloud-controls [hidden] { display:none !important; }
  #cloudPrimaryAccount #supabaseStatus { display:block; border:0; background:none; color:#526277; font-size:12px; white-space:normal; overflow-wrap:anywhere; padding:0; }
  #cloudPrimaryAccount #lastCloudSyncText, #backupTimer { display:none !important; }
  #cloudPrimaryAccount #manualCloudSyncBtn, #cloudPrimaryAccount #retryCloudSyncBtn { display:none !important; }
  .cloud-panel-tip { display:grid; gap:3px; margin-top:15px; padding:13px 14px; border-radius:11px; background:#155eef; color:#fff; }
  .cloud-panel-tip strong { font-size:12px; text-transform:uppercase; letter-spacing:.07em; }
  .cloud-panel-tip span { color:#dbe8ff; font-size:11px; line-height:1.4; }
  .topbar-tools { flex-wrap:nowrap; }
  .bulk-order-excel-modal { z-index:10002; }
  .home-orders-table td:has(> .home-pickup-badge) { position:relative; padding-right:78px; }
  .home-orders-table td > .home-pickup-badge { position:absolute; right:8px; top:50%; transform:translateY(-50%); margin:0; }

}
@media screen and (max-width:1000px) and (min-width:761px) {
  .topbar { grid-template-columns: minmax(160px,1fr) auto !important; }
  .topbar-navigation { grid-column:1 / -1; grid-row:2; min-height:44px; justify-content:center; }
  .topbar-tools { grid-column:2; grid-row:1; }
}
@media screen and (max-width:600px) {
  .topbar-tools { gap:6px; }
  .topbar .header-version-avatar, .topbar #notificationBtn { display:none !important; }
  #cloudPrimaryToggle { padding:6px 9px; font-size:12px; }
  .topbar-brand { min-width:0; gap:7px; }
  .topbar h1 { font-size:16px !important; }
}
#cloudGate { position:fixed; inset:0; z-index:9000; overflow:auto; background:radial-gradient(circle at 48% 42%,#fff 0,#f5f8fc 38%,#eef3f8 100%); color:#0d223b; }
#cloudGate[hidden] { display:none; }
.cloud-login-modal { z-index:11000; }
.cloud-gate-shell { min-height:100%; display:grid; grid-template-rows:68px 1fr auto; font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif; }
.cloud-gate-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 32px; background:#0d223b; color:#fff; box-shadow:0 5px 24px rgba(13,34,59,.15); }
.cloud-gate-brand { display:flex; align-items:center; gap:12px; font-size:19px; letter-spacing:-.02em; }
.cloud-gate-mark { display:grid; align-content:center; gap:3px; width:34px; height:34px; padding:7px; box-sizing:border-box; border-radius:9px; background:rgba(255,255,255,.1); }
.cloud-gate-mark i { display:block; height:2px; border-radius:2px; background:#fff; }
.cloud-gate-mark i:nth-child(2) { width:75%; }
.cloud-gate-secure { margin-right:210px; color:#b9c9dc; font-size:12px; font-weight:650; letter-spacing:.08em; text-transform:uppercase; }
.cloud-gate-main { display:grid; place-items:center; padding:72px 410px 50px 30px; }
#cloudGate section { width:min(480px,90vw); box-sizing:border-box; padding:46px; background:#fff; border:1px solid #dfe7f1; border-radius:22px; box-shadow:0 22px 60px rgba(13,34,59,.12); font:16px/1.55 Inter,ui-sans-serif,system-ui,sans-serif; text-align:center; }
.cloud-gate-shield { display:grid; place-items:center; width:66px; height:66px; margin:0 auto 20px; border-radius:19px; background:#eaf2ff; color:#155eef; font-size:29px; font-weight:900; box-shadow:inset 0 0 0 1px #d8e7ff; }
.cloud-gate-eyebrow { display:block; margin-bottom:7px; color:#155eef; font-size:11px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
#cloudGate h1 { margin:0; color:#0d223b; font-size:30px; line-height:1.18; letter-spacing:-.035em; }
#cloudGate p { min-height:48px; margin:14px 0 23px; color:#607086; font-size:14px; line-height:1.6; }
#cloudGate button { margin:9px 0 0; }
#cloudGateLogin { display:flex; align-items:center; justify-content:center; gap:12px; width:100%; min-height:50px; padding:12px 18px; border:0; border-radius:12px; background:#155eef; color:#fff; font:inherit; font-weight:800; box-shadow:0 10px 24px rgba(21,94,239,.23); cursor:pointer; transition:transform .16s ease,background .16s ease,box-shadow .16s ease; }
#cloudGateLogin:hover,#cloudGateLogin:focus-visible { background:#0b4fd7; transform:translateY(-1px); box-shadow:0 13px 28px rgba(21,94,239,.3); }
#cloudGateExportEarlier,#cloudGateContinueTest { width:100%; min-height:46px; padding:10px 14px; border:1px solid #cdd8e6; border-radius:10px; background:#fff; color:#233951; font:inherit; font-weight:700; }
.cloud-gate-encryption { display:block; margin-top:16px; color:#8a98a9; font-size:11px; font-weight:650; letter-spacing:.04em; }
.cloud-gate-encryption span { color:#21a366; }
.cloud-gate-shell > footer { padding:22px; color:#8795a7; font-size:10px; font-weight:800; letter-spacing:.2em; text-align:center; }
@media screen and (max-width:900px) {
  .cloud-gate-secure { margin-right:0; }
  .cloud-gate-main { padding:95px 22px 40px; }
  #cloudPrimary[data-floating="true"] { top:78px; right:16px; }
}
@media screen and (max-width:600px) {
  .cloud-gate-header { padding:0 18px; }
  .cloud-gate-secure { display:none; }
  #cloudGate section { padding:34px 24px; }
  #cloudGate h1 { font-size:25px; }
  #cloudPrimaryPanel { width:min(356px,calc(100vw - 24px)); }
}
@media screen {
  .topbar { top:var(--cloud-status-height, 0px) !important; }
}
@media screen and (min-width:761px) {
  #currentOrderBanner:not([hidden]) {
    top:calc(var(--cloud-status-height, 0px) + var(--order-topbar-height, 72px)) !important;
  }
  .tabs:not(.report-hidden) {
    top:calc(var(--cloud-status-height, 0px) + var(--order-topbar-height, 72px) + var(--order-banner-height, 62px)) !important;
  }
  .order-workflow-active .topbar {
    inset:var(--cloud-status-height, 0px) 0 auto 0 !important;
    margin:0 !important;
  }
  .order-workflow-active #currentOrderBanner:not([hidden]) {
    inset:calc(var(--cloud-status-height, 0px) + var(--order-topbar-height, 72px)) 0 auto 0 !important;
  }
  .order-workflow-active .tabs:not(.report-hidden) {
    inset:calc(var(--cloud-status-height, 0px) + var(--order-topbar-height, 72px) + var(--order-banner-height, 62px)) 0 auto 0 !important;
  }
  .sidebar {
    top:calc(var(--cloud-status-height, 0px) + 84px) !important;
    max-height:calc(100vh - var(--cloud-status-height, 0px) - 100px) !important;
  }
}
@media print { #cloudPrimary, #cloudGate { display:none!important; } }
