@import url("/paleta.css");
/* Pente fino visual 1.74.0 (02/10/2026). Profundidade, estados e movimento das telas novas
   (Canal próprio, Implantação, Atendimento, Campanhas, CRM, Frota, catálogo) no mesmo vocabulário
   das telas antigas do Hub: superfícies sólidas com sombra em camadas, controles com resposta
   imediata, movimento curto e interrompível. Carregar por último. Nada aqui muda dados ou fluxo.
   Movimento reduzido: a regra `.hc *` de hub-apple-refinement.css já zera transições e animações. */
:root{
  --lift-1:0 1px 2px color-mix(in srgb,var(--pal-sombra) 5%,transparent),0 6px 18px color-mix(in srgb,var(--pal-sombra) 6%,transparent);
  --lift-2:0 2px 4px color-mix(in srgb,var(--pal-sombra) 7%,transparent),0 14px 34px color-mix(in srgb,var(--pal-sombra) 11%,transparent);
  --lift-sheet:0 24px 80px color-mix(in srgb,var(--pal-sombra) 28%,transparent),0 2px 8px color-mix(in srgb,var(--pal-sombra) 12%,transparent);
  --edge-light:inset 0 1px 0 color-mix(in srgb,var(--pal-branco) 65%,transparent);
  --ease-out:cubic-bezier(.22,.9,.3,1);
  --ease-sheet:cubic-bezier(.32,.72,0,1);
}
.dark{
  --lift-1:0 1px 2px color-mix(in srgb,var(--pal-sombra) 30%,transparent),0 8px 22px color-mix(in srgb,var(--pal-sombra) 32%,transparent);
  --lift-2:0 2px 4px color-mix(in srgb,var(--pal-sombra) 35%,transparent),0 16px 40px color-mix(in srgb,var(--pal-sombra) 50%,transparent);
  --lift-sheet:0 28px 90px color-mix(in srgb,var(--pal-sombra) 65%,transparent),0 2px 8px color-mix(in srgb,var(--pal-sombra) 40%,transparent);
  --edge-light:inset 0 1px 0 color-mix(in srgb,var(--pal-branco) 6%,transparent);
}

/* ---------- cabeçalho das telas: título grande, unidade como cápsula ---------- */
.hc>.hc-header{align-items:flex-end;gap:1rem 1.5rem;margin-bottom:1.25rem}
.hc>.hc-header>div:first-child{min-width:0}
.hc>.hc-header .hc-eyebrow{font-size:var(--f-footnote);font-weight:600;letter-spacing:.01em;color:var(--label3);margin-bottom:.125rem}
.hc>.hc-header h2{font-size:var(--f-largetitle);line-height:var(--lh-largetitle);letter-spacing:-.022em;font-weight:700}
.hc>.hc-header .hc-actions{align-items:flex-end}
.hc>.hc-header .hc-actions .hc-field{font-size:var(--f-footnote);gap:.25rem;color:var(--label3)}
.hc>.hc-header .hc-actions .hc-field select{border-radius:var(--r-pill);background-color:var(--surface);border-color:transparent;box-shadow:var(--lift-1),var(--edge-light);padding:.625rem 2.625rem .625rem 1rem;min-width:min(13rem,100%);font-weight:600}
.hc>.hc-header .hc-actions>.btn{border-radius:var(--r-pill);padding-inline:1.125rem}

