/* Netix Digital theme for OneTimeSecret (secrets.netix.digital)
   Injected by nginx (sub_filter) so it survives OneTimeSecret upgrades.
   Tokens mirror netix.digital: Poppins display, Montserrat body, mint accent, near-black ink. */

@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;src:url(/netix-brand/fonts/poppins-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600;font-display:swap;src:url(/netix-brand/fonts/poppins-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:700;font-display:swap;src:url(/netix-brand/fonts/poppins-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:400;font-display:swap;src:url(/netix-brand/fonts/montserrat-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:500;font-display:swap;src:url(/netix-brand/fonts/montserrat-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:700;font-display:swap;src:url(/netix-brand/fonts/montserrat-latin-700-normal.woff2) format("woff2")}

:root{
  /* Netix tokens */
  --nx-ink:#0d1512; --nx-ink-2:#16211c; --nx-ink-3:#1d2b24;
  --nx-fg:#33413b; --nx-fg-muted:#66756e; --nx-fg-subtle:#74837b;
  --nx-bg:#ffffff; --nx-bg-subtle:#fbfbf9; --nx-paper:#f4f2ea;
  --nx-border:#dcded8; --nx-border-subtle:#e6e8e4;
  --nx-mint:#3eeba1; --nx-mint-deep:#17b876; --nx-mint-dark:#0d9e63; --nx-mint-soft:#e3fbf0;
  --nx-r-md:10px; --nx-r-lg:14px; --nx-r-xl:20px;
  --nx-sh-2:0 2px 4px rgba(13,21,18,.04),0 4px 12px rgba(13,21,18,.06);
  --nx-sh-3:0 4px 8px rgba(13,21,18,.04),0 12px 32px rgba(13,21,18,.08);
  --nx-display:"Poppins",ui-sans-serif,system-ui,sans-serif;
  --nx-body:"Montserrat",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;

  /* Re-point the app's own font variables: body uses --font-serif, headings use --font-brand-slab */
  --font-sans:var(--nx-body);
  --font-serif:var(--nx-body);
  --font-brand-system:var(--nx-body);
  --font-brand-slab:var(--nx-display);
}

html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{font-family:var(--nx-body)!important;color:var(--nx-fg);background:var(--nx-bg)!important;letter-spacing:0}
h1,h2,h3,h4{font-family:var(--nx-display)!important;font-weight:600;letter-spacing:-.01em;line-height:1.12;color:var(--nx-ink)}
h1{font-size:1.75rem!important;margin-bottom:.5rem!important}
h1+p{color:var(--nx-fg-muted)!important;font-size:1rem}
p,label,span,li,td,th{font-family:inherit}
.font-brand,[class*="font-brand"]{font-family:var(--nx-display)!important}
button,a,input,select,textarea,nav{font-family:var(--nx-body)}
button{font-weight:500}
/* Eyebrow above the home heading, like the site's section labels */
h1.sm\:mx-12::before{content:"Netix Secure Send";display:block;font-family:var(--nx-body);font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--nx-mint-dark);margin-bottom:.75rem}
label{font-weight:500}

/* Masthead: smaller, centred logo */
header{background:var(--nx-bg)!important;border-bottom:1px solid var(--nx-border-subtle)}
header .container{padding-top:1.25rem!important;padding-bottom:1.25rem!important}
header .flex.flex-wrap{justify-content:center!important}
header img{height:2.75rem!important;width:auto!important}
header nav{display:none}
/* Recipient (secret) pages hide the masthead logo; draw one so the page is clearly ours */
header:not(:has(img))::before{content:"";display:block;height:2.5rem;margin:1.25rem auto;background:url(/brand-logo.png) center/contain no-repeat}
.dark header:not(:has(img))::before{background-image:url(/brand-logo-dark.png)}

/* Cards and fields */
form>div:first-child,main .rounded-lg.border,main .shadow-\[0_8px_30px_rgb\(0\,0\,0\,0\.04\)\]{
  border-radius:var(--nx-r-xl)!important;border:1px solid var(--nx-border-subtle)!important;
  background:var(--nx-bg)!important;box-shadow:var(--nx-sh-3)!important;background-image:none!important}
textarea,input,select{border-radius:var(--nx-r-md)!important;border:1px solid var(--nx-border)!important;background:#fff!important;font-family:var(--nx-body)}
textarea{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important;font-size:.95rem}
textarea:focus,input:focus,select:focus{outline:none!important;border-color:var(--nx-mint-deep)!important;box-shadow:0 0 0 3px rgba(23,184,118,.22)!important}
.bg-gradient-to-r{background-image:none!important;background:var(--nx-mint-soft)!important}
.bg-gradient-to-r *{color:var(--nx-ink-3)!important}

/* Primary action: mint fill, ink text (matches "Book a meeting" on netix.digital) */
button[class*="rounded-l-lg"],button[class*="rounded-r-lg"]{
  background:var(--nx-mint)!important;background-image:none!important;color:var(--nx-ink)!important;
  font-family:var(--nx-display)!important;font-weight:600!important;letter-spacing:0;text-shadow:none}
button[class*="rounded-l-lg"]{border-radius:var(--nx-r-md) 0 0 var(--nx-r-md)!important}
button[class*="rounded-r-lg"]{border-radius:0 var(--nx-r-md) var(--nx-r-md) 0!important;border-left:1px solid rgba(13,21,18,.12)!important}
button[class*="rounded-l-lg"]:hover,button[class*="rounded-r-lg"]:hover{background:var(--nx-mint-deep)!important;box-shadow:0 8px 20px -6px rgba(23,184,118,.5)!important}
button[class*="rounded-l-lg"] svg,button[class*="rounded-r-lg"] svg{color:var(--nx-ink)!important;stroke:var(--nx-ink)!important}
button:focus-visible{box-shadow:0 0 0 3px rgba(23,184,118,.35)!important;outline:none!important}

/* Any brand-coloured control: mint fill, ink text */
.bg-brand-500,.bg-brand-600,.bg-brand-700{background:var(--nx-mint)!important;background-image:none!important;color:var(--nx-ink)!important}
.bg-brand-500:hover,.hover\:bg-brand-600:hover,.hover\:bg-brand-700:hover{background:var(--nx-mint-deep)!important}
.bg-brand-500 *,.bg-brand-600 *{color:var(--nx-ink)!important}
.focus\:ring-brand-500:focus{--tw-ring-color:rgba(23,184,118,.45)!important}
.text-brand-500,.text-brand-600{color:var(--nx-mint-dark)!important}
.border-brand-500{border-color:var(--nx-mint-deep)!important}

/* Links and small controls */
a{color:var(--nx-mint-dark)}
.rounded-md.bg-gray-200{background:var(--nx-paper)!important;color:var(--nx-fg)!important;border-radius:999px!important}

/* Footer: light paper, quiet */
footer.bg-gray-100{background:var(--nx-paper)!important;padding-top:2.5rem!important;padding-bottom:2.5rem!important;border-top:1px solid var(--nx-border-subtle)}
footer.w-full:not(.bg-gray-100){background:transparent!important}
footer,footer *{font-family:var(--nx-body)!important;font-size:.8125rem}

/* Dark theme (app toggles .dark on <html>) */
.dark body{background:var(--nx-ink)!important;color:#e6e8e4}
.dark header{background:var(--nx-ink)!important;border-bottom-color:rgba(255,255,255,.06)}
.dark h1,.dark h2,.dark h3{color:#f4fbf7}
.dark h1+p{color:#a2aaa3!important}
.dark form>div:first-child,.dark main .rounded-lg.border{background:var(--nx-ink-2)!important;border-color:rgba(255,255,255,.08)!important;box-shadow:0 12px 32px rgba(0,0,0,.35)!important}
.dark textarea,.dark input,.dark select{background:var(--nx-ink)!important;border-color:rgba(255,255,255,.12)!important;color:#e6e8e4}
.dark .bg-gradient-to-r{background:rgba(62,235,161,.08)!important}
.dark .bg-gradient-to-r *{color:#c9f5e0!important}
.dark footer.bg-gray-100{background:var(--nx-ink-2)!important;border-top-color:rgba(255,255,255,.06)}
.dark .rounded-md.bg-gray-200,.dark .dark\:bg-gray-700{background:var(--nx-ink-3)!important;color:#e6e8e4!important}

/* ───────── Neutral scale remap (receipt, reveal and any other page) ─────────
   The app uses Tailwind gray/slate utilities directly. Map them onto Netix neutrals so every
   page follows the theme. Attribute selectors avoid escaping "dark:" and "/" in class names. */

/* Light */
[class~="bg-gray-50"],[class~="bg-slate-50"]{background-color:var(--nx-bg-subtle)!important}
[class~="bg-gray-100"]{background-color:var(--nx-paper)!important}
[class~="bg-gray-200"]{background-color:#e6e8e4!important}
[class~="bg-gray-900"]{background-color:var(--nx-ink)!important}
[class~="from-white"],[class~="to-gray-50/30"]{--tw-gradient-from:#fff!important;--tw-gradient-to:#fff!important}
[class~="from-gray-200"],[class~="to-gray-100"],[class~="to-gray-200"]{--tw-gradient-from:var(--nx-paper)!important;--tw-gradient-to:var(--nx-paper)!important}
[class~="text-gray-900"],[class~="text-gray-800"]{color:var(--nx-ink)!important}
[class~="text-gray-700"],[class~="text-gray-600"]{color:var(--nx-fg)!important}
[class~="text-gray-500"]{color:var(--nx-fg-muted)!important}
[class~="text-gray-400"]{color:var(--nx-fg-subtle)!important}
[class~="border-gray-200"],[class~="border-gray-200/60"],[class~="border-gray-200/50"]{border-color:var(--nx-border-subtle)!important}

/* Cards on receipt / reveal pages */
main [class~="rounded-xl"][class~="border"],main [class~="rounded-lg"][class~="bg-white"],main [class~="rounded-lg"][class~="shadow-md"]{
  border-radius:var(--nx-r-xl)!important;border:1px solid var(--nx-border-subtle)!important;box-shadow:var(--nx-sh-3)!important;background-image:none!important}
main [class~="pt-16"]{padding-top:2.5rem!important}
[class~="mt-24"]{margin-top:3rem!important}

/* Burn: site highlight amber, flat, ink text */
[class~="from-amber-300"]{background:#f5b441!important;background-image:none!important;color:var(--nx-ink)!important;box-shadow:none!important}
[class~="from-amber-300"]:hover{background:#e9a533!important}
[class~="bg-red-100"]{background:#fdecec!important}[class~="border-red-200"]{border-color:#f8c9c9!important}

/* Dark */
.dark [class~="dark:bg-gray-900"],.dark [class~="dark:bg-slate-900"],.dark [class~="dark:bg-gray-900/50"],.dark [class~="dark:from-slate-900"],.dark [class~="dark:to-slate-800/30"]{background-color:var(--nx-ink)!important;--tw-gradient-from:var(--nx-ink)!important;--tw-gradient-to:var(--nx-ink)!important}
.dark [class~="dark:bg-gray-800"],.dark [class~="dark:bg-gray-800/30"],.dark [class~="dark:bg-gray-800/60"],.dark [class~="dark:from-gray-800/80"],.dark [class~="dark:to-gray-800/30"]{background-color:var(--nx-ink-2)!important;--tw-gradient-from:var(--nx-ink-2)!important;--tw-gradient-to:var(--nx-ink-2)!important}
.dark [class~="dark:bg-gray-700"],.dark [class~="dark:bg-gray-600"],.dark [class~="dark:to-gray-700"]{background-color:var(--nx-ink-3)!important;--tw-gradient-to:var(--nx-ink-3)!important}
.dark [class~="dark:border-gray-700"],.dark [class~="dark:border-gray-700/60"],.dark [class~="dark:border-gray-700/50"]{border-color:rgba(255,255,255,.08)!important}
.dark [class~="dark:text-gray-100"],.dark [class~="dark:text-gray-200"],.dark [class~="dark:text-gray-300"]{color:#e6e8e4!important}
.dark [class~="dark:text-gray-400"]{color:#a2aaa3!important}
.dark [class~="dark:text-gray-500"],.dark [class~="dark:text-gray-600"]{color:#74837b!important}
.dark main [class~="rounded-xl"][class~="border"],.dark main [class~="rounded-lg"][class~="bg-white"],.dark main [class~="rounded-lg"][class~="shadow-md"]{
  background:var(--nx-ink-2)!important;border-color:rgba(255,255,255,.08)!important;box-shadow:0 12px 32px rgba(0,0,0,.35)!important}
.dark [class~="bg-red-100"]{background:rgba(220,38,38,.18)!important}.dark [class~="border-red-200"]{border-color:rgba(220,38,38,.35)!important}

/* Belt and braces: never show a link back to onetimesecret.com */
a[href*="onetimesecret.com"]{display:none!important}

/* Dark: text scale counterparts (the light remap above must not win on dark) */
.dark [class~="text-gray-900"],.dark [class~="text-gray-800"],.dark [class~="text-gray-700"]{color:#e6e8e4!important}
.dark [class~="text-gray-600"],.dark [class~="text-gray-500"]{color:#a2aaa3!important}
.dark [class~="text-gray-400"]{color:#74837b!important}
.dark [class~="dark:text-gray-100"],.dark [class~="dark:text-gray-200"],.dark [class~="dark:text-gray-300"]{color:#e6e8e4!important}
.dark [class~="dark:text-gray-400"]{color:#a2aaa3!important}
/* Form fields: always legible */
.dark textarea,.dark input,.dark select{color:#f4fbf7!important;caret-color:var(--nx-mint)}
.dark textarea::placeholder,.dark input::placeholder{color:#74837b!important}
textarea,input,select{color:var(--nx-ink)!important;caret-color:var(--nx-mint-deep)}
textarea::placeholder,input::placeholder{color:var(--nx-fg-subtle)!important}
::selection{background:rgba(62,235,161,.35)}

/* Passphrase is optional: say so on the label */
label[for^="passphrase"]::after{content:" (optional)";font-weight:400;color:var(--nx-fg-subtle);text-transform:none;letter-spacing:0}
.dark label[for^="passphrase"]::after{color:#74837b}