/* OnLic — Tema corporativo verde */
:root {
  --onlic-primary:#3B6D11;--onlic-primary-light:#EAF3DE;--onlic-primary-mid:#639922;
  --onlic-primary-dark:#27500A;--onlic-primary-hover:#C0DD97;
  --onlic-sidebar-bg:#f8f9fa;--onlic-sidebar-border:#dde5d8;--onlic-sidebar-width:220px;
  --onlic-topbar-bg:#ffffff;--onlic-topbar-height:52px;--onlic-topbar-border:#e2e8e0;
  --onlic-text:#2C2C2A;--onlic-text-muted:#5F5E5A;--onlic-text-hint:#888780;
  --onlic-bg-page:#f4f6f3;--onlic-bg-card:#ffffff;
  --onlic-border:rgba(0,0,0,0.08);--onlic-border-medium:rgba(0,0,0,0.14);
  --onlic-vigente-bg:#EAF3DE;--onlic-vigente-border:#C0DD97;--onlic-vigente-text:#3B6D11;
  --onlic-alerta-bg:#FFF3CD;--onlic-alerta-border:#FAC775;--onlic-alerta-text:#BA7517;
  --onlic-vencida-bg:#FCEBEB;--onlic-vencida-border:#F7C1C1;--onlic-vencida-text:#A32D2D;
  --onlic-renovacao-bg:#E6F1FB;--onlic-renovacao-border:#B5D4F4;--onlic-renovacao-text:#185FA5;
  --onlic-finalizada-bg:#F1EFE8;--onlic-finalizada-border:#D3D1C7;--onlic-finalizada-text:#5F5E5A;
  --onlic-radius-sm:6px;--onlic-radius-md:8px;--onlic-radius-lg:12px;--onlic-radius-pill:20px;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:'Inter','Segoe UI',system-ui,sans-serif;font-size:14px;color:var(--onlic-text);background:var(--onlic-bg-page);line-height:1.6}