/* ---------- selects: aparência própria com a mesma seta em todo o Hub comercial ---------- */
.hc select:not([multiple]):not([size]){-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M5 7.5l5 5 5-5' fill='none' stroke='%236B5A4C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>");background-repeat:no-repeat;background-position:right .875rem center;background-size:1.125rem 1.125rem;padding-right:2.625rem;cursor:pointer}
.dark .hc select:not([multiple]):not([size]){background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M5 7.5l5 5 5-5' fill='none' stroke='%23C9BDB1' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>")}
.hc select:not([multiple]):not([size]):disabled{cursor:default;opacity:.6}

/* ---------- botões: resposta ao pressionar, hierarquia por peso e não por borda ---------- */
.hc .btn{transition:background-color 120ms ease,color 120ms ease,box-shadow 120ms ease,transform 120ms var(--ease-out)}
.hc .btn:active:not(:disabled){transform:scale(.97)}
.hc .btn.primary,.hc .btn[data-ob-primary]{box-shadow:0 1px 2px rgba(0,0,0,.12),0 6px 16px color-mix(in srgb,var(--sys-blue) 28%,transparent)}
.hc .hvw-page-shortcuts .btn,.hc .hvw-page-tools .btn{border-radius:var(--r-pill)}
.hc .hvw-page-tools{border:0;background:transparent;border-radius:0;padding:0;gap:.5rem;width:auto;max-width:100%}
.hc .hvw-page-tools .btn{border:0;background:var(--fill);box-shadow:none;padding:.625rem 1rem;font-weight:600;color:var(--label)}
.hc .hvw-page-tools .btn:hover{background:var(--fill2)}
.hc .hvw-page-shortcuts{border-bottom:0;padding-bottom:0;gap:.5rem}
.hc .hvw-page-shortcuts .btn{background:var(--surface);border-color:transparent;box-shadow:var(--lift-1),var(--edge-light);font-weight:600}
.hc .hvw-page-shortcuts .btn:hover{box-shadow:var(--lift-2),var(--edge-light)}
.hc .hvw-page-shortcuts a.btn{text-decoration:none}
/* No telefone, atalhos e ferramentas viram uma fileira deslizante: uma linha, sem empurrar os cartões para baixo. */
@media(max-width:600px){
  .hc .hvw-page-shortcuts,.hc .hvw-page-tools{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;padding-block:.25rem .5rem;scroll-padding-inline:.5rem}
  .hc .hvw-page-shortcuts::-webkit-scrollbar,.hc .hvw-page-tools::-webkit-scrollbar{display:none}
  .hc .hvw-page-shortcuts .btn,.hc .hvw-page-tools .btn{flex:0 0 auto;white-space:nowrap;scroll-snap-align:start;text-align:center;padding:.625rem 1rem}
  .hvw-form-footer .btn.primary,.hvw-form-footer .btn[type=submit]{flex:1 1 auto}
}

/* ---------- cartões: superfície com profundidade, não com contorno ---------- */
.hc .hc-card{background:var(--surface);border-color:color-mix(in srgb,var(--hair) 55%,transparent);border-radius:var(--r-sheet);box-shadow:var(--lift-1),var(--edge-light)}
.hc .hc-card .hc-card,.hc .hvw-editor .hc-card,.hc-dialog .hc-card .hc-card{box-shadow:none;border-color:var(--hair)}
.hc .hvw-editor-body .hc-card{background:transparent;border:0;padding:0;box-shadow:none;margin:0}
.hc .hc-card:has(>.hvw-workspace){background:transparent;border:0;box-shadow:none;padding:0;margin-block:1.25rem}
.hc .hc-card:has(>.hvw-workspace)>h3{font-size:var(--f-title2);line-height:var(--lh-title2);letter-spacing:-.015em;margin-bottom:.375rem}
.hc .hc-card:has(>.hvw-workspace)>.hc-note{margin-bottom:.25rem;max-width:64ch}
.hvw-workspace .hvw-card{position:relative;border-radius:var(--r-sheet);border:1px solid color-mix(in srgb,var(--hair) 55%,transparent);background:var(--surface);box-shadow:var(--lift-1),var(--edge-light);transition:box-shadow 220ms var(--ease-out),transform 220ms var(--ease-out),border-color 220ms ease;cursor:pointer;will-change:transform}
.hvw-workspace .hvw-card[data-kind=action]{cursor:pointer}
.hvw-workspace .hvw-card:active{transform:scale(.988);box-shadow:var(--lift-1),var(--edge-light)}
.hvw-workspace .hvw-card:focus-within{border-color:color-mix(in srgb,var(--sys-blue) 45%,transparent)}
@media(hover:hover){
  .hvw-workspace .hvw-card:hover{transform:translateY(-2px);box-shadow:var(--lift-2),var(--edge-light);border-color:color-mix(in srgb,var(--hair) 80%,transparent)}
  .hvw-workspace .hvw-card:hover .hvw-open::after{background:var(--ink-blue);color:#fff;transform:translateX(2px)}
}
.hvw-workspace .hvw-card-header{align-items:center;gap:.875rem}
.hvw-workspace .hvw-icon{width:2.875rem;height:2.875rem;border-radius:.9375rem;background:color-mix(in srgb,var(--sys-green) 13%,var(--surface));color:var(--ink-green);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sys-green) 16%,transparent)}
.hvw-workspace .hvw-card[data-accent=blue] .hvw-icon{background:color-mix(in srgb,var(--sys-blue) 13%,var(--surface));color:var(--ink-blue);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sys-blue) 16%,transparent)}
.hvw-workspace .hvw-card[data-accent=orange] .hvw-icon{background:color-mix(in srgb,var(--sys-orange) 16%,var(--surface));color:var(--ink-orange);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sys-orange) 18%,transparent)}
.hvw-workspace .hvw-card[data-accent=red] .hvw-icon{background:color-mix(in srgb,var(--sys-red) 12%,var(--surface));color:var(--ink-red);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sys-red) 16%,transparent)}
.hvw-workspace .hvw-card[data-accent=neutral] .hvw-icon{background:var(--fill);color:var(--label2);box-shadow:none}
.hvw-workspace .hvw-card .hvw-card-title{font-size:var(--f-headline);line-height:var(--lh-headline);letter-spacing:-.012em;font-weight:650}
.hvw-workspace .hvw-card-eyebrow{font-weight:600;color:var(--label3)}
.hvw-workspace .hvw-card-description{color:var(--label2)}
/* Situação: só o que informa vira selo; o aviso genérico fica como texto discreto. */
.hvw-workspace .hvw-status{border-radius:var(--r-pill);padding:.3125rem .6875rem;font-size:var(--f-footnote);font-weight:600;line-height:1.35;background:var(--fill)}
.hvw-workspace .hvw-status[data-tone=neutral]{background:transparent;padding:0;color:var(--label3);font-weight:500}
.hvw-workspace .hvw-status[data-tone=good]{background:color-mix(in srgb,var(--sys-green) 14%,var(--surface));color:var(--ink-green)}
.hvw-workspace .hvw-status[data-tone=warning]{background:color-mix(in srgb,var(--sys-orange) 17%,var(--surface));color:var(--ink-orange);border:0}
.hvw-workspace .hvw-status[data-tone=danger]{background:color-mix(in srgb,var(--sys-red) 12%,var(--surface));color:var(--ink-red)}
.hvw-workspace .hvw-summary{gap:.5rem;padding-top:.25rem}
.hvw-workspace .hvw-summary:empty{display:none}
.hvw-workspace .hvw-summary>div{padding-bottom:.5rem;border-bottom:1px solid color-mix(in srgb,var(--hair) 60%,transparent)}
.hvw-workspace .hvw-summary>div:last-child{border-bottom:0;padding-bottom:0}
.hvw-workspace .hvw-summary dt{color:var(--label3)}
.hvw-workspace .hvw-summary dd{font-variant-numeric:tabular-nums}
/* A ação do cartão vira uma linha calma: texto azul e seta em cápsula; o cartão inteiro já abre. */
.hvw-workspace .hvw-open{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:auto;padding:.625rem 0 0;border:0;border-top:1px solid color-mix(in srgb,var(--hair) 60%,transparent);border-radius:0;background:transparent;color:var(--ink-blue);font-weight:600;transition:color 120ms ease}
.hvw-workspace .hvw-open::after{content:'›';float:none;display:grid;place-items:center;flex:none;width:1.75rem;height:1.75rem;margin:0;border-radius:50%;background:var(--fill);color:var(--ink-blue);font-size:1.25rem;line-height:1;font-weight:500;transition:background-color 160ms ease,color 160ms ease,transform 220ms var(--ease-out)}
.hvw-workspace .hvw-open:active{transform:none}
.hvw-workspace .hvw-open:disabled{color:var(--label3)}
.hvw-workspace .hvw-open:disabled::after{background:transparent;color:var(--label4)}
.hvw-workspace .hvw-open:focus-visible{outline-offset:4px;border-radius:.5rem}
.hvw-workspace .hvw-edit-state{display:inline-flex;align-items:center;gap:.375rem;align-self:flex-start;padding:.25rem .625rem;border-radius:var(--r-pill);background:color-mix(in srgb,var(--sys-blue) 12%,var(--surface));color:var(--ink-blue);font-size:var(--f-footnote);font-weight:600}
.hvw-workspace .hvw-edit-state::before{content:'';width:.4375rem;height:.4375rem;border-radius:50%;background:currentColor}
.hvw-workspace .hvw-card-feedback{padding:.5rem .75rem;border-radius:.75rem;background:var(--fill);color:var(--label2)}
.hvw-workspace .hvw-card-feedback[data-error=true]{background:color-mix(in srgb,var(--sys-red) 10%,var(--surface));color:var(--ink-red)}
.hvw-workspace .hvw-card-media{border-radius:.875rem;box-shadow:inset 0 0 0 1px rgba(0,0,0,.04)}
.hvw-workspace .hvw-group-title{font-size:var(--f-title2);line-height:var(--lh-title2);letter-spacing:-.015em;margin:0 0 .875rem}
.hvw-workspace .hvw-group{margin-block:1.75rem}
/* Entrada em cascata curta: cada cartão aparece a partir de onde fica, sem deslocar o layout. */
@media(prefers-reduced-motion:no-preference){
  .hvw-workspace .hvw-card{animation:hvw-card-in 360ms var(--ease-out) both}
  .hvw-grid>.hvw-card:nth-child(2){animation-delay:40ms}.hvw-grid>.hvw-card:nth-child(3){animation-delay:80ms}.hvw-grid>.hvw-card:nth-child(4){animation-delay:120ms}
  .hvw-grid>.hvw-card:nth-child(5){animation-delay:160ms}.hvw-grid>.hvw-card:nth-child(6){animation-delay:200ms}.hvw-grid>.hvw-card:nth-child(7){animation-delay:240ms}
  .hvw-grid>.hvw-card:nth-child(8){animation-delay:280ms}.hvw-grid>.hvw-card:nth-child(n+9){animation-delay:320ms}
  @keyframes hvw-card-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
}

