/* =========================================================
   IMPERIAL CARCINICULTURA
   TEMA GLOBAL MODERNO V1
   Baseado no mockup aprovado
   ========================================================= */

:root{
  --imp-bg: #eef2f6;
  --imp-surface: #ffffff;
  --imp-surface-2: #f7f9fc;

  --imp-sidebar-1: #02162f;
  --imp-sidebar-2: #052956;
  --imp-sidebar-3: #083767;

  --imp-card-1: #0b0f14;
  --imp-card-2: #101a24;
  --imp-card-3: #12263a;

  --imp-border: #d9e2ec;
  --imp-border-2: rgba(255,255,255,.10);

  --imp-text: #162738;
  --imp-text-soft: #698096;
  --imp-text-white: #ffffff;

  --imp-orange: #ff7a00;
  --imp-orange-2: #ff9b2f;
  --imp-orange-3: #ffb45c;

  --imp-blue: #00c2ff;
  --imp-red: #ff5b64;
  --imp-green: #19c37d;
  --imp-yellow: #ffcb3d;

  --imp-shadow-soft: 0 10px 30px rgba(6, 25, 44, .08);
  --imp-shadow-card: 0 14px 30px rgba(5, 18, 33, .18);
  --imp-radius: 16px;
  --imp-radius-sm: 12px;
}

html, body{
  background: var(--imp-bg) !important;
  color: var(--imp-text) !important;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
}

/* =========================================================
   SIDEBAR
   ========================================================= */

.dashboard-sidebar,
.sidebar,
aside.dashboard-sidebar,
aside.sidebar{
  background:
    radial-gradient(circle at top left, rgba(0,194,255,.18), transparent 26%),
    linear-gradient(180deg, var(--imp-sidebar-2) 0%, var(--imp-sidebar-1) 100%) !important;
  color: #fff !important;
  border-right: 1px solid rgba(255,255,255,.06) !important;
  box-shadow: inset -1px 0 0 rgba(255,255,255,.03) !important;
}

.sidebar-brand{
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  padding-bottom: 18px !important;
  margin-bottom: 18px !important;
}

.sidebar-brand-icon{
  width: 54px !important;
  height: 54px !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, #00d8ff 0%, #1296ff 100%) !important;
  box-shadow: 0 8px 20px rgba(0,194,255,.25) !important;
}

.sidebar-brand-text strong{
  color: #fff !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  letter-spacing: -.02em !important;
}

