/* ========================================================================
   Oficina Portátil V75.23
   BOTÕES DE AÇÃO: Liquid Glass colorido inspirado no material do teste.
   ======================================================================== */

:root{
  --op-btn-glass-blur:3px;
  --op-btn-glass-saturation:1.45;
  --op-btn-glass-contrast:.70;
  --op-btn-glass-border:1.5px;
  --op-btn-glass-shadow-blur:14px;
  --op-btn-glass-shadow-y:5px;
}

/* =========================================================================
   BOTÕES — LIQUID GLASS COLORIDO
   ========================================================================= */

/*
 * Abrange CTAs e comandos dentro do conteúdo.
 * NÃO mexe nos botões da Topbar/Sidebar, que já estão fechados.
 */
:is(
  main .primary,
  main .secondary,
  main .hero-actions > button,
  main .hero-actions > a,
  main .op-btn,
  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"]
){
  position:relative!important;
  isolation:isolate;
  overflow:hidden;

  color:var(--on-accent,#fff)!important;

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.25) 0%,
      rgba(255,255,255,.08) 24%,
      transparent 47%
    ),
    linear-gradient(
      145deg,
      color-mix(in srgb,var(--accent) 70%,transparent),
      color-mix(in srgb,var(--accent) 48%,transparent)
    )!important;

  -webkit-backdrop-filter:
    blur(var(--op-btn-glass-blur))
    saturate(var(--op-btn-glass-saturation))
    contrast(var(--op-btn-glass-contrast))!important;
  backdrop-filter:
    blur(var(--op-btn-glass-blur))
    saturate(var(--op-btn-glass-saturation))
    contrast(var(--op-btn-glass-contrast))!important;

  border:
    var(--op-btn-glass-border) solid
    color-mix(in srgb,#fff 66%,var(--accent) 34%)!important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.76),
    inset 0 -1px 0 color-mix(in srgb,var(--accent) 20%,transparent),
    0 var(--op-btn-glass-shadow-y) var(--op-btn-glass-shadow-blur)
      color-mix(in srgb,var(--accent) 26%,transparent)!important;

  border-radius:22px!important;
  text-shadow:0 1px 2px rgba(0,0,0,.12);

  transition:
    transform .18s ease,
    filter .18s ease,
    box-shadow .18s ease,
    background .18s ease!important;
}

/* Reflexo / brilho no próprio botão. */
:is(
  main .primary,
  main .secondary,
  main .hero-actions > button,
  main .hero-actions > a,
  main .op-btn,
  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"]
)::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:-1;
  inset:1px;
  border-radius:inherit;

  background:
    linear-gradient(
      112deg,
      rgba(255,255,255,.28) 0%,
      rgba(255,255,255,.08) 18%,
      transparent 38%,
      transparent 72%,
      rgba(255,255,255,.10) 100%
    );

  mix-blend-mode:screen;
}

:is(
  main .primary,
  main .secondary,
  main .hero-actions > button,
  main .hero-actions > a,
  main .op-btn,
  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"]
):hover{
  transform:translateY(-1px) scale(1.015)!important;
  filter:brightness(1.07);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.86),
    inset 0 -1px 0 color-mix(in srgb,var(--accent) 18%,transparent),
    0 8px 20px color-mix(in srgb,var(--accent) 32%,transparent)!important;
}

:is(
  main .primary,
  main .secondary,
  main .hero-actions > button,
  main .hero-actions > a,
  main .op-btn,
  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"]
):active{
  transform:translateY(0) scale(.985)!important;
  filter:brightness(.98);
}

/* Desabilitado continua legível e sem "névoa". */
:is(
  main .primary,
  main .secondary,
  main .hero-actions > button,
  main .hero-actions > a,
  main .op-btn,
  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"]
):disabled{
  opacity:.48!important;
  transform:none!important;
  filter:saturate(.6)!important;
  box-shadow:none!important;
}

/* Accent branco/preto: contraste explícito. */
html[data-accent-enabled="true"][data-accent-tone="white"]
:is(
  main .primary,
  main .secondary,
  main .hero-actions > button,
  main .hero-actions > a,
  main .op-btn,
  main .op-frota-searchbar > button,
  main .op-frota-copy,
  main button[type="submit"]
){
  color:#111!important;
  text-shadow:none!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.58),rgba(255,255,255,.26)),
    rgba(255,255,255,.38)!important;
  border-color:rgba(255,255,255,.92)!important;
}

html[data-accent-enabled="true"][data-accent-tone="black"]
:is(
  main .primary,
  main .secondary,
  main .hero-actions > button,
  main .hero-actions > a,
  main .op-btn,
  main .op-frota-searchbar > button,
  main .op-frota-copy,
  main button[type="submit"]
){
  color:#fff!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.13),transparent 38%),
    rgba(0,0,0,.62)!important;
  border-color:rgba(255,255,255,.42)!important;
}

/*
 * O botão "Abrir chamado" do Hero tinha override específico branco.
 * Aqui vence explicitamente para receber o novo Liquid Glass.
 */
.hero-panel .hero-actions :is(.primary,.secondary,button,a){
  color:var(--on-accent,#fff)!important;
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.28) 0%,
      rgba(255,255,255,.08) 24%,
      transparent 47%
    ),
    linear-gradient(
      145deg,
      color-mix(in srgb,var(--accent) 72%,transparent),
      color-mix(in srgb,var(--accent) 48%,transparent)
    )!important;
  border-color:
    color-mix(in srgb,#fff 72%,var(--accent) 28%)!important;
}

/* Mobile: mantém toque confortável. */
@media(max-width:820px){
  :is(
    main .primary,
    main .secondary,
    main .hero-actions > button,
    main .hero-actions > a,
    main .op-btn,
    main .op-frota-searchbar > button,
    main .op-frota-copy,
    main button[type="submit"]
  ){
    min-height:48px;
    border-radius:20px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  :is(
    main .primary,
    main .secondary,
    main .hero-actions > button,
    main .hero-actions > a,
    main .op-btn,
    main .op-frota-searchbar > button,
    main .op-frota-copy,
    main button[type="submit"]
  ){
    transition:none!important;
  }
}