/* ===== Paleta y degradés ===== */
:root{
  --grad-start:#0D47A1;   /* azul oscuro */
  --grad-mid:#1976D2;     /* azul medio */
  --grad-end:#42A5F5;     /* azul claro */
  --text-on-grad:#FFFFFF; /* texto sobre degradé */
  --hover-text:#E3F2FD;
  --submenu-text:#2b2b2b;
}

/* Header con degradé (fallback + gradient) */
.container-header{
  background: var(--grad-mid);
  background: linear-gradient(90deg, var(--grad-start) 0%, var(--grad-mid) 50%, var(--grad-end) 100%);
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  position: sticky; top: 0; z-index: 1040;
}

/* Enlaces del menú */
.menu-grad .navbar-nav .nav-link{
  color: var(--text-on-grad);
  font-weight: 600;
  letter-spacing: .02em;
  padding: .85rem 1.1rem;
  position: relative;
  text-transform: uppercase;
}

/* Subrayado con degradé en hover/activo */
.menu-grad .navbar-nav .nav-link::after{
  content:"";
  position:absolute; left:12%; right:12%; bottom:.35rem; height:2px;
  background: linear-gradient(90deg, var(--grad-end), var(--grad-start));
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .18s ease;
}
.menu-grad .navbar-nav .nav-link:hover{ color: var(--hover-text); }
.menu-grad .navbar-nav .nav-link:hover::after,
.menu-grad .navbar-nav .nav-link.active::after{
  transform: scaleX(1);
}

/* Submenús */
.menu-grad .dropdown-menu{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:12px;
  box-shadow:0 12px 24px rgba(0,0,0,.12);
  padding:.45rem 0;
  margin-top:0; /* evita salto */
}
/* Borde lateral con degradé (detalle) */
.menu-grad .dropdown-menu{
  border-left: 4px solid transparent;
  border-image: linear-gradient(180deg, var(--grad-end), var(--grad-start)) 1;
  border-image-slice: 1;
}
.menu-grad .dropdown-item{
  color: var(--submenu-text);
  padding: .55rem 1rem;
  transition: background-color .15s ease, color .15s ease;
}
.menu-grad .dropdown-item:hover{
  background: linear-gradient(90deg, #EEF6FF 0%, #F7FBFF 100%);
  color:#0D47A1;
}

/* Abrir submenú al pasar el mouse (solo escritorio) */
@media (hover:hover) and (pointer:fine){
  .menu-grad .dropdown:hover > .dropdown-menu,
  .menu-grad .dropdown:focus-within > .dropdown-menu{
    display:block; visibility:visible; opacity:1;
  }
}
.menu-grad .dropdown-menu{
  display:none; visibility:hidden; opacity:0; transition:opacity .18s ease;
}
/* ===========================
   Tema Cassiopeia – Azul Degradé
   =========================== */

/* Paleta base (ajústala si quieres) */
:root{
  --brand-1:#0e3a66;   /* azul profundo */
  --brand-2:#0f5e91;   /* azul medio */
  --brand-3:#3a8bc3;   /* azul claro de apoyo */
  --ink:#1c2731;       /* texto principal */
  --bg:#f6f8fb;        /* fondo del sitio */
  --card:#ffffff;      /* fondo de tarjetas/módulos */
  --line:#e9eef4;      /* bordes suaves */
}

/* Fondo y tipografía general */
body.site{
  background: var(--bg);
  color: var(--ink);
  font-family:"Segoe UI",system-ui,-apple-system,Arial,sans-serif;
}

/* ===========================
   Encabezado (header) + Topbar
   =========================== */
.container-header, .header{
  background: linear-gradient(135deg, var(--brand-1), var(--brand-2));
  border-bottom: 1px solid rgba(255,255,255,.15);
  padding-top: 8px; padding-bottom: 8px;
}
.container-header .navbar-brand img,
.header .navbar-brand img{
  max-height: 48px; height:auto;
}
.container-header .site-title, .header .site-title{
  color:#fff; font-weight:800; letter-spacing:.2px; margin-left:8px;
}

/* Menú principal en el header */
.container-header .mod-menu a, .header .mod-menu a{
  color:#eaf6ff; text-decoration:none;
  padding:8px 12px; border-radius:10px;
  transition:background-color .2s ease, transform .15s ease;
}
.container-header .mod-menu a:hover, .header .mod-menu a:hover{
  background:rgba(255,255,255,.14); transform:translateY(-1px);
}
.container-header .mod-menu li.current>a,
.container-header .mod-menu li.active>a{
  background:rgba(255,255,255,.22); font-weight:700;
}

/* “Pegajoso” (si tu estilo no lo activa) */
.container-header, .header{ position:sticky; top:0; z-index:1050; }

/* ===========================
   Enlaces, botones y formularios
   =========================== */
a{ color:var(--brand-2); }
a:hover{ text-decoration:none; filter:brightness(1.05); }

.btn, .button, .btn-primary, .button-primary, .mod-login__submit{
  background: linear-gradient(135deg, var(--brand-2), var(--brand-3));
  border: 1px solid var(--brand-2);
  color:#fff;
}
.btn:hover, .button:hover, .btn-primary:hover, .button-primary:hover{
  filter:brightness(1.03);
}

/* Campos de formulario */
input[type="text"],input[type="email"],input[type="password"],select,textarea{
  border:1px solid var(--line); border-radius:10px;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--brand-3); box-shadow:0 0 0 3px rgba(58,139,195,.15);
}