a{color:var(--onlic-primary);text-decoration:none}a:hover{text-decoration:underline}
.onlic-wrapper{display:flex;min-height:100vh}
.onlic-sidebar{width:var(--onlic-sidebar-width);min-width:var(--onlic-sidebar-width);background:var(--onlic-sidebar-bg);border-right:0.5px solid var(--onlic-sidebar-border);display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;height:100vh;z-index:100;overflow:hidden}
.onlic-sidebar-logo{padding:16px 20px;border-bottom:0.5px solid var(--onlic-sidebar-border);display:flex;align-items:center;gap:10px}
.onlic-sidebar-logo-icon{width:32px;height:32px;border-radius:var(--onlic-radius-sm);background:var(--onlic-primary);display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px}
.onlic-sidebar-logo-text{font-size:16px;font-weight:500;color:var(--onlic-text)}
.onlic-sidebar-nav{padding:12px 10px;flex:1;min-height:0;display:flex;flex-direction:column;gap:2px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(59,109,17,.3) transparent}
.onlic-nav-section{margin:8px 0 4px;padding:0 12px;font-size:10px;color:var(--onlic-text-hint);font-weight:500;text-transform:uppercase;letter-spacing:.06em}
.onlic-nav-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:var(--onlic-radius-sm);color:var(--onlic-text-muted);cursor:pointer;transition:background .15s,color .15s;text-decoration:none;font-size:13px}
.onlic-nav-item:hover{background:var(--onlic-primary-light);color:var(--onlic-primary);text-decoration:none}
.onlic-nav-item.active{background:var(--onlic-primary);color:#fff}
.onlic-nav-item i{font-size:17px}
.onlic-sidebar-user{display:none}
.onlic-avatar{width:30px;height:30px;border-radius:50%;background:var(--onlic-primary-hover);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:500;color:var(--onlic-primary-dark);flex-shrink:0}
.onlic-main{margin-left:var(--onlic-sidebar-width);flex:1;display:flex;flex-direction:column;min-height:100vh}
.onlic-topbar{background:var(--onlic-topbar-bg);border-bottom:0.5px solid var(--onlic-topbar-border);height:var(--onlic-topbar-height);padding:0 24px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:90}
.onlic-topbar-title{font-size:15px;font-weight:500;color:var(--onlic-text)}
.onlic-tenant-badge{background:var(--onlic-primary-light);border:0.5px solid var(--onlic-primary-hover);border-radius:var(--onlic-radius-pill);padding:4px 14px;font-size:12px;color:var(--onlic-primary);font-weight:500;cursor:pointer;display:flex;align-items:center;gap:6px}
.onlic-page{padding:24px;flex:1}
.onlic-page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.onlic-page-title{font-size:18px;font-weight:500;color:var(--onlic-text);margin:0}
.onlic-card{background:var(--onlic-bg-card);border:0.5px solid var(--onlic-border);border-radius:var(--onlic-radius-lg);padding:16px 20px}
.onlic-card-title{font-size:13px;font-weight:500;color:var(--onlic-text);margin:0 0 12px}
.onlic-metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:20px}
.onlic-metric{background:var(--onlic-bg-card);border:0.5px solid var(--onlic-border);border-radius:var(--onlic-radius-md);padding:14px 16px}
.onlic-metric-label{font-size:11px;color:var(--onlic-text-hint);margin-bottom:6px}
.onlic-metric-value{font-size:24px;font-weight:500}
.onlic-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:var(--onlic-radius-pill);font-size:12px;font-weight:500;border:0.5px solid transparent}
.onlic-badge-vigente{background:var(--onlic-vigente-bg);border-color:var(--onlic-vigente-border);color:var(--onlic-vigente-text)}
.onlic-badge-alerta{background:var(--onlic-alerta-bg);border-color:var(--onlic-alerta-border);color:var(--onlic-alerta-text)}
.onlic-badge-vencida{background:var(--onlic-vencida-bg);border-color:var(--onlic-vencida-border);color:var(--onlic-vencida-text)}
.onlic-badge-renovacao{background:var(--onlic-renovacao-bg);border-color:var(--onlic-renovacao-border);color:var(--onlic-renovacao-text)}
.onlic-badge-finalizada{background:var(--onlic-finalizada-bg);border-color:var(--onlic-finalizada-border);color:var(--onlic-finalizada-text)}
.onlic-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:var(--onlic-radius-md);font-size:13px;font-weight:500;cursor:pointer;border:0.5px solid transparent;transition:background .15s,opacity .15s;text-decoration:none}
.onlic-btn-primary{background:var(--onlic-primary);color:#fff;border-color:var(--onlic-primary-dark)}
.onlic-btn-primary:hover{background:var(--onlic-primary-dark);color:#fff;text-decoration:none}
.onlic-btn-outline{background:transparent;color:var(--onlic-primary);border-color:var(--onlic-primary)}
.onlic-btn-outline:hover{background:var(--onlic-primary-light);text-decoration:none}
.onlic-btn-danger{background:#A32D2D;color:#fff;border-color:#791F1F}
.onlic-btn-danger:hover{background:#791F1F;color:#fff;text-decoration:none}
.onlic-btn-sm{padding:5px 12px;font-size:12px}
.onlic-table-wrap{overflow-x:auto}
.onlic-table{width:100%;border-collapse:collapse;font-size:13px}
.onlic-table th{text-align:left;padding:10px 14px;font-size:11px;font-weight:500;color:var(--onlic-text-hint);text-transform:uppercase;letter-spacing:.04em;border-bottom:0.5px solid var(--onlic-border-medium);white-space:nowrap}
.onlic-table td{padding:11px 14px;border-bottom:0.5px solid var(--onlic-border);color:var(--onlic-text);vertical-align:middle}
.onlic-table tr:last-child td{border-bottom:none}
.onlic-table tbody tr:hover td{background:var(--onlic-primary-light)}
.onlic-form-group{margin-bottom:16px}
.onlic-label{display:block;font-size:12px;font-weight:500;color:var(--onlic-text-muted);margin-bottom:5px}
.onlic-input,.onlic-select,.onlic-textarea{width:100%;padding:8px 12px;border:0.5px solid var(--onlic-border-medium);border-radius:var(--onlic-radius-md);font-size:13px;color:var(--onlic-text);background:#fff;transition:border-color .15s;outline:none}
.onlic-input:focus,.onlic-select:focus,.onlic-textarea:focus{border-color:var(--onlic-primary-mid);box-shadow:0 0 0 3px rgba(59,109,17,.12)}
.onlic-textarea{resize:vertical;min-height:80px}
.onlic-alert{padding:10px 14px;border-radius:var(--onlic-radius-md);font-size:13px;display:flex;align-items:flex-start;gap:8px;margin-bottom:16px}
.onlic-alert-danger{background:var(--onlic-vencida-bg);color:var(--onlic-vencida-text);border:0.5px solid var(--onlic-vencida-border)}
.onlic-alert-warning{background:var(--onlic-alerta-bg);color:var(--onlic-alerta-text);border:0.5px solid var(--onlic-alerta-border)}
.onlic-alert-success{background:var(--onlic-vigente-bg);color:var(--onlic-vigente-text);border:0.5px solid var(--onlic-vigente-border)}
.onlic-alert-info{background:var(--onlic-renovacao-bg);color:var(--onlic-renovacao-text);border:0.5px solid var(--onlic-renovacao-border)}
.text-muted{color:var(--onlic-text-hint)}.text-primary{color:var(--onlic-primary)}.text-danger{color:var(--onlic-vencida-text)}.text-warning{color:var(--onlic-alerta-text)}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}.mb-1{margin-bottom:8px}.mb-2{margin-bottom:16px}.mb-3{margin-bottom:24px}
.d-flex{display:flex}.align-center{align-items:center}.gap-2{gap:8px}.gap-3{gap:12px}.w-100{width:100%}

/* ============================================================
   Modo escuro
   ============================================================ */
body.dark-mode {
  --onlic-primary:          #4e8f17;
  --onlic-primary-light:    #1a2e0a;
  --onlic-primary-mid:      #5aaa1c;
  --onlic-primary-dark:     #3a6b10;
  --onlic-primary-hover:    #2d4d10;
  --onlic-sidebar-bg:       #1a1f1a;
  --onlic-sidebar-border:   #2a332a;
  --onlic-topbar-bg:        #141914;
  --onlic-topbar-border:    #2a332a;
  --onlic-text:             #b8c8b8;
  --onlic-text-muted:       #8a9e8a;
  --onlic-text-hint:        #5a6e5a;
  --onlic-bg-page:          #0f130f;
  --onlic-bg-card:          #161b16;
  --onlic-border:           rgba(255,255,255,0.07);
  --onlic-border-medium:    rgba(255,255,255,0.12);
  --onlic-vigente-bg:       #0d1f05;
  --onlic-vigente-border:   #1e4009;
  --onlic-vigente-text:     #6abf3a;
  --onlic-alerta-bg:        #1f1500;
  --onlic-alerta-border:    #4d3500;
  --onlic-alerta-text:      #e6a020;
  --onlic-vencida-bg:       #1f0505;
  --onlic-vencida-border:   #4d0e0e;
  --onlic-vencida-text:     #e05555;
  --onlic-renovacao-bg:     #051525;
  --onlic-renovacao-border: #0d3060;
  --onlic-renovacao-text:   #4da0e6;
  --onlic-finalizada-bg:    #1a1a1a;
  --onlic-finalizada-border:#333;
  --onlic-finalizada-text:  #888;
}

body.dark-mode .onlic-input,
body.dark-mode .onlic-select,
body.dark-mode .onlic-textarea {
  background: #1e241e;
  color: var(--onlic-text);
  border-color: var(--onlic-border-medium);
}

body.dark-mode .onlic-table tbody tr:hover td {
  background: #1e281e;
}

body.dark-mode .plano-card {
  background: #1a1f1a;
}

/* Modo escuro - filtros da timeline e inputs gerais */
body.dark-mode .tl-filters select,
body.dark-mode .tl-filters input[type="month"],
body.dark-mode .tl-filters input[type="number"] {
  background: #1e241e;
  color: var(--onlic-text);
  border-color: var(--onlic-border-medium);
}

body.dark-mode select option {
  background: #1e241e;
  color: var(--onlic-text);
}

/* Modo escuro - campos de formulário e inputs específicos */
body.dark-mode input[type="text"],
body.dark-mode input[type="email"],
body.dark-mode input[type="password"],
body.dark-mode input[type="number"],
body.dark-mode input[type="date"],
body.dark-mode input[type="month"],
body.dark-mode input[type="file"],
body.dark-mode input[type="search"],
body.dark-mode textarea,
body.dark-mode select {
  background: #1e241e !important;
  color: var(--onlic-text) !important;
  border-color: var(--onlic-border-medium) !important;
  color-scheme: dark;
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
  color: var(--onlic-text-hint) !important;
}

/* Modo escuro - campos readonly e disabled */
body.dark-mode input[readonly],
body.dark-mode input[disabled] {
  background: #161b16 !important;
  color: var(--onlic-text-hint) !important;
  border-color: var(--onlic-border) !important;
}

/* Modo escuro - fix autofill e webkit */
body.dark-mode input:-webkit-autofill,
body.dark-mode input:-webkit-autofill:hover,
body.dark-mode input:-webkit-autofill:focus,
body.dark-mode input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px #1e241e inset !important;
  -webkit-text-fill-color: var(--onlic-text) !important;
  caret-color: var(--onlic-text) !important;
}

/* Fix específico para campos readonly no webkit */
body.dark-mode input[readonly] {
  -webkit-box-shadow: 0 0 0 1000px #161b16 inset !important;
  -webkit-text-fill-color: var(--onlic-text-hint) !important;
}


/* ============================================================
   Scrollbar personalizada
   ============================================================ */

/* Webkit (Chrome, Edge, Safari) */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(59, 109, 17, 0.35);
  border-radius: 10px;
  transition: background .2s;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(59, 109, 17, 0.7);
}

/* Modo escuro */
body.dark-mode ::-webkit-scrollbar-thumb {
  background: rgba(99, 153, 34, 0.3);
}
body.dark-mode ::-webkit-scrollbar-thumb:hover {
  background: rgba(99, 153, 34, 0.6);
}

/* Firefox */
html, body, * {
  scrollbar-width: thin !important;
  scrollbar-color: rgba(59, 109, 17, 0.4) transparent !important;
}
body.dark-mode *,
body.dark-mode html {
  scrollbar-color: rgba(99, 153, 34, 0.4) transparent !important;
}

/* Webkit força */
html::-webkit-scrollbar,
body::-webkit-scrollbar,
*::-webkit-scrollbar { width: 6px !important; height: 6px !important; }
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
*::-webkit-scrollbar-track { background: transparent !important; }
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
*::-webkit-scrollbar-thumb {
  background: rgba(59, 109, 17, 0.4) !important;
  border-radius: 10px !important;
}
html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
*::-webkit-scrollbar-thumb:hover { background: rgba(59, 109, 17, 0.75) !important; }

/* ============================================================
   Responsivo Mobile (PWA)
   ============================================================ */
@media (max-width: 768px) {
  /* Sidebar vira drawer */
  .onlic-sidebar {
    transform: translateX(-100%);
    transition: transform .25s ease;
    z-index: 200;
    box-shadow: 4px 0 20px rgba(0,0,0,.3);
  }
  .onlic-sidebar.mobile-open {
    transform: translateX(0);
  }

  /* Conteúdo ocupa tela toda */
  .onlic-main {
    margin-left: 0 !important;
    width: 100%;
  }

  /* Overlay quando sidebar aberto */
  .sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 199;
  }
  .sidebar-overlay.show { display: block; }

  /* Topbar mobile */
  .onlic-topbar {
    padding: 0 12px;
    position: sticky;
    top: 0;
    z-index: 100;
  }
  .onlic-topbar-title { font-size: 15px; }
  .onlic-topbar-right { gap: 6px; }

  /* Página */
  .onlic-page { padding: 12px; }

  /* Métricas em 2 colunas */
  .onlic-metric-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  .onlic-metric { padding: 12px; }
  .onlic-metric-value { font-size: 22px; }

  /* Cards */
  .onlic-card { padding: 12px; margin-bottom: 12px; }
  .onlic-card-title { font-size: 14px; }

  /* Tabelas — scroll horizontal */
  .onlic-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .onlic-table { min-width: 500px; font-size: 12px; }
  .onlic-table th, .onlic-table td { padding: 8px 10px; }

  /* Forms em coluna única */
  .onlic-card > form > div[style*="grid-template-columns"],
  .onlic-card div[style*="grid-template-columns:1fr 1fr"],
  .onlic-card div[style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  div[style*="grid-column:span 2"],
  div[style*="grid-column: span 2"] {
    grid-column: span 1 !important;
  }

  /* Page header empilha */
  .onlic-page-header {
    flex-wrap: wrap;
    gap: 8px;
  }

  /* Filtros em coluna */
  form[style*="display:flex"] { flex-direction: column !important; }

  /* Botões menores */
  .onlic-btn { font-size: 13px; padding: 7px 12px; }

  /* Mini sidebar desabilitado no mobile */
  .onlic-sidebar.mini { width: var(--onlic-sidebar-width) !important; }
  .onlic-main.mini-margin { margin-left: 0 !important; }
}

@media (max-width: 480px) {
  .onlic-metric-grid { grid-template-columns: 1fr 1fr !important; }
  .onlic-topbar-title { font-size: 13px; max-width: 140px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}