/* Admin presentation only. Storefront styles and saved theme settings are untouched. */
@media screen {
  .admin-shell {
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    color: #1e293b;
    background: #f4f6fa;
  }
  .admin-workspace { flex: 1; height: auto; min-height: 0; min-width: 0; }
  .admin-sidebar { flex-shrink: 0; min-height: 0; overflow: hidden; }
  .admin-main { min-width: 0; min-height: 0; overscroll-behavior-y: contain; scrollbar-gutter: stable; background: #f4f6fa; }
  .admin-content { padding: 24px; }
  .admin-page { padding: 20px; min-height: calc(100dvh - 48px); border: 1px solid #e3e8ef; border-radius: 16px; background: #fff; box-shadow: 0 2px 8px #182b4905; }
  .admin-page > * { min-width: 0; max-width: 100%; }
  .admin-page > [class*="px-"] { padding-left: 0; padding-right: 0; }
  .admin-brand { flex-shrink: 0; min-height: 76px; padding: 16px 12px; }
  .admin-nav { min-height: 0; overscroll-behavior: contain; scrollbar-width: thin; padding: 12px 10px; }
  .admin-nav-link, .admin-nav-group { min-height: 42px; border-radius: 10px; }
  .admin-nav-submenu { margin-left: 16px; padding-left: 10px; }
  .admin-nav-submenu .admin-nav-link { font-size: 13px; line-height: 1.4; }
  .admin-sidebar-footer { flex-shrink: 0; padding-bottom: max(10px, env(safe-area-inset-bottom)); }
  .admin-sidebar-footer :is(a,button) { min-height: 42px; }
  .admin-shell :is(button,a,input,select,textarea):focus-visible { outline: 2px solid #7c3aed; outline-offset: 3px; }
  .admin-page :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="color"]),select,[role="combobox"]) { min-height: 40px; max-width: 100%; }
  .admin-page :is(input,select,textarea) { scroll-margin-block: 20px; }
  .admin-page [role="tablist"] { display: flex; justify-content: flex-start; overflow-x: auto; height: auto; min-height: 44px; max-width: 100%; gap: 4px; padding: 4px; scrollbar-width: thin; }
  .admin-page [role="tab"] { flex: 1 0 auto; min-height: 36px; white-space: nowrap; padding-inline: 14px; }
  /* Keep existing mobile card variants; only contain the desktop tables. */
  .admin-page :is(div,section):has(> table) { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: auto; }
  .admin-page table:not([class*="min-w-"]) { min-width: 680px; }
  .admin-page table :is(th,td) { padding-top: 12px; padding-bottom: 12px; }
  .admin-page table thead { background: #f6f8fb; }
  .admin-page table tbody tr:hover { background-color: #f8faff; }
  .admin-topbar { display: none; }
  .admin-sidebar { display: flex; }
  .admin-drawer, .admin-drawer-backdrop { display: none; }
  .admin-mobile-bottom { display: none; }

  @media (max-width: 1279px) {
    .admin-content { padding: 16px; }
    .admin-page { padding: 16px; min-height: calc(100dvh - 32px); }
  }
  @media (max-width: 1023px) {
    .admin-sidebar { display: none; }
    .admin-topbar { display: flex; position: relative; flex-shrink: 0; height: 60px; padding-inline: 12px; padding-top: env(safe-area-inset-top); box-sizing: content-box; }
    .admin-topbar :is(button,a) { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; }
    .admin-drawer-backdrop { display: block; }
    .admin-drawer { display: flex; width: min(86vw, 320px); max-width: 320px; height: 100dvh; padding-top: env(safe-area-inset-top); }
    .admin-drawer .admin-nav-link, .admin-drawer .admin-nav-group { min-height: 46px; }
    .admin-drawer .admin-nav-submenu .admin-nav-link { font-size: 14px; }
    .admin-page { min-height: calc(100dvh - 92px); }
  }
  @media (max-width: 639px) {
    .admin-content { padding: 10px 8px max(16px, env(safe-area-inset-bottom)); }
    .admin-page { padding: 12px; border-radius: 12px; min-height: calc(100dvh - 86px); }
    .admin-page h1 { font-size: 23px; line-height: 1.3; }
    .admin-page :is(h2,h3) { overflow-wrap: anywhere; }
    .admin-page button:not([role="checkbox"]):not([role="switch"]):not([role="radio"]) { min-height: 44px; }
    .admin-page :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="color"]),select,textarea,[role="combobox"]) { min-height: 44px; font-size: 16px; }
    .admin-page label { line-height: 1.5; }
    .admin-page [role="tablist"] { border-radius: 8px; }
    .admin-page :is(.grid,.flex) > * { min-width: 0; }
    .admin-page > div > .flex:has(> h1), .admin-page > div > .flex:has(> h2) { flex-wrap: wrap; gap: 12px; }
    .admin-page .grid[class~="grid-cols-2"]:has(> div > input),
    .admin-page .grid[class~="grid-cols-2"]:has(> div > textarea),
    .admin-page .grid[class~="grid-cols-2"]:has(> div > select) { grid-template-columns: minmax(0,1fr); }
    .admin-page .grid[class~="grid-cols-2"]:has(> div > input) > *,
    .admin-page .grid[class~="grid-cols-2"]:has(> div > textarea) > *,
    .admin-page .grid[class~="grid-cols-2"]:has(> div > select) > * { grid-column: auto; }
    /* Portalled Radix dialogs stay reachable above the phone keyboard. */
    html:has(.admin-shell) [role="dialog"][data-state="open"] { max-width: calc(100vw - 24px); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 18px; }
    html:has(.admin-shell) [role="menu"], html:has(.admin-shell) [role="listbox"] { max-width: calc(100vw - 24px); }
  }
}