.hvw-group[data-compact=true]>.hvw-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,calc(11.5rem * var(--dt,1))),1fr));gap:.875rem}
.hvw-group[data-compact=true] .hvw-card{padding:1rem;gap:.75rem;border-radius:1.25rem}

/* ---------- editor central: folha com sombra profunda, entrada curta e cabeçalho sólido ---------- */
.hvw-editor{border-color:transparent;box-shadow:var(--lift-sheet);border-radius:1.5rem}
.hvw-editor::backdrop{background:rgba(30,20,12,.42);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.dark .hvw-editor::backdrop{background:rgba(0,0,0,.55)}
.hvw-editor-header{padding:1.125rem 1.25rem 1rem;background:var(--surface);border-bottom-color:color-mix(in srgb,var(--hair) 70%,transparent)}
.hvw-editor-eyebrow{font-weight:600;color:var(--label3)}
.hvw-editor .hvw-editor-title{font-size:var(--f-title2);line-height:1.2;letter-spacing:-.02em;font-weight:700}   /* 1.2 como a folha base: em 320x568 o primeiro campo precisa caber acima do rodapé */
.hvw-close{border:0;border-radius:50%;background:var(--fill);color:var(--label2);transition:background-color 120ms ease,transform 120ms var(--ease-out)}
.hvw-close:hover{background:var(--fill2)}
.hvw-close:active{transform:scale(.92)}
.hvw-editor-body{background:var(--page,var(--bg))}
.hvw-retained{display:none}
.hvw-editor-footer,.hvw-form-footer.hc-actions{border-top-color:color-mix(in srgb,var(--hair) 70%,transparent)}
.hvw-form-footer.hc-actions{padding:.875rem 1.25rem}
.hvw-form-footer .btn.primary,.hvw-form-footer .btn[type=submit]{min-width:9rem;border-radius:var(--r-pill);font-weight:650}
.hvw-back{border:0;background:transparent;color:var(--ink-blue);font-weight:600;padding-inline:.5rem}
.hvw-back:hover{background:var(--fill)}
.hvw-back{display:inline-flex;align-items:center;gap:.375rem}
.hvw-back::before{content:'';flex:none;width:.875rem;height:.875rem;background:currentColor;-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M12.5 4l-6 6 6 6' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M12.5 4l-6 6 6 6' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat}
@media(prefers-reduced-motion:no-preference){
  .hvw-editor[data-open=true]{animation:hvw-sheet-in 260ms var(--ease-sheet)}
  .hvw-editor[data-open=true]::backdrop{animation:hvw-backdrop-in 260ms ease}
  @keyframes hvw-sheet-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
  @keyframes hvw-backdrop-in{from{opacity:0}to{opacity:1}}
}
@media(max-width:600px){
  .hvw-editor{border-radius:1.5rem 1.5rem 0 0}
  /* a alça não pode empurrar o primeiro campo para fora da folha em 320x568: o que entra em cima sai embaixo */
  .hvw-editor-header{padding:1.25rem 1.25rem .75rem}
  .hvw-editor-header::before{content:'';position:absolute;top:.4375rem;left:50%;width:2.5rem;height:.3125rem;border-radius:var(--r-pill);background:var(--fill3);transform:translateX(-50%)}
  .hvw-editor{position:fixed}
  .hvw-editor-header{position:relative}
}
@media(max-width:600px) and (prefers-reduced-motion:no-preference){
  .hvw-editor[data-open=true]{animation:hvw-sheet-up 320ms var(--ease-sheet)}
  @keyframes hvw-sheet-up{from{opacity:.6;transform:translateY(32px)}to{opacity:1;transform:none}}
}

/* ---------- Implantação: etapas com a mesma profundidade e resposta ---------- */
.hc .hc-ob-card{border-radius:var(--r-sheet);border-color:color-mix(in srgb,var(--hair) 55%,transparent);background:var(--surface);box-shadow:var(--lift-1),var(--edge-light);transition:transform 220ms var(--ease-out),box-shadow 220ms var(--ease-out),border-color 220ms ease}
@media(hover:hover){.hc .hc-ob-card:hover{transform:translateY(-2px);box-shadow:var(--lift-2),var(--edge-light);border-color:color-mix(in srgb,var(--hair) 80%,transparent)}}
.hc .hc-ob-card:active{transform:scale(.988)}
.hc .hc-card.hc-ob-next{border-inline-start-width:4px;box-shadow:var(--lift-2),var(--edge-light)}
/* A próxima etapa é a única ação primária da tela: preenchida, com a cor de ação do sistema. */
.hc .hc-ob-next>.btn[data-ob-open]{background:var(--on-blue);color:#fff;border-color:transparent;border-radius:var(--r-pill);padding-inline:1.25rem;font-weight:650;box-shadow:0 1px 2px rgba(0,0,0,.12),0 6px 16px color-mix(in srgb,var(--sys-blue) 28%,transparent)}
.hc .hc-ob-next>.btn[data-ob-open]:hover{filter:brightness(1.06)}
.hc .hc-onboarding-progress progress{height:.5rem}

/* ---------- formulários dentro do editor: campos com superfície clara e foco visível ---------- */
.hc .hvw-editor .hc-field input,.hc .hvw-editor .hc-field select,.hc .hvw-editor .hc-field textarea,.hc-dialog .hc-field input,.hc-dialog .hc-field select,.hc-dialog .hc-field textarea{background:var(--surface);border-color:color-mix(in srgb,var(--hair) 80%,transparent);box-shadow:inset 0 1px 2px rgba(0,0,0,.04);transition:border-color 120ms ease,box-shadow 120ms ease}
.hc .hc-field input:focus-visible,.hc .hc-field select:focus-visible,.hc .hc-field textarea:focus-visible{border-color:var(--sys-blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--sys-blue) 22%,transparent);outline:0}
.hc .hc-check{padding:.375rem 0}
.hc .hc-check input{width:1.375rem;height:1.375rem;border-radius:.4375rem}

/* ---------- Frota: um título só; a nota explica a tarefa, não a implementação ---------- */
[data-fleet-legacy-comp]>[data-hc-fleet-compensation]>h3:first-child{display:none}
[data-fleet-legacy-comp]>[data-hc-fleet-compensation]{margin-top:.5rem}

/* ---------- preferências do sistema ---------- */
@media(prefers-contrast:more){
  .hc .hc-card,.hvw-workspace .hvw-card,.hc .hc-ob-card{border-color:var(--label2);box-shadow:none}
  .hvw-workspace .hvw-status{border:1px solid currentColor}
  .hvw-workspace .hvw-status[data-tone=neutral]{border:0;color:var(--label)}
}
@media(prefers-reduced-transparency:reduce){.hvw-editor::backdrop{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(30,20,12,.7)}}
@media(forced-colors:active){.hc .hc-card,.hvw-workspace .hvw-card,.hc .hc-ob-card,.hvw-editor{border:1px solid CanvasText;box-shadow:none}.hvw-workspace .hvw-open::after{border:1px solid CanvasText}}

/* Tokens globais e apelidos centralizados em paleta.css. */
/* A ação preenchida usa o par de ação da régua, inclusive no aviso do Hub. */
body .hp-bt.pri,body .hp-bt.pri:hover{background:var(--acao);color:var(--acao-txt)}
/* O terciário da régua fica nos detalhes decorativos; texto pequeno usa label2 para AA. */
body .cu-b-raiz .cu-b-campo::placeholder,
.hc>.hc-header .hc-eyebrow,.hc>.hc-header .hc-actions .hc-field,
.hvw-workspace .hvw-card-eyebrow,.hvw-workspace .hvw-status[data-tone=neutral],
.hvw-workspace .hvw-summary dt,.hvw-editor-eyebrow{color:var(--label2)}
body.dark .cu-menu36 .c36-badge{color:var(--p-urg-txt)}
