/* =========================================================
   VARS & BASE
   ========================================================= */
:root{
  /* Cores do sidebar */
  --sidebar-bg:        #1f232a;
  --sidebar-bg-2:      #191d23;
  --sidebar-text:      #e6e7eb;
  --sidebar-muted:     #b3b7c0;
  --sidebar-accent:    #4cc9f0;
  --sidebar-sep:       rgba(255,255,255,.08);

  /* Layout do sidebar */
  --sidebar-w:         280px;   /* largura no desktop */

  /* Logo do sidebar */
  --sidebar-logo-h:    120px;   /* altura padrão do bloco do logo */
  --sidebar-logo-h-xl: 150px;   /* altura em telas grandes */
  --sidebar-logo-pad-y:16px;    /* respiro interno vertical */
  --sidebar-logo-pad-x:12px;    /* respiro interno horizontal */
}

/* Geral */
.table-responsive{ overflow: visible !important; }
.navbar.fixed-top { box-shadow: 0 1px 0 rgba(0,0,0,.06); }

/* =========================================================
   SIDEBAR FIXO (desktop)
   ========================================================= */
.admin-sidebar{
  position: fixed;                    /* não se mexe ao rolar a página */
  z-index: 1040;
  top: 0; left: 0; bottom: 0;         /* 100% da altura da janela */
  width: var(--sidebar-w);
  background: linear-gradient(180deg, var(--sidebar-bg), var(--sidebar-bg-2));
  color: var(--sidebar-text);
  padding: 16px 12px;
  border-radius: 0;                   /* retangular, sem cantos */
  box-shadow: none;                   /* sem sombras/margens claras */
  overflow-y: auto;                   /* se o menu ficar maior que a tela, rola só o menu */
}

/* Conteúdo: dá espaço para o sidebar */
body{
  margin-left: var(--sidebar-w);
}

/* Links/lista/itens */
.admin-sidebar a{ color: var(--sidebar-text); text-decoration: none; }
.admin-sidebar .list{ list-style: none; padding: 0; margin: 0; }
.admin-sidebar .list li{ margin: 2px 0; }

.admin-sidebar .item{
  display:flex; align-items:center; gap:10px;
  padding:10px 12px; border-radius:8px;
  font-weight:600; font-size:14px;
  transition: background .15s ease, color .15s ease;
}
.admin-sidebar .item:hover{ background: rgba(255,255,255,.06); }
.admin-sidebar .item.is-active{
  background: rgba(76,201,240,.15);
  outline: 1px solid rgba(76,201,240,.35);
}
.admin-sidebar .item.disabled{ color:var(--sidebar-muted); pointer-events:none; }

.admin-sidebar .sep{ height:1px; background: var(--sidebar-sep); margin:10px 2px; }

