/*
This file should only be used by hesk clients to apply any custom overwrites to core files,
and ensure these changes are included in the bundled css.

Please only change this file if you know what you are doing.
Any general thematic changes should rather be done as part of /theme changes of theme_overrides.css
*/

/* ==========================================================================
   Grupo Vilarouca — Portal do solicitante (override do cliente, carrega por último)
   Cores vêm de theme_overrides (settings: navy dominante, laranja CTA).
   Aqui: fonte Montserrat + acabamento (hover/focus laranja). Sem mudar markup.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap');

/* Fonte única Montserrat (substitui Lato do tema) — preserva código monoespaçado */
body, button, input, select, textarea, optgroup,
.wrapper, .header, .footer, .main__content, .form, .btn,
h1, h2, h3, h4, h5, h6, p, a, span, li, td, th, label,
.h-1, .h-2, .h-3, .h-4, .breadcrumbs, .navlink, .preview, .title-link {
  font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !important;
}
code, pre, kbd, samp, [class*="language-"], .token {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}

/* CTA laranja: hover mais escuro (acento) */
.wrapper .btn-full:hover,
.wrapper .btn--pri:hover,
.wrapper button[type="submit"].btn:hover {
  background: #d4502f !important;
}

/* Foco laranja em inputs (consistente com login/admin) */
.wrapper .form input.form-control:focus,
.wrapper .form textarea.form-control:focus,
.wrapper .form select:focus,
.wrapper input[type="text"]:focus,
.wrapper input[type="email"]:focus,
.wrapper input[type="password"]:focus,
.wrapper textarea:focus {
  border-color: #e05e3b !important;
  box-shadow: 0 0 0 3px rgba(224, 94, 59, .15) !important;
  outline: none !important;
}

/* Realce sutil no hover dos cards/ações */
.wrapper .navlink:hover,
.wrapper .preview:hover {
  border-color: #bcd6e4 !important;
}

/* ==========================================================================
   Abertura de chamado (page-create-ticket) — polish GV
   Cores/fonte vêm do tema; aqui: card, seções, dropzone, sugestões KB, aviso.
   Não altera lógica nem os campos personalizados (renderizados pela função HESK).
   ========================================================================== */
