/* Appended to every page of this static admin snapshot.
 *
 * The snapshot is the real Filament HTML with every script removed, so anything
 * Alpine or Livewire would have done at click time is gone. This file does the
 * three things that are left to do statically:
 *   1. make it obvious the page is a read-only preview (the note);
 *   2. give phones a way between pages (the strip), because the sidebar is an
 *      off-canvas drawer below 1024px and the drawer needs JavaScript;
 *   3. stop controls from looking clickable when they do nothing.
 * `[x-cloak]` is deliberately left alone: Filament hides every dropdown, modal
 * and notification drawer with it, and un-hiding it spills them all onto the page.
 */

/* 3 · controls do nothing, so they do not react */
.fi-main button, .fi-main input, .fi-main select, .fi-main textarea, .fi-main label,
.fi-main [role="button"], .fi-main [role="switch"], .fi-main [role="checkbox"],
.fi-topbar button, .fi-topbar input, .fi-topbar [role="button"],
.fi-sidebar button, form { pointer-events: none; }
a[aria-disabled="true"] { pointer-events: none; cursor: default; }
/* the two ways in and out still work: Sign in opens the dashboard, Sign out
   on its welcome band comes back to the sign-in page */
.fi-simple-layout:has(.qh-aside) form,
.fi-simple-layout:has(.qh-aside) form button[type="submit"],
.fi-main .qh-welcome form,
.fi-main .qh-welcome form button { pointer-events: auto; }
.fi-topbar-open-sidebar-btn, .fi-topbar-close-sidebar-btn, .fi-sidebar-close-overlay { display: none !important; }

/* 1 · the note: a floating chip on wide screens, a strip on phones */
.qh-static-note {
  position: fixed; right: 20px; bottom: 20px; z-index: 2147482000; max-width: 360px;
  display: flex; align-items: flex-start; gap: 10px; padding: 12px 16px;
  border-radius: 14px; border: 1px solid rgba(255, 255, 255, .16);
  background: rgba(18, 18, 22, .84); color: #fff;
  font: 500 13px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .30);
}
.qh-static-note b { display: block; font-weight: 700; margin-bottom: 2px; }
.qh-static-note svg { width: 18px; height: 18px; flex: none; margin-top: 1px; opacity: .9; }

/* 2 · the page strip, phones and small tablets only */
.qh-static-nav { display: none; }

@media (max-width: 1023px) {
  .fi-sidebar { display: none !important; }
  .qh-static-note {
    position: static; max-width: none; margin: 0; border-radius: 0; border: 0;
    box-shadow: none; padding: 10px 16px; font-size: 12.5px;
  }
  .qh-static-nav {
    display: flex; gap: 8px; overflow-x: auto; padding: 10px 16px; margin: 0;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    border-bottom: 1px solid rgba(127, 127, 127, .22);
  }
  .qh-static-nav::-webkit-scrollbar { display: none; }
  .qh-static-nav a {
    flex: none; padding: 8px 14px; border-radius: 999px; text-decoration: none; white-space: nowrap;
    font: 600 13px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: inherit; border: 1px solid rgba(127, 127, 127, .30);
  }
  .qh-static-nav a[aria-current="page"] {
    background: var(--primary-600, #2563eb); border-color: transparent; color: #fff;
  }
}
@media print { .qh-static-note, .qh-static-nav { display: none; } }
