/* ============================================================
   STEFZA — CSS das Páginas de Acordos Coletivos
   Arquivo: css/acordos.css
   Cobre: acordos.html (empresas), páginas de empresa,
          e páginas específicas de cada ACT/PPR
   ============================================================

   PASTAS CSS:
   As pastas são componentes feitos exclusivamente em CSS/SVG,
   sem imagens externas. O texto dentro de cada pasta é editável
   diretamente no HTML.

   LINHA 1 do texto da pasta: tipo de acordo + ano (ex: ACT 2026)
   LINHA 2: data-base (ex: Data-base: 2025)
   LINHA 3: status (Assinado / Em andamento)
   ============================================================ */


/* ============================================================
   PÁGINA ACORDOS (índice de empresas)
   Grid de pastas de empresas — 2 por linha
   ============================================================ */

.acordos-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px;
  margin-top: 10px;
}

/* ---- PASTA DE EMPRESA (imagem 4-A) ----
   Pasta maior com logo/nome da empresa dentro */
.pasta-empresa {
  display: block;
  text-decoration: none;
  transition: transform 0.2s, box-shadow 0.2s;
  padding-top: 15px;
}

.pasta-empresa:hover {
  transform: translateY(-4px);
}

/* Corpo da pasta — feito em CSS puro */
.pasta-empresa-corpo {
  position: relative;
  background: #1e3a6e;         /* Azul escuro da pasta */
  border-radius: 0 10px 10px 10px;
  padding: 28px 24px 22px;
  min-height: 130px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 20px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.08);
  border: 1px solid #2a4f8a;
  gap: 10px;
  text-align: center;
}

/* Aba superior da pasta (tab) */
.pasta-empresa-corpo::before {
  content: '';
  position: absolute;
  top: -14px;
  left: 0;
  width: 100px;
  height: 16px;
  background: #1e3a6e;
  border-radius: 6px 6px 0 0;
  border: 1px solid #2a4f8a;
  border-bottom: none;
}

/* Realce superior interno */
.pasta-empresa-corpo::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.05) 100%);
  border-radius: 0 10px 0 0;
}

/* Área do logo/nome da empresa dentro da pasta */
.pasta-empresa-logo {
  background: #ffffff;
  border-radius: 6px;
  padding: 10px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 120px;
  min-height: 52px;
}

.pasta-empresa-logo img {
  max-height: 38px;
  max-width: 140px;
  object-fit: contain;
}

/* Nome da empresa em texto (quando não há logo) */
.pasta-empresa-nome-texto {
  font-size: 1rem;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: 0.04em;
  text-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

/* Documentos dentro da pasta */
.pasta-empresa-docs {
  font-size: 0.7rem;
  color: rgba(255,255,255,0.6);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}


/* ============================================================
   PÁGINA DE EMPRESA — PASTAS DE ACT/PPR (imagem 4-B / 5)
   Grid 2 por linha, pasta menor com 3 linhas de texto editável
   ============================================================ */

.acordos-empresa-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px;
  margin-top: 10px;
}

/* ---- PASTA DE ACORDO (ACT/PPR) ----
   Componente 100% CSS — texto editável no HTML */
.pasta-acordo {
  display: block;
  text-decoration: none;
  transition: transform 0.2s;
  padding-top: 15px;
}

.pasta-acordo:hover {
  transform: translateY(-4px);
}

.pasta-acordo-corpo {
  position: relative;
  background: #1e3a6e;
  border-radius: 0 10px 10px 10px;
  padding: 20px 18px 18px;
  min-height: 110px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.08);
  border: 1px solid #2a4f8a;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* Aba superior */
.pasta-acordo-corpo::before {
  content: '';
  position: absolute;
  top: -13px;
  left: 0;
  width: 80px;
  height: 15px;
  background: #1e3a6e;
  border-radius: 5px 5px 0 0;
  border: 1px solid #2a4f8a;
  border-bottom: none;
}

/* Folhas de papel dentro da pasta 
.pasta-acordo-corpo::after {
  content: '';
  position: absolute;
  top: -6px;
  right: 14px;
  width: 60%;
  height: 10px;
  background: #e8e8e8;
  border-radius: 3px 3px 0 0;
  box-shadow: 0 -2px 0 #d5d5d5;
}*/



/* LINHA 1: Tipo + Ano (ex: ACT 2026)
   Para editar: altere o texto dentro de .pasta-linha-titulo no HTML */
.pasta-linha-titulo {
  font-size: 1rem;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: 0.02em;
  margin-top: 4px;
}

/* LINHA 2: Data-base
   Para editar: altere o texto dentro de .pasta-linha-databse no HTML */
.pasta-linha-database {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.75);
}

/* LINHA 3: Status (Assinado / Em andamento)
   Para editar: altere o texto e a classe dentro de .pasta-linha-status no HTML
   Classes disponíveis: .status-assinado (verde) / .status-andamento (laranja) */