/* Form dentro de um card branco */
.page-create-ticket .main__content .contr {
  background: #fff !important;
  border: 1px solid #e3e0d8 !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 8px rgba(7, 72, 102, .08) !important;
  padding: 30px 32px !important;
  max-width: 760px;
  margin: 24px auto;
}
/* Heading com círculo navy (já tematizado) — leve ajuste */
.page-create-ticket .article__heading--form { color: #053246 !important; }
.page-create-ticket .article-heading-tip .required:after { color: #e05e3b !important; }

/* Rótulo de seção GV */
.page-create-ticket .gv-section-label {
  font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: #6f6c64; margin: 22px 0 14px; padding-bottom: 7px; border-bottom: 1px solid #e3e0d8;
}
/* "Anexos:" vira cabeçalho de seção também */
.page-create-ticket .param--attach > .label {
  display: block; font-size: .72rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: #6f6c64; margin-bottom: 12px;
}
.page-create-ticket .divider { background: #e3e0d8 !important; margin: 24px 0 !important; }

/* Sugestões da base de conhecimento como cartões */
.page-create-ticket .kb-suggestions {
  margin-top: 12px; background: #faf8f4; border: 1px solid #e3e0d8; border-radius: 10px; padding: 14px 16px;
}
.page-create-ticket .kb-suggestions h2 {
  font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #33312c; margin: 0 0 10px;
}
.page-create-ticket .kb-suggestions .suggest-preview {
  display: flex; align-items: center; gap: 11px; padding: 9px 10px; border-radius: 6px;
  text-decoration: none; box-shadow: none !important;
}
.page-create-ticket .kb-suggestions .suggest-preview:hover { background: #fff; }
.page-create-ticket .kb-suggestions .suggest-preview .icon-in-circle {
  background: #d7e6ee !important; color: #0a5d83 !important; flex-shrink: 0;
}
.page-create-ticket .kb-suggestions .suggest-preview__title { font-weight: 600; color: #053246 !important; }

/* Dropzone de anexos */
.page-create-ticket .param--attach .attach .dz-default,
.page-create-ticket .param--attach .dropzone {
  border: 2px dashed #e3e0d8 !important; border-radius: 10px !important; background: #faf8f4 !important;
  color: #6f6c64 !important; transition: border-color .15s, background .15s;
}
.page-create-ticket .param--attach .dropzone:hover { border-color: #0d72a0 !important; background: #fff !important; }

/* Aviso "antes de enviar" como alerta info azul */
.page-create-ticket .alert.browser-default {
  background: #d7e6ee !important; border: 1px solid #bcd6e4 !important; border-radius: 10px !important;
  color: #074866 !important;
}
.page-create-ticket .alert.browser-default .font-weight-bold { color: #053246 !important; }

/* CTA principal (já laranja pelo tema) — peso/altura */
.page-create-ticket .form-footer .btn-full { min-height: 48px; padding: 0 28px; font-size: 1rem; }

/* ==========================================================================
   Acompanhamento do chamado (page-view-ticket) — polish GV
   Conversa em cards (original neutro / resposta da equipe navy-tint) + sidebar
   de detalhes navy + status em pílula. Não altera lógica/JS.
   ========================================================================== */
/* Layout 2 colunas (conversa + detalhes) */
.page-view-ticket .ticket { display: grid; grid-template-columns: 1fr 312px; gap: 22px; align-items: start; }
.page-view-ticket .ticket__title, .page-view-ticket .original-message > h1 {
  font-size: 1.4rem; font-weight: 700; color: #053246 !important; letter-spacing: -.01em;
}

/* Blocos de mensagem viram cards */
.page-view-ticket .ticket__body_block {
  background: #fff !important; border: 1px solid #e3e0d8 !important; border-radius: 10px !important;
  box-shadow: 0 2px 8px rgba(7,72,102,.08) !important; margin-bottom: 16px; overflow: hidden; padding: 0 !important;
}
.page-view-ticket .ticket__body_block .block--head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 18px !important; border-bottom: 1px solid #f1efe9 !important;
}
/* Resposta da equipe = cabeçalho navy-tint (distingue do cliente) */
.page-view-ticket .ticket__body_block.response { background: #fbfdfe !important; }
.page-view-ticket .ticket__body_block.response .block--head { background: #d7e6ee !important; border-bottom-color: #bcd6e4 !important; }
.page-view-ticket .ticket__body_block.response .contact b { color: #0a5d83 !important; }
.page-view-ticket .ticket__body_block .contact { font-size: .85rem; color: #6f6c64; }
.page-view-ticket .ticket__body_block .contact b { color: #053246; font-weight: 600; }
.page-view-ticket .ticket__body_block .block--description { padding: 16px 18px !important; font-size: .92rem; line-height: 1.65; color: #053246; }
.page-view-ticket .ticket__body_block .block--uploads { padding: 0 18px 14px !important; }
.page-view-ticket .ticket__body_block .block--uploads a {
  display: inline-flex; align-items: center; gap: 6px; background: #d7e6ee; border: 1px solid #bcd6e4;
  color: #0a5d83 !important; border-radius: 999px; padding: 4px 12px; font-weight: 600; font-size: .82rem; text-decoration: none;
}
/* Botão de imprimir (ação) */
.page-view-ticket .btn-action {
  border: 1px solid #e3e0d8 !important; border-radius: 6px !important; background: #fff !important; color: #6f6c64 !important;
}
.page-view-ticket .btn-action:hover { border-color: #0d72a0 !important; color: #0a5d83 !important; }

/* Form de resposta */
.page-view-ticket .form--reply .label { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: #6f6c64; }
.page-view-ticket .form--reply .form__submit .btn-full { min-height: 46px; padding: 0 26px; }

/* Sidebar de detalhes */
.page-view-ticket .ticket__params .params--block.details {
  background: #fff !important; border: 1px solid #e3e0d8 !important; border-radius: 10px !important;
  box-shadow: 0 2px 8px rgba(7,72,102,.08) !important; overflow: hidden; padding: 0 !important; position: sticky; top: 20px;
}
.page-view-ticket .params--block .accordion-title {
  display: flex; align-items: center; justify-content: space-between; margin: 0 !important;
  background: #074866 !important; color: #fff !important; padding: 13px 16px !important; font-size: .82rem; font-weight: 700;
}
.page-view-ticket .params--block .accordion-title span,
.page-view-ticket .params--block .accordion-title .btn.link { color: #fff !important; }
.page-view-ticket .params--block .accordion-title .btn.link { font-size: .74rem; font-weight: 500; }
.page-view-ticket .params--block .accordion-body { padding: 6px 16px 14px !important; }
.page-view-ticket .params--block .row {
  display: flex; justify-content: space-between; gap: 12px; padding: 9px 0 !important;
  border-bottom: 1px solid #f1efe9 !important; font-size: .83rem;
}
.page-view-ticket .params--block .row:last-child { border-bottom: none !important; }
.page-view-ticket .params--block .row .title { color: #6f6c64 !important; }
.page-view-ticket .params--block .row .value { color: #053246 !important; font-weight: 600; text-align: right; }

/* Status como pílula (classes default do HESK) — escopo view-ticket */
.page-view-ticket .params--block .value .open,
.page-view-ticket .params--block .value .inprogress,
.page-view-ticket .params--block .value .waitingreply,
.page-view-ticket .params--block .value .replied,
.page-view-ticket .params--block .value .onhold,
.page-view-ticket .params--block .value .resolved {
  display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: .72rem; font-weight: 600; line-height: 1.5;
}
.page-view-ticket .params--block .value .open        { background:#e7edf0; color:#3f5663 !important; }
.page-view-ticket .params--block .value .inprogress  { background:#d9eaf3; color:#0a5d83 !important; }
.page-view-ticket .params--block .value .waitingreply{ background:#fbf0d8; color:#9a6c10 !important; }
.page-view-ticket .params--block .value .replied     { background:#d7e6ee; color:#074866 !important; }
.page-view-ticket .params--block .value .onhold      { background:#ece6f7; color:#5b3f9e !important; }
.page-view-ticket .params--block .value .resolved    { background:#e2f1ea; color:#2e7d54 !important; }

@media (max-width: 820px){ .page-view-ticket .ticket { grid-template-columns: 1fr; } }

/* ==========================================================================
   Meus chamados (page-my-tickets) — tabela GV (espelha a fila admin)
   ========================================================================== */
.page-my-tickets .table-wrap {
  background: #fff !important; border: 1px solid #e3e0d8 !important; border-radius: 10px !important;
  overflow: hidden; box-shadow: 0 2px 8px rgba(7,72,102,.08) !important;
}
.page-my-tickets .table { background: #fff; font-size: .85rem; }
.page-my-tickets .table thead { background: #074866 !important; }
.page-my-tickets .table thead th {
  background: #074866 !important; color: #fff !important; font-weight: 600; font-size: .72rem;
  text-transform: uppercase; letter-spacing: .04em; padding: 11px 14px; border: none;
}
.page-my-tickets .table thead th a, .page-my-tickets .table thead th .sort span { color: #fff !important; text-decoration: none; }
.page-my-tickets .table thead th .handle, .page-my-tickets .table thead th .sort i { opacity: .7; filter: brightness(0) invert(1); }
.page-my-tickets .table tbody td { padding: 11px 14px; border-bottom: 1px solid #f1efe9; color: #053246; vertical-align: middle; }
.page-my-tickets .table tbody tr:nth-child(even) { background: #faf8f4; }
.page-my-tickets .table tbody tr:hover { background: #d7e6ee; }
.page-my-tickets .table tbody tr:last-child td { border-bottom: none; }
.page-my-tickets .table tbody td a { color: #0a5d83 !important; font-weight: 600; text-decoration: none; }
.page-my-tickets .table tbody td a:hover { text-decoration: underline; }

/* Status como pílula */
.page-my-tickets .table tbody td .open,
.page-my-tickets .table tbody td .inprogress,
.page-my-tickets .table tbody td .waitingreply,
.page-my-tickets .table tbody td .replied,
.page-my-tickets .table tbody td .onhold,
.page-my-tickets .table tbody td .resolved {
  display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: .72rem; font-weight: 600; line-height: 1.5;
}
.page-my-tickets .table tbody td .open        { background:#e7edf0; color:#3f5663 !important; }
.page-my-tickets .table tbody td .inprogress  { background:#d9eaf3; color:#0a5d83 !important; }
.page-my-tickets .table tbody td .waitingreply{ background:#fbf0d8; color:#9a6c10 !important; }
.page-my-tickets .table tbody td .replied     { background:#d7e6ee; color:#074866 !important; }
.page-my-tickets .table tbody td .onhold      { background:#ece6f7; color:#5b3f9e !important; }
.page-my-tickets .table tbody td .resolved    { background:#e2f1ea; color:#2e7d54 !important; }

/* Busca + paginação */
.page-my-tickets .help-search input:focus { border-color: #e05e3b !important; box-shadow: 0 0 0 3px rgba(224,94,59,.15) !important; }
.page-my-tickets .pager a, .page-my-tickets .pager .page {
  border: 1px solid #e3e0d8 !important; border-radius: 6px !important; background: #fff !important; color: #0a5d83 !important; font-weight: 600;
}
.page-my-tickets .pager a:hover { background: #d7e6ee !important; }
.page-my-tickets .pager .current, .page-my-tickets .pager a.current {
  background: #074866 !important; color: #fff !important; border-color: #074866 !important;
}

/* ==========================================================================
   Telas de conta (registro/login/reset/MFA/verificação/perfil)
   O tema JÁ entrega o card + heading + CTA laranja (ver login). Não adicionar
   outro card (evita nested cards). Só rótulos em maiúscula p/ consistência.
   ========================================================================== */
.page-register .contr .label,
.page-reset-password .contr .label,
.page-mfa-needed .contr .label,
.page-profile .contr .label {
  font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: #33312c;
}

/* ==========================================================================
   Base de conhecimento (view-category / view-article / search-results) — GV
   Artigos como cards com ícone navy; busca com foco laranja. Sem mudar markup.
   ========================================================================== */
.page-view-category .help-search input:focus,
.page-view-article .help-search input:focus,
.page-search-results .help-search input:focus {
  border-color: #e05e3b !important; box-shadow: 0 0 0 3px rgba(224,94,59,.15) !important; outline: none;
}
.page-view-category .block__head .h-3,
.page-view-article .block__head .h-3,
.page-search-results .block__head .h-3 { color: #053246 !important; }
.page-view-category .block__head .icon-in-circle,
.page-view-article .block__head .icon-in-circle,
.page-search-results .block__head .icon-in-circle { background: #d7e6ee !important; color: #0a5d83 !important; }

/* Artigo (preview) como card */
.page-view-category .preview,
.page-view-article .preview,
.page-search-results .preview {
  display: flex; align-items: flex-start; gap: 13px;
  background: #fff !important; border: 1px solid #e3e0d8 !important; border-radius: 10px !important;
  box-shadow: 0 2px 8px rgba(7,72,102,.08) !important; padding: 16px 18px !important; margin-bottom: 12px;
  text-decoration: none; transition: box-shadow .15s, transform .1s, border-color .15s;
}
.page-view-category .preview:hover,
.page-view-article .preview:hover,
.page-search-results .preview:hover {
  box-shadow: 0 8px 28px rgba(7,72,102,.14) !important; transform: translateY(-1px); border-color: #bcd6e4 !important;
}
.page-view-category .preview .icon-in-circle,
.page-view-article .preview .icon-in-circle,
.page-search-results .preview .icon-in-circle { background: #d7e6ee !important; color: #0a5d83 !important; flex-shrink: 0; }
.page-view-category .preview .preview__title,
.page-view-article .preview .preview__title,
.page-search-results .preview .preview__title { color: #053246 !important; font-weight: 600; }
.page-view-category .preview .navlink__descr,
.page-view-article .preview .navlink__descr,
.page-search-results .preview .navlink__descr { color: #6f6c64 !important; }

/* ==========================================================================
   Alertas/notificações — remover side-stripe (padrão banido) → borda completa
   ========================================================================== */
.wrapper .notification::before { display: none !important; }
.wrapper .notification {
  border: 1px solid var(--white-7); border-radius: 10px !important; padding-left: 16px !important;
}
.wrapper .notification.red    { border-color: var(--error) !important; }
.wrapper .notification.orange { border-color: var(--warning) !important; }
.wrapper .notification.green  { border-color: var(--success) !important; }
.wrapper .notification.blue   { border-color: var(--info) !important; }