/*
 * NEXO — Apple-style design layer (2026-10-27). OPT-IN: loaded only where the switch `ui.apple` allows it (see components/apple-ui.blade.php),
 * and every rule is keyed to html[data-apple]. Remove the switch (set it to «off») and the app is exactly what it was.
 *
 * What it does, from Apple's «Designing Fluid Interfaces»: springs instead of fixed curves, press feedback the instant the finger lands (and a soft
 * settle on release), sheets that spring in and can be swiped away with the finger's own velocity, a translucent material for the floating tab bar,
 * size-specific type tracking, one focus ring, and gentler equivalents under reduced motion / transparency / contrast.
 * It never changes layout, copy, behaviour or colours of the app's own components; opaque sheets stay opaque.
 */
html[data-apple] {
  --nx-spring: cubic-bezier(.32,.72,0,1);          /* critically damped: settles without bounce (default for anything that is not thrown) */
  --nx-spring-b: cubic-bezier(.34,1.3,.5,1);       /* damping .8: a little give, for things that were flicked or released */
  --nx-out: cubic-bezier(.4,0,1,1);                /* leaving is quicker than arriving */
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-optical-sizing: auto;
}
@supports (transition-timing-function: linear(0, 1)) { html[data-apple] { --nx-spring: linear(0.0, 0.064, 0.1978, 0.3473, 0.4869, 0.6063, 0.7034, 0.7797, 0.8382, 0.8822, 0.9149, 0.939, 0.9564, 0.9691, 0.9781, 0.9846, 0.9892, 0.9924, 0.9947, 0.9963, 0.9974, 0.9982, 0.9988, 0.9991, 0.9994, 0.9996, 0.9997, 0.9998, 1); --nx-spring-b: linear(0.0, 0.1034, 0.3109, 0.5257, 0.7048, 0.8358, 0.9223, 0.9738, 1.0009, 1.0124, 1.0152, 1.0136, 1.0105, 1.0072, 1.0045, 1.0025, 1.0012, 1.0004, 1.0, 0.9998, 0.9998, 0.9998, 0.9998, 0.9999, 0.9999, 1.0, 1.0, 1.0, 1); } }

