/* ============================================================================ treeoficial-ui.css — Tema visual compartilhado TreeOficial (criado 2026-06-11) ---------------------------------------------------------------------------- Base extraída de cadastro_empresas_api.php. Contém só estilos GENÉRICOS (tokens, fontes, overrides de Bootstrap) + ajuste da navbar/modais do menu.php. Componentes específicos de tela (.company-card, .tgl, .gx-*) NÃO entram aqui — ficam em cada página. COMO USAR (página por página): adicione no da página migrada: Carregue-o DEPOIS do Bootstrap e DEPOIS do include do menu.php para que os overrides vençam. Páginas que não incluírem este arquivo NÃO mudam. ============================================================================ */ @import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,500;12..96,700;12..96,800&family=Hanken+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@500;700&display=swap'); :root{ --paper:#f3efe6; /* fundo papel quente */ --paper-2:#ece7da; --surface:#ffffff; --ink:#15241f; /* texto principal (verde-tinta quase preto) */ --ink-soft:#4d5b54; --muted:#7e8a82; --line:#e2dccd; /* bordas */ --line-strong:#d3cbb6; --brand:#0e7a64; /* esmeralda profunda */ --brand-ink:#0b5a4a; --brand-soft:#e2f0eb; --amber:#c47d2c; /* âmbar queimado (accent) */ --amber-soft:#f6ead6; --pos:#157347; --neg:#b5451e; --danger:#b23b1e; --shadow:0 1px 2px rgba(21,36,31,.04), 0 12px 30px -14px rgba(21,36,31,.20); --shadow-lift:0 2px 6px rgba(21,36,31,.06), 0 26px 50px -22px rgba(21,36,31,.34); --radius:16px; } *{ -webkit-font-smoothing:antialiased; } body{ background: radial-gradient(1100px 540px at 90% -8%, rgba(14,122,100,.10), transparent 60%), radial-gradient(900px 480px at -6% 4%, rgba(196,125,44,.10), transparent 58%), var(--paper); color:var(--ink); font-family:"Hanken Grotesk", system-ui, -apple-system, sans-serif; } /* helper p/ números monoespaçados/alinhados (saldos, contadores) */ .num{ font-family:"JetBrains Mono", ui-monospace, monospace; font-variant-numeric:tabular-nums; letter-spacing:-.02em; } /* ---- Títulos ---- */ h1,h2,h3,h4,h5,.h1,.h2,.h3,.h4,.h5{ font-family:"Bricolage Grotesque", sans-serif; letter-spacing:-.01em; } /* ---- NAVBAR (sobrescreve o gradiente azul do menu.php; só nas páginas migradas) ---- */ .navbar{ background:linear-gradient(135deg,#0e1b17 0%, #11352c 55%, #0e7a64 130%) !important; } .navbar-nav .nav-link:hover{ color:#bfe6db !important; } .navbar .btn-outline-danger{ color:#fff; border-color:rgba(255,255,255,.5); } .navbar .btn-outline-danger:hover{ background:#b23b1e; border-color:#b23b1e; color:#fff; } /* ---- Formulários ---- */ .form-label{ font-weight:600; font-size:13.5px; color:var(--ink); margin-bottom:6px; } .form-control,.form-select{ border:1px solid var(--line-strong); border-radius:10px; padding:10px 13px; background:#fcfbf7; color:var(--ink); transition:border-color .15s, box-shadow .15s, background .15s; } .form-control:focus,.form-select:focus{ border-color:var(--brand); box-shadow:0 0 0 3px rgba(14,122,100,.16); background:#fff; } .form-check-input:checked{ background-color:var(--brand); border-color:var(--brand); } .form-check-input:focus{ box-shadow:0 0 0 3px rgba(14,122,100,.16); border-color:var(--brand); } .form-check.form-switch .form-check-input{ cursor:pointer; } /* ---- Botões ---- */ .btn{ border-radius:10px; font-weight:600; } .btn-primary{ background:var(--brand); border-color:var(--brand); } .btn-primary:hover,.btn-primary:focus,.btn-primary:active{ background:var(--brand-ink)!important; border-color:var(--brand-ink)!important; } .btn-success{ background:var(--pos); border-color:var(--pos); } .btn-success:hover{ filter:brightness(.95); } .btn-warning{ background:var(--amber); border-color:var(--amber); color:#fff; } .btn-warning:hover{ filter:brightness(.96); color:#fff; } .btn-outline-primary{ color:var(--brand); border-color:var(--brand); } .btn-outline-primary:hover{ background:var(--brand); border-color:var(--brand); color:#fff; } /* ---- Cards ---- */ .card{ border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); } .card-header{ font-weight:700; } /* ---- Tabelas (ajuste leve — sem mexer em estrutura/alinhamento) ---- */ .table thead th{ font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); border-color:var(--line); font-weight:700; } .table tbody td{ vertical-align:middle; } /* ---- Modais (inclui os modais do menu.php: Alterar Senha / Notificações) ---- */ /* z-index acima da navbar do menu.php (1030). ATENÇÃO: se a página prender o modal num container com animação/transform (cria stacking context), o z-index não basta — tire a animação do container ou ponha os modais como filhos diretos do . */ .modal{ z-index:1060; } .modal-backdrop{ z-index:1055; } .modal-content{ border:0; border-radius:18px; box-shadow:var(--shadow-lift); overflow:hidden; } .modal-header{ background:linear-gradient(180deg,#13231e,#0e1b17) !important; color:#fff; border:0; } .modal-title{ font-family:"Bricolage Grotesque", sans-serif; font-weight:700; } .modal-header .btn-close,.modal-header .btn-close-white{ filter:invert(1) grayscale(1) brightness(2); } /* ---- Alertas / Badges ---- */ .alert{ border:0; border-radius:12px; border-left:4px solid var(--brand); } .alert-success{ border-left-color:var(--pos); } .alert-danger{ border-left-color:var(--danger); } .alert-warning{ border-left-color:var(--amber); } .badge.bg-primary{ background-color:var(--brand) !important; }