.sidebar-brand-text small{
  color: #ff8f1f !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

.sidebar-section{
  color: rgba(255,255,255,.55) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  margin: 18px 0 10px !important;
}

.sidebar-nav a,
.sidebar-nav .nav-link,
.sidebar-nav .menu-link{
  color: rgba(255,255,255,.92) !important;
  border-radius: 14px !important;
  padding: 12px 14px !important;
  margin: 6px 0 !important;
  transition: all .22s ease !important;
  border: 1px solid transparent !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-weight: 700 !important;
}

.sidebar-nav a:hover,
.sidebar-nav .nav-link:hover,
.sidebar-nav .menu-link:hover{
  background: rgba(255,255,255,.07) !important;
  border-color: rgba(255,255,255,.08) !important;
  transform: translateX(1px) !important;
}

.sidebar-nav a.active,
.sidebar-nav .nav-link.active,
.sidebar-nav .menu-link.active{
  background:
    linear-gradient(180deg, #ff8e24 0%, #f76300 100%) !important;
  color: #fff !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.08),
    0 10px 24px rgba(255,122,0,.28) !important;
}

.sidebar-nav a.active .sidebar-nav-icon,
.sidebar-nav .nav-link.active .sidebar-nav-icon,
.sidebar-nav .menu-link.active .sidebar-nav-icon{
  color: #fff !important;
}

.sidebar-nav-icon{
  width: 22px !important;
  text-align: center !important;
  font-size: 18px !important;
  opacity: .95 !important;
}

.sidebar-bottom,
.sidebar-system-card{
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 18px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
}

.sidebar-system-card small{
  color: rgba(255,255,255,.55) !important;
}

.sidebar-system-card strong{
  color: #fff !important;
}

.system-online{
  display:inline-block !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 999px !important;
  background: #22d37d !important;
  box-shadow: 0 0 0 4px rgba(34,211,125,.16) !important;
  margin-right: 8px !important;
}

/* =========================================================
   TOPO / CONTEÚDO
   ========================================================= */

.dashboard-main,
.main-content,
.page-content,
.content,
main{
  background: var(--imp-bg) !important;
}

h1, h2, h3{
  color: #14283a !important;
  letter-spacing: -.02em !important;
}

.page-title,
.dashboard-title{
  font-weight: 900 !important;
}

.subtitle,
.page-subtitle,
.text-muted{
  color: var(--imp-text-soft) !important;
}

/* =========================================================
   CARDS / KPIs
   ========================================================= */

.metric-card,
.kpi-card,
.stat-card,
.summary-card,
.dashboard-card,
.card-dark,
.card-kpi,
.top-card{
  background:
    radial-gradient(circle at top right, rgba(255,122,0,.10), transparent 22%),
    linear-gradient(135deg, #0b0f14 0%, #112235 55%, #0f1620 100%) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  border-bottom: 3px solid var(--imp-orange) !important;
  border-radius: 18px !important;
  box-shadow: var(--imp-shadow-card) !important;
}

.metric-card *,
.kpi-card *,
.stat-card *,
.summary-card *,
.dashboard-card *,
.card-dark *,
.card-kpi *,
.top-card *{
  color: inherit !important;
}

.metric-card .value,
.kpi-card .value,
.stat-card .value,
.summary-card .value,
.dashboard-card .value{
  font-size: 20px !important;
  font-weight: 900 !important;
}

.metric-card .label,
.kpi-card .label,
.stat-card .label,
.summary-card .label,
.dashboard-card .label{
  opacity: .92 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

/* =========================================================
   BLOCOS / PAINÉIS
   ========================================================= */

.panel,
.block,
.widget,
.box,
.content-card,
.section-card,
.card,
.tile{
  background: var(--imp-surface) !important;
  border: 1px solid var(--imp-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--imp-shadow-soft) !important;
}

.card-header,
.panel-header,
.widget-header,
.section-header{
  border-bottom: 1px solid #edf2f7 !important;
}

/* =========================================================
   ABAS
   ========================================================= */

.tabs,
.tab-group,
.segmented,
.nav-tabs{
  background: #eef3f7 !important;
  border-radius: 16px !important;
  padding: 4px !important;
  border: 1px solid #d9e3ec !important;
}

.tabs button,
.tab-group button,
.segmented button,
.nav-tabs button,
.nav-tabs .tab,
.nav-tabs .nav-link{
  border-radius: 12px !important;
  font-weight: 800 !important;
  color: #3d556b !important;
  border: 0 !important;
  background: transparent !important;
}

.tabs button.active,
.tab-group button.active,
.segmented button.active,
.nav-tabs button.active,
.nav-tabs .tab.active,
.nav-tabs .nav-link.active{
  background: linear-gradient(180deg, #0d4f75 0%, #083454 100%) !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(8,52,84,.18) !important;
}

/* =========================================================
   BOTÕES
   ========================================================= */

button,
.btn{
  border-radius: 12px !important;
  font-weight: 800 !important;
  transition: all .18s ease !important;
}

button:hover,
.btn:hover{
  transform: translateY(-1px) !important;
}

.btn-primary,
button.primary,
button.btn-primary{
  background: linear-gradient(180deg, #ff922c 0%, #ff7300 100%) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: 0 8px 18px rgba(255,122,0,.22) !important;
}

.btn-primary:hover,
button.primary:hover,
button.btn-primary:hover{
  filter: brightness(1.03) !important;
}

.btn-secondary,
button.secondary,
button.btn-secondary{
  background: #fff !important;
  color: #173049 !important;
  border: 1px solid #cfd9e3 !important;
}

.btn-dark,
button.dark,
button.btn-dark{
  background: linear-gradient(180deg, #092d4a 0%, #051d31 100%) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.08) !important;
}

/* =========================================================
   INPUTS / SELECTS
   ========================================================= */

input,
select,
textarea{
  background: #fff !important;
  border: 1px solid #cfdae5 !important;
  border-radius: 12px !important;
  color: #183047 !important;
  box-shadow: none !important;
}

input::placeholder,
textarea::placeholder{
  color: #8aa0b3 !important;
}

input:focus,
select:focus,
textarea:focus{
  border-color: #ff9a3d !important;
  box-shadow: 0 0 0 4px rgba(255,122,0,.10) !important;
  outline: none !important;
}

/* =========================================================
   TABELAS
   ========================================================= */

.table-wrap,
.table-container{
  border-radius: 18px !important;
  overflow: hidden !important;
}

table{
  background: #fff !important;
  border-collapse: collapse !important;
}

thead th{
  background: linear-gradient(90deg, #15191e 0%, #20262d 100%) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .02em !important;
  border-bottom: 2px solid var(--imp-orange) !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  white-space: nowrap !important;
}

tbody td{
  color: #26384a !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-bottom: 1px solid #edf2f7 !important;
  vertical-align: middle !important;
}

tbody tr:hover{
  background: #f8fbff !important;
}

.table-negative,
.negative,
.text-danger,
.valor-negativo{
  color: var(--imp-red) !important;
  font-weight: 900 !important;
}

.table-positive,
.positive,
.text-success,
.valor-positivo{
  color: var(--imp-green) !important;
  font-weight: 900 !important;
}

/* =========================================================
   MODAIS
   ========================================================= */

.modal-content,
.modal-dialog,
.modal-panel,
.vl-modal,
.dash-modal{
  border-radius: 22px !important;
  border: 1px solid #dbe5ee !important;
  box-shadow: 0 24px 80px rgba(7,25,43,.22) !important;
  background: #fff !important;
}

.modal-header,
.dash-modal-header{
  border-bottom: 1px solid #e8eef4 !important;
}

.modal-title,
.dash-modal-title{
  color: #12314b !important;
  font-weight: 900 !important;
}

/* =========================================================
   PILLS / BADGES / STATUS
   ========================================================= */

.badge,
.status-badge,
.pill{
  border-radius: 999px !important;
  font-weight: 800 !important;
  padding: 5px 10px !important;
}

.badge-success,
.status-ativo{
  background: rgba(25,195,125,.12) !important;
  color: #0e9c60 !important;
}

.badge-warning,
.status-pendente{
  background: rgba(255,183,64,.14) !important;
  color: #b87400 !important;
}

.badge-danger,
.status-encerrado{
  background: rgba(255,91,100,.12) !important;
  color: #d43945 !important;
}

/* =========================================================
   PAGINAÇÃO
   ========================================================= */

.pagination button,
.pager button{
  min-width: 38px !important;
  height: 38px !important;
  border-radius: 10px !important;
  border: 1px solid #d9e3eb !important;
  background: #fff !important;
}

.pagination button.active,
.pager button.active{
  background: linear-gradient(180deg, #ff942f 0%, #ff7600 100%) !important;
  color: #fff !important;
  border-color: transparent !important;
}

/* =========================================================
   SCROLL
   ========================================================= */

::-webkit-scrollbar{
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-thumb{
  background: #aeb9c4;
  border-radius: 999px;
}

::-webkit-scrollbar-track{
  background: #ecf1f5;
}