/* ===========================
   Contenedor principal y tarjetas/módulos
   =========================== */
.container, .container-container{ max-width:1240px; }

.card, .moduletable{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:0 10px 28px rgba(18,38,63,.06);
  padding:14px;
}
.moduletable .mod-title, .moduletable h3{
  color:var(--brand-1); font-weight:800; margin-bottom:8px;
}

/* ===========================
   Menú lateral (sidebar)
   =========================== */
/* Si tu menú lateral se publica en un módulo, lo “pintamos” por defecto */
.sidebar-left .moduletable, .sidebar-right .moduletable{
  background: linear-gradient(180deg, var(--brand-1), var(--brand-2));
  border: none; color:#fff;
}
.sidebar-left .moduletable .mod-title,
.sidebar-right .moduletable .mod-title{ color:#fff; }

.sidebar-left .moduletable ul.mod-menu li a,
.sidebar-right .moduletable ul.mod-menu li a{
  display:block; color:#fff; text-decoration:none;
  padding:10px 12px; border-radius:10px;
  transition:background-color .2s ease, transform .15s ease, opacity .15s ease;
  opacity:.95;
}
.sidebar-left .moduletable ul.mod-menu li a:hover,
.sidebar-right .moduletable ul.mod-menu li a:hover{
  background:rgba(255,255,255,.18); transform:translateX(3px); opacity:1;
}
.sidebar-left .moduletable ul.mod-menu li.active>a,
.sidebar-right .moduletable ul.mod-menu li.active>a{
  background:rgba(255,255,255,.28); box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
}

/* ===========================
   Sección “hero” (opcional) en posición banner
   =========================== */
.hero{
  background: linear-gradient(135deg, var(--brand-1), var(--brand-2));
  color:#fff; padding:56px 22px; border-radius:16px; text-align:center;
}
.hero h1{ margin:0 0 8px; font-weight:800; }
.hero p{ margin:0 0 18px; opacity:.95; }

/* ===========================
   Footer
   =========================== */
.footer{
  background: linear-gradient(180deg, var(--brand-1), var(--brand-2));
  color:#eaf6ff; padding:24px 0; border-top:1px solid rgba(255,255,255,.12);
}
.footer a{ color:#ffffff; opacity:.95; }
.footer a:hover{ opacity:1; }

/* ===========================
   Ajustes Responsive
   =========================== */
@media (max-width: 576px){
  .container-header .navbar-brand img{ max-height:40px; }
  .card, .moduletable{ border-radius:12px; }
}
/* Encabezados de categorías */
.phocadownload h3 {
  color: #003366; /* azul corporativo */
  border-bottom: 2px solid #990000; /* línea roja */
  padding-bottom: 5px;
}

/* Tablas de descargas */
.phocadownload-box {
  background: #f5f5f5;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 10px;
}

/* Botones de descarga */
a.pd-button {
  background: #003366 !important;
  color: #fff !important;
  border-radius: 6px;
  padding: 8px 14px;
  text-decoration: none;
  transition: 0.3s;
}

a.pd-button:hover {
  background: #990000 !important;
}
/* === GRID de categorías como tarjetas grandes === */
body.com_phocadownload.view-categories .categories-list,
body.com_phocadownload.view-categories .phocadownload-categories,
body.com_phocadownload.view-sections .categories-list,
body.com_phocadownload.view-sections .phocadownload-categories {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
  margin: 24px 0 !important;
  padding: 0 !important;
}

/* Quita viñetas si viene como <ul><li> */
body.com_phocadownload.view-categories .categories-list li,
body.com_phocadownload.view-sections .categories-list li {
  list-style: none;
}

/* Tarjeta base (caja grande) */
body.com_phocadownload.view-categories .categories-list li a,
body.com_phocadownload.view-sections .categories-list li a,
body.com_phocadownload.view-categories .phocadownload-categories a,
body.com_phocadownload.view-sections .phocadownload-categories a {
  display: block;
  background: #ffffff;
  border: 1px solid #e3e6eb;
  border-radius: 16px;
  padding: 22px 20px;
  min-height: 140px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);
  text-decoration: none !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

/* Título dentro de la tarjeta */
body.com_phocadownload.view-categories .categories-list li a,
body.com_phocadownload.view-sections .categories-list li a {
  color: #0f2747; /* azul corporativo oscuro */
  font-weight: 600;
  font-size: 1.05rem;
  line-height: 1.35;
}

/* Hover/Focus elegante */
body.com_phocadownload.view-categories .categories-list li a:hover,
body.com_phocadownload.view-sections .categories-list li a:hover,
body.com_phocadownload.view-categories .phocadownload-categories a:hover,
body.com_phocadownload.view-sections .phocadownload-categories a:hover,
body.com_phocadownload.view-categories .categories-list li a:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 10px 24px rgba(0,0,0,0.10);
  border-color: #c7cfdb;
}

/* Línea inferior decorativa (rojo corporativo) */
body.com_phocadownload.view-categories .categories-list li a::after,
body.com_phocadownload.view-sections .categories-list li a::after {
  content: "";
  display: block;
  margin-top: 14px;
  height: 3px;
  width: 44px;
  background: #b30000; /* rojo corporativo */
  border-radius: 2px;
  opacity: .75;
}

/* Descripción/contadores si Phoca imprime texto adicional */
body.com_phocadownload.view-categories .categories-list li .category-desc,
body.com_phocadownload.view-sections .categories-list li .category-desc {
  margin-top: 10px;
  color: #4d5868;
  font-size: .92rem;
}

/* Badge (si hay conteo de archivos/categorías) */
body.com_phocadownload.view-categories .categories-list li .badge,
body.com_phocadownload.view-sections .categories-list li .badge {
  display: inline-block;
  margin-top: 10px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #eef2f7;
  color: #0f2747;
  font-weight: 600;
  font-size: .8rem;
}

/* Ocultar el campo de puntaje 31136 y sus elementos asociados */
#field31136,
label[for="field31136"],
#fc-tbxfield31136,
#form709puntajelbl,
input[name="form709puntaje"],
input.form-control.isCal.valid#field31136 {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* Ocultar el campo de puntaje 31136 y sus elementos asociados */
#field31144,
label[for="field31144"],
#fc-tbxfield31144,
#form709puntajelbl,
input[name="form709puntaje"],
input.form-control.isCal.valid#field31144 {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* Ocultar el campo de puntaje 31136 y sus elementos asociados */
#field31143,
label[for="field31143"],
#fc-tbxfield31143,
#form709puntajelbl,
input[name="form709puntaje"],
input.form-control.isCal.valid#field31143 {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* Ocultar el campo de puntaje 31136 y sus elementos asociados */
#field31150,
label[for="field31150"],
#fc-tbxfield31150,
#form709puntajelbl,
input[name="form709puntaje"],
input.form-control.isCal.valid#field31150 {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* Ocultar el campo de puntaje 31136 y sus elementos asociados */
#field31160,
label[for="field31160"],
#fc-tbxfield31160,
#form709puntajelbl,
input[name="form709puntaje"],
input.form-control.isCal.valid#field31160 {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* Ocultar el campo de puntaje 31136 y sus elementos asociados */
#field31170,
label[for="field31170"],
#fc-tbxfield31170,
#form709puntajelbl,
input[name="form709puntaje"],
input.form-control.isCal.valid#field31170 {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* Ocultar el campo de puntaje 31136 y sus elementos asociados */
#field31176,
label[for="field31176"],
#fc-tbxfield31176,
#form709puntajelbl,
input[name="form709puntaje"],
input.form-control.isCal.valid#field31176 {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* Ocultar el campo de puntaje 31136 y sus elementos asociados */
#field31191,
label[for="field31191"],
#fc-tbxfield31191,
#form709puntajelbl,
input[name="form709puntaje"],
input.form-control.isCal.valid#field31191 {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}