/* ========================================================================
   Oficina Portátil V75.25
   BOTÕES — lente óptica leve + aberração cromática ciano/vermelho nas bordas
   ======================================================================== */

:root{
  --op-btn-optic-cyan: rgba(90,255,255,.58);
  --op-btn-optic-magenta: rgba(255,76,118,.48);
  --op-btn-optic-white: rgba(255,255,255,.18);
  --op-btn-optic-lens-opacity: .88;
  --op-btn-optic-border: 1px;
  --op-btn-optic-edge-blur: .55px;
  --op-btn-optic-lens-blur: .8px;
}

/*
 * Aplica apenas aos botões de ação do conteúdo.
 * Topbar e Sidebar continuam fora deste efeito.
 */
:is(
  main .primary,
  main .secondary,
  main .op-btn,
  main .hero-actions > a,
  main .hero-actions > button,
  main .op-frota-searchbar > button,
  main .op-frota-copy,
  main .withdrawal-modern button.primary,
  main .withdrawal-modern button.secondary,
  main .op-ref-modal footer button,
  main .op-workspace-dialog footer button,
  main .op-workspace-move button,
  main .ref-toolbar button,
  main .ref-card button,
  main button[data-action],
  main button[type="submit"],
  main a.button,
  main .button,
  main .cta,
  main .btn
){
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  border-radius:999px!important;
  z-index:0;
}

:is(
  main .primary,
  main .secondary,
  main .op-btn,
  main .hero-actions > a,
  main .hero-actions > button,
  main .op-frota-searchbar > button,
  main .op-frota-copy,
  main .withdrawal-modern button.primary,
  main .withdrawal-modern button.secondary,
  main .op-ref-modal footer button,
  main .op-workspace-dialog footer button,
  main .op-workspace-move button,
  main .ref-toolbar button,
  main .ref-card button,
  main button[data-action],
  main button[type="submit"],
  main a.button,
  main .button,
  main .cta,
  main .btn
) > *{
  position:relative;
  z-index:2;
}

:is(
  main .primary,
  main .secondary,
  main .op-btn,
  main .hero-actions > a,
  main .hero-actions > button,
  main .op-frota-searchbar > button,
  main .op-frota-copy,
  main .withdrawal-modern button.primary,
  main .withdrawal-modern button.secondary,
  main .op-ref-modal footer button,
  main .op-workspace-dialog footer button,
  main .op-workspace-move button,
  main .ref-toolbar button,
  main .ref-card button,
  main button[data-action],
  main button[type="submit"],
  main a.button,
  main .button,
  main .cta,
  main .btn
)::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  z-index:0;
  opacity:var(--op-btn-optic-lens-opacity);
  background:
    radial-gradient(95% 130% at 12% 10%, rgba(255,255,255,.18), transparent 42%),
    radial-gradient(42% 82% at 100% 22%, rgba(83,255,255,.14), transparent 58%),
    radial-gradient(40% 78% at 0% 78%, rgba(255,70,114,.10), transparent 56%);
  -webkit-backdrop-filter: blur(var(--op-btn-optic-lens-blur)) saturate(1.06) contrast(1.04);
  backdrop-filter: blur(var(--op-btn-optic-lens-blur)) saturate(1.06) contrast(1.04);
  transform: scale(1.014);
}

:is(
  main .primary,
  main .secondary,
  main .op-btn,
  main .hero-actions > a,
  main .hero-actions > button,
  main .op-frota-searchbar > button,
  main .op-frota-copy,
  main .withdrawal-modern button.primary,
  main .withdrawal-modern button.secondary,
  main .op-ref-modal footer button,
  main .op-workspace-dialog footer button,
  main .op-workspace-move button,
  main .ref-toolbar button,
  main .ref-card button,
  main button[data-action],
  main button[type="submit"],
  main a.button,
  main .button,
  main .cta,
  main .btn
)::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  z-index:1;
  border:var(--op-btn-optic-border) solid rgba(255,255,255,.26);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 1.2px 0 0 color-mix(in srgb, var(--op-btn-optic-cyan) 92%, transparent),
    inset -1.2px 0 0 color-mix(in srgb, var(--op-btn-optic-magenta) 88%, transparent),
    .8px 0 0 color-mix(in srgb, var(--op-btn-optic-cyan) 86%, transparent),
    -.8px 0 0 color-mix(in srgb, var(--op-btn-optic-magenta) 82%, transparent),
    0 0 0 1px rgba(255,255,255,.06);
  filter: blur(var(--op-btn-optic-edge-blur)) saturate(1.2);
  opacity:.96;
}

:is(
  main .primary,
  main .secondary,
  main .op-btn,
  main .hero-actions > a,
  main .hero-actions > button,
  main .op-frota-searchbar > button,
  main .op-frota-copy,
  main .withdrawal-modern button.primary,
  main .withdrawal-modern button.secondary,
  main .op-ref-modal footer button,
  main .op-workspace-dialog footer button,
  main .op-workspace-move button,
  main .ref-toolbar button,
  main .ref-card button,
  main button[data-action],
  main button[type="submit"],
  main a.button,
  main .button,
  main .cta,
  main .btn
):hover::before{
  opacity:.96;
  transform:scale(1.02);
}

:is(
  main .primary,
  main .secondary,
  main .op-btn,
  main .hero-actions > a,
  main .hero-actions > button,
  main .op-frota-searchbar > button,
  main .op-frota-copy,
  main .withdrawal-modern button.primary,
  main .withdrawal-modern button.secondary,
  main .op-ref-modal footer button,
  main .op-workspace-dialog footer button,
  main .op-workspace-move button,
  main .ref-toolbar button,
  main .ref-card button,
  main button[data-action],
  main button[type="submit"],
  main a.button,
  main .button,
  main .cta,
  main .btn
):hover::after{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 1.5px 0 0 rgba(90,255,255,.64),
    inset -1.5px 0 0 rgba(255,76,118,.60),
    1.1px 0 0 rgba(90,255,255,.54),
    -1.1px 0 0 rgba(255,76,118,.50),
    0 0 0 1px rgba(255,255,255,.08);
}

:is(
  main .primary,
  main .secondary,
  main .op-btn,
  main .hero-actions > a,
  main .hero-actions > button,
  main .op-frota-searchbar > button,
  main .op-frota-copy,
  main .withdrawal-modern button.primary,
  main .withdrawal-modern button.secondary,
  main .op-ref-modal footer button,
  main .op-workspace-dialog footer button,
  main .op-workspace-move button,
  main .ref-toolbar button,
  main .ref-card button,
  main button[data-action],
  main button[type="submit"],
  main a.button,
  main .button,
  main .cta,
  main .btn
):active::before{
  transform:scale(1.01);
  opacity:.82;
}