.pasta-linha-status {
  display: inline-block;
  margin-top: 4px;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 2px 10px;
  border-radius: 20px;
  width: fit-content;
}

.status-assinado {
  background: rgba(76, 175, 80, 0.2);
  color: #81c784;
  border: 1px solid rgba(76, 175, 80, 0.35);
}

.status-andamento {
  background: rgba(255, 152, 0, 0.2);
  color: #ffb74d;
  border: 1px solid rgba(255, 152, 0, 0.35);
}


/* ============================================================
   PÁGINA ESPECÍFICA DE ACORDO (ACT/PPR — documentos)
   ============================================================ */
   
  
/* Subtítulo "Documentos da Negociação" */  
:root {
  --cor-verde: #2e7d32; /* verde escuro */
}

.docs-verde {
  border: none;
  border-top: 2px solid var(--cor-verde);
  margin: 0 0 24px;
  width: 40px;
}

.doc-item.verde .doc-icone {
  background: #e8f5e9;
  border-color: #a5d6a7;
}

.doc-item.verde .doc-icone svg {
  stroke: var(--cor-verde);
}

.doc-item.verde:hover {
  background: #e8f5e9;
  color: var(--cor-verde);
}

.doc-item.verde:hover .doc-icone {
  background: var(--cor-verde);
  border-color: var(--cor-verde);
}

.doc-item.verde:hover .doc-icone svg {
  stroke: #ffffff;
}

/* --------------------------------------- */



.acordo-pagina-header {
  margin-bottom: 32px;
}

.acordo-empresa-titulo {
  font-size: clamp(1rem, 2.5vw, 1.3rem);
  color: var(--cor-texto-claro);
  font-weight: 600;
  margin-bottom: 4px;
}

.acordo-tipo-titulo {
  font-size: clamp(1.4rem, 3.5vw, 2rem);
  color: var(--cor-primaria);
  font-weight: 800;
  margin-bottom: 20px;
}

/* Subtítulo "Documentos da Negociação" */
.docs-subtitulo {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--cor-texto-claro);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 4px;
}

/* Separador logo após o subtítulo */
.docs-linha {
  border: none;
  border-top: 2px solid var(--cor-primaria);
  margin: 0 0 24px;
  width: 40px;
}

/* Lista de documentos PDF */
.docs-lista {
  display: flex;
  max-width: 60%;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--cor-borda);
  border-radius: 10px;
  overflow: hidden;
}

/* Item de documento */
.doc-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 20px;
  text-decoration: none;
  color: var(--cor-texto);
  border-bottom: 1px solid var(--cor-borda);
  background: var(--cor-fundo);
  transition: background 0.18s, color 0.18s;
}

.doc-item:last-child {
  border-bottom: none;
}

.doc-item:hover {
  background: #fdf5f5;
  color: var(--cor-primaria);
}

/* Ícone do documento */
.doc-icone {
  flex-shrink: 0;
  width: 50px;
  height: 50px;
  background: #fff0f0;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #f5c6c6;
}

.doc-icone svg {
  width: 20px;
  height: 20px;
  stroke: var(--cor-primaria);
}

.doc-item:hover .doc-icone {
  background: var(--cor-primaria);
  border-color: var(--cor-primaria);
}

.doc-item:hover .doc-icone svg {
  stroke: #ffffff;
}

/* Informações do documento */
.doc-info {
  flex: 1;
  min-width: 0;
}

.doc-nome {
  font-size: 0.9rem;
  font-weight: 600;
  color: inherit;
  line-height: 1.3;
  white-space: nowrap;
  margin-top: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.doc-tipo {
  font-size: 0.72rem;
  color: var(--cor-texto-claro);
  margin-top: -10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Seta de download */
.doc-seta {
  flex-shrink: 0;
  opacity: 0.35;
  transition: opacity 0.18s;
}

.doc-item:hover .doc-seta {
  opacity: 1;
}

/* Breadcrumb de acordos */
.acordos-breadcrumb {
  font-size: 0.78rem;
  color: var(--cor-texto-claro);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin-bottom: 8px;
}

.acordos-breadcrumb a {
  color: var(--cor-texto-claro);
}

.acordos-breadcrumb a:hover {
  color: var(--cor-primaria);
}

.acordos-breadcrumb .sep { color: var(--cor-borda); }
.acordos-breadcrumb .atual { color: var(--cor-primaria); font-weight: 600; }


/* ============================================================
   RESPONSIVIDADE ACORDOS
   ============================================================ */

@media (max-width: 680px) {
  .acordos-grid,
  .acordos-empresa-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }

  .pasta-empresa-corpo {
    min-height: 110px;
  }

  .pasta-empresa-logo img {
    max-height: 32px;
  }

  .doc-item {
    padding: 14px 16px;
    gap: 12px;
  }
  
  .docs-lista {
  display: flex;
  max-width: 95%;
}