/* Phone/tablet navigation: reserved bottom space, swipeable tabs and a menu sheet.
   Desktop rules above remain unchanged. */
@media screen and (max-width: 1023px) {
  .admin-topbar { display: none; }
  .admin-mobile-bottom {
    display: block;
    flex-shrink: 0;
    position: relative;
    z-index: 40;
    padding: 8px 10px max(8px, env(safe-area-inset-bottom));
    border-top: 1px solid #e4e4e7;
    background: #fff;
    box-shadow: 0 -4px 16px #0f172a08;
  }
  .admin-mobile-bottom-track {
    display: flex;
    gap: 4px;
    padding: 4px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
    scrollbar-color: #d4d4d8 transparent;
    border-radius: 14px;
    background: #f4f4f5;
  }
  .admin-bottom-link, .admin-bottom-menu {
    flex: 1 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 48px;
    padding: 10px 14px;
    border-radius: 11px;
    color: #71717a;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    text-decoration: none;
  }
  .admin-mobile-bottom svg { width: 17px; height: 17px; flex-shrink: 0; }
  .admin-bottom-link[aria-current="page"], .admin-bottom-menu[data-active="true"], .admin-bottom-menu[aria-expanded="true"] {
    color: #18181b;
    background: #fff;
    box-shadow: 0 1px 4px #18181b10;
  }
  .admin-bottom-link[aria-disabled="true"] { opacity: .5; }
  .admin-bottom-menu { position: sticky; right: -4px; background: #f4f4f5; box-shadow: -5px 0 8px #f4f4f5; }
  .admin-page { min-height: calc(100dvh - 110px); }
  .admin-drawer {
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    max-width: none;
    height: min(82dvh, 720px);
    padding-top: 0;
    border-radius: 22px 22px 0 0;
    overflow: hidden;
  }
  .admin-drawer .admin-brand { min-height: 64px; padding: 12px 18px; }
  .admin-drawer .admin-nav { padding-inline: 14px; }
  .admin-drawer .admin-sidebar-footer { display: flex; gap: 8px; padding-inline: 14px; }
  .admin-drawer .admin-sidebar-footer > * { flex: 1; width: auto; margin-top: 0; }
}