/* posta.oltreloscatto.org - current Area design system (insieme.oltreloscatto.org,
   checked 2026-10-15 against its live components, NOT its unused legacy tokens such
   as --shadow-sticker/--border-strong/--accent): paper page #FBF7F0, white Panel card
   (1px #E8DFCF, radius 18px, soft shadow), ink pill buttons, rb-blue focus ring.
   Injected by pxy (sub_filter on </head>). Area has no dark theme: dark mode keeps
   Bulwark's own tokens and only inverts the ink button. Login rules are scoped to
   Bulwark's login wrapper (.min-h-screen.bg-gradient-to-br) - re-check on upgrades. */
:root { --color-primary: #141414; --color-primary-foreground: #FBF7F0; --color-ring: #3B76C9;
        --ols-page: #FBF7F0; --ols-card: #FFFFFF; --ols-card-border: #E8DFCF;
        --ols-card-shadow: 0 6px 20px #2E2B280D; }
.dark { --color-primary: #FBF7F0; --color-primary-foreground: #141414; --color-ring: #3B76C9;
        --ols-page: var(--color-background); --ols-card: var(--color-background);
        --ols-card-border: var(--color-border); --ols-card-shadow: none; }

.min-h-screen.bg-gradient-to-br { background: var(--ols-page) !important; }
.min-h-screen.bg-gradient-to-br .rounded-2xl {
  background: var(--ols-card) !important;
  border: 1px solid var(--ols-card-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--ols-card-shadow) !important;
  backdrop-filter: none !important;
}
/* Area buttons are pills */
.min-h-screen.bg-gradient-to-br button.bg-primary,
.min-h-screen.bg-gradient-to-br button[type="submit"] { border-radius: 999px !important; box-shadow: none !important; }

/* Login logo: Bulwark sizes it for a square mark, our wordmark is 5:1. Only
   this host sets these URLs, so the selector can't touch other tenants. */
div:has(> img[src^="/_webmail/logo-"]) { width: 100% !important; height: auto !important; }
img[src^="/_webmail/logo-"] { width: min(340px, 100%) !important; height: auto !important;
                              max-width: none !important; max-height: none !important; }

/* ---- App tweaks (all pages) - re-check on upgrades. Hooks: data-testid +
   Bulwark's sidebar classes. ---- */

/* Bulwark ships `*{border-color:var(--color-border)}` OUTSIDE any cascade layer,
   so it beats every Tailwind border-colour utility (all in @layer utilities):
   folder rows' border-transparent / border-primary all render grey. Move it
   into @layer base and revert the unlayered copy, so utilities win again. */
@layer base { * { border-color: var(--color-border); } }
* { border-color: revert-layer; }

/* Darker sidebar (folder pane + icon rail). One knob: the mix percentage. */
:root { --site-sidebar-bg: color-mix(in oklab, var(--color-secondary) 96%, black); }
.dark { --site-sidebar-bg: color-mix(in oklab, var(--color-secondary) 80%, black); }
.bg-secondary.border-e.h-full,
.w-14.bg-secondary { background-color: var(--site-sidebar-bg) !important; }

/* No separators between messages in the mail list (single rows, and the
   wrapper Bulwark puts around a threaded conversation). */
[data-testid="email-list-item"],
[data-index] > .border-b:has(> [data-unread]) { border-bottom-width: 0; }

/* No vertical borders around the sidebar (rail + folder pane): the darker
   sidebar background alone separates it from the message list. */
.bg-secondary.border-e.h-full,
.w-14.bg-secondary { border-inline-end-width: 0 !important; border-right-width: 0 !important; }
