/* FaroAuto — classes utilitárias. Uma solução RGD Tecnologias.
   Substituem os antigos atributos style dos templates, para a CSP valer sem 'unsafe-inline'
   em style-src. Por isso levam !important: um atributo style vencia qualquer seletor da folha
   principal, e a classe precisa vencer do mesmo jeito para a tela não mudar.
   Nome: u-<propriedade>-<valor> (px sem unidade; n = negativo; 100p = 100%; fs-135 = 1.35rem).
   As .mt-0/.mb-0 do faroauto.css continuam como eram (sem !important): não confundir com u-mt-0.
   Os e-mails (templates/email) seguem com estilo inline: cliente de e-mail não lê folha externa. */

/* ---------- margens ---------- */
.u-m-0 { margin: 0 !important; }
.u-mb-0 { margin-bottom: 0 !important; }
.u-mb-4 { margin-bottom: 4px !important; }
.u-mb-6 { margin-bottom: 6px !important; }
.u-mb-8 { margin-bottom: 8px !important; }
.u-mb-10 { margin-bottom: 10px !important; }
.u-mb-12 { margin-bottom: 12px !important; }
.u-mb-14 { margin-bottom: 14px !important; }
.u-mb-16 { margin-bottom: 16px !important; }
.u-mb-18 { margin-bottom: 18px !important; }
.u-mb-20 { margin-bottom: 20px !important; }
.u-ml-auto { margin-left: auto !important; }
.u-mt-n8 { margin-top: -8px !important; }
.u-mt-n6 { margin-top: -6px !important; }
.u-mt-0 { margin-top: 0 !important; }
.u-mt-6 { margin-top: 6px !important; }
.u-mt-8 { margin-top: 8px !important; }
.u-mt-10 { margin-top: 10px !important; }
.u-mt-12 { margin-top: 12px !important; }
.u-mt-14 { margin-top: 14px !important; }
.u-mt-16 { margin-top: 16px !important; }
.u-mt-18 { margin-top: 18px !important; }
.u-mt-20 { margin-top: 20px !important; }
.u-mt-22 { margin-top: 22px !important; }
.u-mt-28 { margin-top: 28px !important; }
.u-mt-48 { margin-top: 48px !important; }
.u-mx-0 { margin-left: 0 !important; margin-right: 0 !important; }
.u-mx-16 { margin-left: 16px !important; margin-right: 16px !important; }
.u-my-10 { margin-top: 10px !important; margin-bottom: 10px !important; }
.u-my-12 { margin-top: 12px !important; margin-bottom: 12px !important; }
.u-my-18 { margin-top: 18px !important; margin-bottom: 18px !important; }

/* ---------- preenchimento ---------- */
.u-p-0 { padding: 0 !important; }
.u-p-14 { padding: 14px !important; }
.u-pb-24 { padding-bottom: 24px !important; }
.u-pl-18 { padding-left: 18px !important; }
.u-pl-20 { padding-left: 20px !important; }
.u-pt-0 { padding-top: 0 !important; }
.u-pt-20 { padding-top: 20px !important; }
.u-pt-36 { padding-top: 36px !important; }
.u-px-0 { padding-left: 0 !important; padding-right: 0 !important; }
.u-px-16 { padding-left: 16px !important; padding-right: 16px !important; }
.u-px-20 { padding-left: 20px !important; padding-right: 20px !important; }
.u-py-6 { padding-top: 6px !important; padding-bottom: 6px !important; }
.u-py-12 { padding-top: 12px !important; padding-bottom: 12px !important; }
.u-py-44 { padding-top: 44px !important; padding-bottom: 44px !important; }

/* ---------- flex e grid ---------- */
.u-ai-fstart { align-items: flex-start !important; }
.u-ai-start { align-items: start !important; }
.u-d-iflex { display: inline-flex !important; }
.u-d-inline { display: inline !important; }
.u-flex-1 { flex: 1 !important; }
.u-flex-240 { flex: 1 1 240px !important; }
.u-fw-wrap { flex-wrap: wrap !important; }
.u-gap-6 { gap: 6px !important; }
.u-gap-8 { gap: 8px !important; }
.u-gap-10 { gap: 10px !important; }
.u-jc-between { justify-content: space-between !important; }
.u-jc-center { justify-content: center !important; }
.u-jc-end { justify-content: flex-end !important; }
.u-jself-start { justify-self: start !important; }