/* ---- 1. Response: feedback on touch-down, soft settle on release ---- */
html[data-apple] a, html[data-apple] button, html[data-apple] [role="button"], html[data-apple] label { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
html[data-apple] .tap { transition: transform .5s var(--nx-spring-b); }
html[data-apple] .tap:active { transform: scale(.96); transition: transform .08s ease-out; }
html[data-apple] .option:active, html[data-apple] .button-primary:active, html[data-apple] .button-secondary:active { transform: scale(.97); transition: transform .08s ease-out; }
html[data-apple] .option, html[data-apple] .button-primary, html[data-apple] .button-secondary { transition: transform .45s var(--nx-spring-b), background-color .15s, border-color .15s, box-shadow .15s; }

/* ---- 2. Sheets: spring in from where they live (the bottom), scrim fades; phones get a grabber you can really swipe ---- */
html[data-apple] { --nx-spring-sheet: cubic-bezier(.3,1.15,.4,1); }   /* damping ~.72: a sheet that was tapped open settles with a small, visible bounce */
@supports (animation-timing-function: linear(0, 1)) { html[data-apple] { --nx-spring-sheet: linear(0, 0.0099, 0.0367, 0.0766, 0.1263, 0.1829, 0.2439, 0.3074, 0.3716, 0.4352, 0.497, 0.5563, 0.6124, 0.6649, 0.7134, 0.7579, 0.7983, 0.8345, 0.8668, 0.8953, 0.9202, 0.9417, 0.9601, 0.9757, 0.9886, 0.9993, 1.0078, 1.0146, 1.0197, 1.0234, 1.026, 1.0275, 1.0283, 1.0283, 1.0278, 1.0269, 1.0256, 1.0241, 1.0225, 1.0207, 1.0189, 1.017, 1.0153, 1.0135, 1.0119, 1.0103, 1.0089, 1.0076, 1); } }
@keyframes nx-sheet-up { from { transform: translateY(100%); } to { transform: none; } }
@keyframes nx-pop { from { opacity: 0; transform: translateY(14px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes nx-scrim { from { opacity: 0; } to { opacity: 1; } }
html[data-apple] .nis-sheet.is-open, html[data-apple] .nvs-sheet.is-open { animation: nx-scrim-bg .45s ease-out; }   /* only the dim layer fades; the panel itself stays solid while it rises (as in Smart) */
@keyframes nx-scrim-bg { from { background-color: rgba(0,0,0,0); } }
html[data-apple] .nis-sheet.is-open > .nis-panel, html[data-apple] .nvs-sheet.is-open > .nvs-panel { animation: nx-sheet-up .9s var(--nx-spring); will-change: transform; }
html[data-apple] .nis-panel.nx-dragging, html[data-apple] .nvs-panel.nx-dragging { animation: none; transition: none; }
/* Leaving: the same path back down, quicker (ease-in). The studios close a sheet by toggling classes (display:none at once), so `display` itself is
   transitioned (allow-discrete): the sheet stays on screen for the exit, then goes. Browsers without it simply close instantly, as before. */
html[data-apple] .nis-sheet, html[data-apple] .nvs-sheet { transition: opacity .28s ease-in, display .28s allow-discrete, overlay .28s allow-discrete; }
html[data-apple] .nis-sheet:not(.is-open), html[data-apple] .nvs-sheet:not(.is-open) { opacity: 0; pointer-events: none; }
html[data-apple] .nis-panel, html[data-apple] .nvs-panel { transition: transform .28s var(--nx-out), opacity .2s ease-in; }
html[data-apple] .nis-sheet:not(.is-open) > .nis-panel, html[data-apple] .nvs-sheet:not(.is-open) > .nvs-panel { transform: translateY(100%); }
@media (min-width: 640px) { html[data-apple] .nis-sheet:not(.is-open) > .nis-panel, html[data-apple] .nvs-sheet:not(.is-open) > .nvs-panel { transform: translateY(14px) scale(.96); opacity: 0; } }
@media (min-width: 640px) { html[data-apple] .nis-sheet.is-open > .nis-panel, html[data-apple] .nvs-sheet.is-open > .nvs-panel { animation: nx-pop .45s var(--nx-spring); } }
@media (max-width: 639.98px) {
  html[data-apple] .nis-panel, html[data-apple] .nvs-panel { position: relative; }
  html[data-apple] .nis-panel::after, html[data-apple] .nvs-panel::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 5rem; background: inherit; pointer-events: none; }   /* fills the gap under the panel while the spring overshoots */
  html[data-apple] .nis-panel::before, html[data-apple] .nvs-panel::before { content: ""; position: absolute; top: .35rem; left: 50%; width: 2.25rem; height: .25rem; margin-left: -1.125rem; border-radius: 9999px; background: rgb(120 113 108 / .4); pointer-events: none; }   /* sits inside the panel's own top padding: no layout change */
}

/* ---- 3. Material: the floating tab bar is a translucent layer over the content (never stacked on another translucent surface) ---- */
@media (max-width: 767.98px) {
  html[data-apple] .nxbn-list { background: color-mix(in srgb, var(--nxbn-bg) 78%, transparent); -webkit-backdrop-filter: blur(24px) saturate(180%); backdrop-filter: blur(24px) saturate(180%); border-color: rgba(255,255,255,.5); }
  html[data-apple].dark .nxbn-list, html[data-apple][data-theme="dark"] .nxbn-list { border-color: rgba(255,255,255,.1); }
  html[data-apple] .nxbn-tab a { transition: transform .5s var(--nx-spring-b); } html[data-apple] .nxbn-tab a:active { transform: scale(.92); transition-duration: .08s; }
}

/* ---- 4. Toasts arrive on a spring ---- */
html[data-apple] .nexo-toast { transition: transform .55s var(--nx-spring), opacity .25s ease-out; }

/* ---- 5. Type: Latin tracking follows size (tight when large, a touch open when small) — never on Persian/Arabic script, whose letters must stay joined; one focus ring ---- */
html[data-apple]:not(:lang(fa)):not(:lang(ar)) :is(h1, h2, .text-2xl, .text-3xl, .text-4xl, .nx-page-title) { letter-spacing: -.015em; }
html[data-apple]:not(:lang(fa)):not(:lang(ar)) :is(h3, .text-xl, .text-lg) { letter-spacing: -.008em; }
html[data-apple]:not(:lang(fa)):not(:lang(ar)) :is(.text-xs, .nx-page-subtitle) { letter-spacing: .01em; }
html[data-apple] :focus-visible { outline: 2px solid #6d67e4; outline-offset: 2px; }
html[data-apple] input:focus-visible, html[data-apple] textarea:focus-visible, html[data-apple] select:focus-visible { outline-offset: 0; }

/* ---- 6. Accessibility: gentler, never none ---- */
@media (prefers-reduced-motion: reduce) {
  html[data-apple] .nis-sheet.is-open, html[data-apple] .nvs-sheet.is-open, html[data-apple] .nis-sheet.is-open > .nis-panel, html[data-apple] .nvs-sheet.is-open > .nvs-panel { animation: nx-scrim .2s ease-out; }
  html[data-apple] .nis-panel, html[data-apple] .nvs-panel { transition: none; } html[data-apple] .nis-sheet:not(.is-open) > .nis-panel, html[data-apple] .nvs-sheet:not(.is-open) > .nvs-panel { transform: none; }
  html[data-apple] .tap, html[data-apple] .tap:active, html[data-apple] .option:active, html[data-apple] .button-primary:active, html[data-apple] .button-secondary:active, html[data-apple] .nxbn-tab a:active { transform: none; }
}
@media (prefers-reduced-transparency: reduce) { html[data-apple] .nxbn-list { background: var(--nxbn-bg); -webkit-backdrop-filter: none; backdrop-filter: none; } }
@media (prefers-contrast: more) { html[data-apple] .nxbn-list { background: var(--nxbn-bg); border: 1px solid currentColor; } }