/* Sub-lista (se houver) */
.admin-sidebar .sublist{
  list-style: none;
  padding: 0 0 0 8px;
  margin: 4px 0 0 8px;
}
.admin-sidebar .subitem{
  display: block;
  padding: 8px 10px;
  margin: 2px 0;
  border-radius: 8px;
  font-size: 13px;
  color: #d7d9df;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.admin-sidebar .subitem:hover{ background: rgba(255,255,255,.06); color:#fff; }
.admin-sidebar .subitem.is-active{
  background: rgba(76,201,240,.15);
  outline: 1px solid rgba(76,201,240,.35);
}

/* Logo fixa */
.admin-sidebar .logo-wrap{
  display:flex; align-items:center; justify-content:center;
  height: var(--sidebar-logo-h);
  padding: var(--sidebar-logo-pad-y) var(--sidebar-logo-pad-x);
  background: rgba(255,255,255,.04); margin-bottom:12px;
  overflow:hidden; border-radius:8px; cursor: default;
}
@media (min-width: 1200px){
  .admin-sidebar .logo-wrap{ height: var(--sidebar-logo-h-xl); }
}
.admin-sidebar .logo-wrap img{
  max-height:100%; max-width:100%;
  width:auto; height:auto; object-fit: contain;
}

/* =========================================================
   GRID DE PROJETO (GANTT)
   ========================================================= */
/* Cabeçalhos antigos (compat) */
.table.project-grid th.day,
.table.project-grid th.dow { text-align: center; font-size: .8rem; }

/* Separador de grupo (linhas) */
.table.project-grid .group-row { background: #eef2f7; }

/* Nome do item fixo (compat) */
.table.project-grid td.item-name{
  white-space: nowrap;
  position: sticky; left: 0;
  background: #fff; z-index: 2;
}

/* Primeiro TH sticky (compat) */
.table.project-grid thead th:first-child{
  position: sticky; left: 0;
  background: #fff; z-index: 3;
}

/* Células de etapa (pílulas) */
.stage { padding: 0; }
.stage-link { display: block; width: 100%; height: 1.5rem; }

/* Cores “legado” (classes stage-xxx, se ainda existirem) */
.stage-angulo .stage-link { background:#ffef77; }
.stage-t1     .stage-link { background:#ffe08a; }
.stage-t2     .stage-link { background:#ffc078; }
.stage-t3     .stage-link { background:#ff922b; }
.stage-t4     .stage-link { background:#fa5252; }
.stage-t5     .stage-link { background:#d9480f; }
.stage-t6     .stage-link { background:#adb5bd; }
.stage-t7     .stage-link { background:#868e96; }
.stage-t8     .stage-link { background:#495057; }
.stage-alta_res .stage-link { background:#2f9e44; }
.stage-item .stage-link { background:#dee2e6; }

/* Legenda das etapas */
.legend .lg{
  display: inline-block;
  padding: .25rem .5rem;
  margin-right: .25rem;
  border-radius: .35rem;
  background: #e9ecef;
}
.lg-angulo{  background:#ffef77; }
.lg-t1{      background:#ffe08a; }
.lg-t2{      background:#ffc078; }
.lg-t3{      background:#ff922b; }
.lg-t4{      background:#fa5252; color:#fff; }
.lg-t5{      background:#d9480f; color:#fff; }
.lg-t6{      background:#adb5bd; }
.lg-t7{      background:#868e96; color:#fff; }
.lg-t8{      background:#495057; color:#fff; }
.lg-alta_res{ background:#2f9e44; color:#fff; }

/* ====== Gantt compacto (atual) ====== */
/* Colunas fixas à esquerda */
.project-grid .col-num{
  width: 48px;  min-width: 48px;
  position: sticky; left: 0;
  background:#fff; color:#212529;
  z-index: 4; text-align:right; padding-right:.5rem;
}
.project-grid .col-item{
  width: 240px; min-width: 200px;
  position: sticky; left: 48px;
  background:#fff; color:#212529;
  z-index: 4;
}

/* Colunas de etapa (estreitas) + pílulas coloridas */
.project-grid .col-stage{
  width: 38px; min-width: 38px;
  padding: 0.25rem;
  text-align: center;
  background:#fff; color:#212529;
}
.project-grid .stage-link{
  display:block; width:100%;
  height:1.25rem; border-radius:4px; margin:auto;
}

/* (REMOVIDO) sticky da 1ª coluna de etapa
.project-grid thead th.col-stage:first-of-type,
.project-grid tbody td.col-stage:first-of-type{
  position: sticky; left: calc(48px + 240px); background:#fff; z-index: 3;
}
*/

/* Cabeçalhos (MÊS/DIA) tema grafite */
.project-grid thead th.col-num,
.project-grid thead th.col-item,
.project-grid thead th.col-stage,
.project-grid .gantt-month,
.project-grid .gantt-day{
  background: #2b2f36 !important;
  color: #e9ecef !important;
  border-color: #3a3f47 !important;
}

/* Cabeçalho de MESES (linha superior) */
.project-grid .gantt-month{ padding: 4px 0; font-weight: 700; }

/* Cabeçalho de DIAS (linha inferior) – estreito */
.project-grid .gantt-day{
  width: 26px; min-width: 26px;
  padding: 2px 0;
}
.project-grid .gantt-day .gdow{ font-size: 11px; line-height: 1;   opacity: .9; }
.project-grid .gantt-day .gday{ font-size: 11px; line-height: 1.1; font-weight: 700; }

/* Destaque do “hoje” */
.project-grid .gantt-day.is-today{
  outline: 2px solid rgba(255,255,255,.20);
  outline-offset: -2px;
}
.project-grid td.gcell.is-today { background: #fffbe6; }

/* Células do timeline (compactas) */
.project-grid td.gcell{
  width: 26px; min-width: 26px;
  padding: 0; position: relative;
}

/* Linha do grupo (contraste extra) */
.project-grid .group-row { background: #eef2f7; }

/* Barras contínuas das ordens (altura da etapa, centralizadas) */
.project-grid tr.item-row { position: relative; }
.project-grid .row-bars{
  position: absolute; left:0; right:0; top:0; bottom:0;
  pointer-events: none;
}
.project-grid .order-bar{
  position: absolute;
  height: 1.25rem;        /* igual às pílulas */
  border-radius: 4px;
  opacity: 0.95;
  top: 50%;
  transform: translateY(-50%);
}

/* =========================================================
   ADMIN > PROJETOS (LISTA)
   ========================================================= */
.projects-head h2{
  font-weight: 700;
  letter-spacing: .2px;
}
.projects-head .btn{
  padding: .6rem 1rem;
  font-weight: 600;
  border-radius: .8rem;
}

.projects-card{
  border-radius: 1rem;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
}

/* Tabela com respiro */
.tbl-projects{ font-size: .975rem; }
.tbl-projects thead th{
  color:#6c757d;
  font-weight: 700;
  border-bottom: 1px solid #e9ecef;
}
.tbl-projects tbody td{
  padding: .9rem .75rem;
  vertical-align: middle;
}
.tbl-projects .badge{
  font-weight: 700;
  padding: .45rem .6rem;
  border-radius: .6rem;
}

/* Larguras (ID / STATUS / CRIADO EM / AÇÕES) */
.tbl-projects th:nth-child(1),
.tbl-projects td:nth-child(1){ width: 90px; }
.tbl-projects th:nth-child(3),
.tbl-projects td:nth-child(3){ width: 170px; }
.tbl-projects th:nth-child(4),
.tbl-projects td:nth-child(4){ width: 190px; }
.tbl-projects th:nth-child(5),
.tbl-projects td:nth-child(5){ width: 320px; }

@media (max-width: 992px){
  .tbl-projects th:nth-child(5),
  .tbl-projects td:nth-child(5){ width: 280px; }
}

/* Ordenação com seta */
.th-sort a{
  text-decoration: none;
  color: inherit;
  font-weight: 700;
}
.th-sort .arrow{
  font-size: 10px;
  opacity: .6;
  margin-left: 6px;
}

/* Botões na barra de ações */
.action-bar .btn{
  padding: .5rem .9rem;
  border-radius: .6rem;
}

/* ===== HOTFIX: Sidebar fixo, colado à esquerda e 100% da altura ===== */
#adminSidebar{
  position: fixed !important;
  inset: 0 auto 0 0 !important;   /* top:0; right:auto; bottom:0; left:0 */
  width: 280px !important;        /* ajuste se quiser outra largura */
  background: linear-gradient(180deg, #1f232a, #191d23) !important;
  color: #e6e7eb !important;
  border-radius: 0 !important;    /* remove cantos arredondados */
  box-shadow: none !important;    /* remove sombra */
  padding: 16px 12px !important;
  overflow-y: auto !important;    /* rola só o menu se ficar alto */
  z-index: 1040 !important;
}

/* Empurra o conteúdo para a direita */
body{
  margin-left: 280px !important;  /* use o mesmo valor do width acima */
}

/* ===== Ajuste do container principal ===== */
.main-content, .container, .container-fluid{
  margin-left: 0;           /* remove o deslocamento interno */
  padding-left: 2rem;       /* usa o mesmo padding que a direita */
  padding-right: 2rem;
}

/* body só reserva espaço pro sidebar */
body{
  margin-left: var(--sidebar-w);
}

/* ===== Login Page ===== */
.login-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}

.login-card {
  background: #2b2f36;
  color: #e6e7eb;
  padding: 2rem;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(0,0,0,.4);
  width: 100%;
  max-width: 380px;
  text-align: center;
}

.login-logo img {
  max-width: 140px;
  margin-bottom: 1rem;
}

.login-title {
  font-size: 1.3rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
  color: #e6e7eb;
}

.login-card .form-label {
  font-weight: 500;
  color: #e6e7eb;
}

.login-card .form-control {
  background: #191d23;
  border: 1px solid #3a3f47;
  color: #e6e7eb;
}
.login-card .form-control:focus {
  border-color: #4cc9f0;
  box-shadow: 0 0 0 2px rgba(76,201,240,.25);
}

.btn-login {
  background: #2b2f36;
  border: 1px solid #ff6a00;
  color: #e6e7eb;
  font-weight: 600;
  padding: .75rem;
  border-radius: 8px;
  transition: all .2s ease;
}
.btn-login:hover {
  background: #191d23;
  border-color: #ff6a00;
}

/* Ordens > filtros */
.ord-filters #dateField,
.ord-filters .date-only { display: none; }
.ord-filters:has(#mode_date:checked) #dateField,
.ord-filters:has(#mode_date:checked) .date-only { display: block; }


/* ===== Tabela de Entregas: colunas compactas ===== */
.tbl-compact .col-notes,
.tbl-compact .col-link{
  width: 1%;                 /* encolhe ao conteúdo */
  white-space: nowrap;
  text-align: center;
}

/* Chip/ícone clicável minimalista */
.tbl-compact .icon-chip{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border: 1px solid var(--tbl-sep, #e9ecef);
  border-radius: 6px;
  line-height: 1;
  text-decoration: none;
}
.tbl-compact .icon-chip:hover{ background: #f6f8fb; }

/* Badges custom para status */
.badge-render{
  background: #fff3bf;   /* amarelo pastel */
  color: #7a5b00;        /* texto âmbar escuro */
}
.badge-pos{
  background: #e7f1ff;   /* azul bem claro */
  color: #0b5ed7;        /* azul primário */
}

/* Filtro de entregas: data grande com setas */
.ord-filters .date-nav { min-width: 260px; }
.ord-filters .date-big { font-size: 1.75rem; font-weight: 600; line-height: 1; color: var(--tblr-secondary); }
.ord-filters .btn-square { width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; padding: 0; }
@media (max-width: 576px) {
  .ord-filters .date-big { font-size: 1.4rem; }
}


/* ====== Filtro Entregas: data grande + botões ====== */
.ord-filters .date-nav {
  gap: 1.25rem;              /* mais espaço entre botão e data */
}

.ord-filters .date-big {
  font-size: 1.9rem;
  font-weight: 600;
  line-height: 1;
  color: var(--tblr-secondary, #6b7280);
  letter-spacing: .2px;
}

/* Botão arredondado, suave, com hover */
.ord-filters .nav-btn {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 1.1rem;
  color: var(--tblr-body-color, #334155);
  background: var(--tblr-bg-surface, #f8fafc);
  border: 1px solid var(--tblr-border-color, #e5e7eb);
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  transition: background .15s ease, box-shadow .15s ease, transform .08s ease;
}
.ord-filters .nav-btn:hover {
  background: rgba(2,132,199,.06);   /* leve azulado no hover */
  box-shadow: 0 3px 10px rgba(0,0,0,.06);
}
.ord-filters .nav-btn:active {
  transform: translateY(1px);
}

@media (max-width: 576px) {
  .ord-filters .date-big { font-size: 1.5rem; }
  .ord-filters .nav-btn { width: 40px; height: 40px; }
}