/* ---------- largura e altura ---------- */
.u-mh-none { max-height: none !important; }
.u-minw-0 { min-width: 0 !important; }
.u-minw-56 { min-width: 56px !important; }
.u-minw-140 { min-width: 140px !important; }
.u-minw-150 { min-width: 150px !important; }
.u-minw-160 { min-width: 160px !important; }
.u-minw-180 { min-width: 180px !important; }
.u-minw-200 { min-width: 200px !important; }
.u-minw-220 { min-width: 220px !important; }
.u-minw-auto { min-width: auto !important; }
.u-mw-100p { max-width: 100% !important; }
.u-mw-180 { max-width: 180px !important; }
.u-mw-220 { max-width: 220px !important; }
.u-mw-260 { max-width: 260px !important; }
.u-mw-280 { max-width: 280px !important; }
.u-mw-320 { max-width: 320px !important; }
.u-mw-340 { max-width: 340px !important; }
.u-mw-360 { max-width: 360px !important; }
.u-mw-420 { max-width: 420px !important; }
.u-mw-640 { max-width: 640px !important; }
.u-mw-720 { max-width: 720px !important; }
.u-mw-760 { max-width: 760px !important; }
.u-mw-860 { max-width: 860px !important; }
.u-w-40 { width: 40px !important; }
.u-w-70 { width: 70px !important; }
.u-w-110 { width: 110px !important; }
.u-w-120 { width: 120px !important; }
.u-w-140 { width: 140px !important; }
.u-w-150 { width: 150px !important; }
.u-w-180 { width: 180px !important; }
.u-w-auto { width: auto !important; }

/* ---------- texto ---------- */
.u-fs-100 { font-size: 1rem !important; }
.u-fs-105 { font-size: 1.05rem !important; }
.u-fs-110 { font-size: 1.1rem !important; }
.u-fs-120 { font-size: 1.2rem !important; }
.u-fs-125 { font-size: 1.25rem !important; }
.u-fs-130 { font-size: 1.3rem !important; }
.u-fs-200 { font-size: 2rem !important; }
.u-fs-350 { font-size: 3.5rem !important; }
.u-lh-12 { line-height: 1.2 !important; }
.u-ow-any { overflow-wrap: anywhere !important; }
.u-ta-center { text-align: center !important; }
.u-ta-right { text-align: right !important; }
.u-td-none { text-decoration: none !important; }
.u-wb-all { word-break: break-all !important; }
.u-ws-normal { white-space: normal !important; }
.u-ws-nowrap { white-space: nowrap !important; }
.u-ws-pre-line { white-space: pre-line !important; }
.u-ws-pre-wrap { white-space: pre-wrap !important; }

/* ---------- cor ---------- */
.u-bg-beam-soft { background: #fff4e0 !important; }
.u-c-beam { color: var(--beam) !important; }
.u-c-beam-deep { color: var(--beam-deep) !important; }
.u-c-danger { color: var(--danger) !important; }
.u-c-dark-muted { color: #9fb0c8 !important; }
.u-c-dark-soft { color: #c5d0e0 !important; }

/* ---------- bordas ---------- */
.u-bdb-line { border-bottom: 1px solid var(--line) !important; }
.u-bdb-none { border-bottom: none !important; }
.u-bdr-none { border-right: none !important; }
.u-bdt-line { border-top: 1px solid var(--line) !important; }

/* ---------- telas específicas ---------- */
/* Ações do cadastro (/admin/r/…): uma coluna que encolhe com o painel. */
.acoes-col { display: grid !important; grid-template-columns: minmax(0,1fr) !important; gap: 10px !important; }
/* Central de Ajuda: atalhos para as seções. */
.ajuda-atalho { text-decoration: none !important; font-size: .85rem !important; padding: 6px 12px !important; }
/* Central de Ajuda: título de seção com ícone. */
.ajuda-titulo { font-size: 1.35rem !important; margin: 40px 0 14px !important; display: flex !important; gap: 10px !important; align-items: center !important; }
/* Histórico de e-mails: quadro da pré-visualização (a página dentro tem CSP própria). */
.email-quadro { display: block !important; width: 100% !important; height: 720px !important; border: 0 !important; background: #EEF2F7 !important; }
/* Histórico de e-mails: versão em texto. */
.email-texto { margin: 0 !important; white-space: pre-wrap !important; word-break: break-word !important; font-size: .86rem !important; line-height: 1.5 !important; max-height: 520px !important; overflow: auto !important; }
/* Fotos dos relatos. */
.foto-relato { height: auto !important; border-radius: 10px !important; display: block !important; }
/* Telegram: código de vínculo. */
.tg-codigo { font-size: 1.4rem !important; letter-spacing: .12em !important; text-align: center !important; }