/* CEBCO — Horarios y manuales
   Paleta del manual de marca:
   navy #1C2340 · teal (PANTONE 333U) #00C9A0 · coral (PANTONE 172U) #F2614A · azul claro #B8D8D8
   Color por módulo: I azul claro · II teal · III coral (manual, sección 3).
   Todo va bajo .ch para no chocar con The7. */

.ch {
	--navy:  #1C2340;
	--navy-2:#232B4D;
	--teal:  #00C9A0;
	--coral: #F2614A;
	--sky:   #B8D8D8;

	--m1: #B8D8D8;
	--m2: #00C9A0;
	--m3: #F2614A;
	--mod: var(--navy);

	--paper: #F2F5F7;
	--card:  #FFFFFF;
	--line:  #DDE3EA;
	--muted: #6B7185;

	max-width: 980px;
	margin: 0 auto;
	padding: 0 0 56px;
	color: var(--navy);
	line-height: 1.5;
	text-align: left;
}

.ch *, .ch *::before, .ch *::after { box-sizing: border-box; }

/* ---------- Encabezado sobre azul oscuro ---------- */
.ch__head {
	position: relative;
	background: var(--navy);
	border-radius: 20px;
	padding: 44px 40px 40px;
	margin-bottom: 26px;
	overflow: hidden;
}

/* Guiño al isotipo: círculo teal difuminado en la esquina. */
.ch__head::after {
	content: "";
	position: absolute;
	right: -70px; top: -90px;
	width: 260px; height: 260px;
	border-radius: 50%;
	background: var(--teal);
	opacity: .14;
	pointer-events: none;
}

.ch__eyebrow {
	position: relative;
	margin: 0 0 14px !important;
	font-size: 12px;
	letter-spacing: .26em;
	text-transform: uppercase;
	color: var(--teal) !important;
	font-weight: 700;
}

.ch__title {
	position: relative;
	margin: 0 0 14px !important;
	font-size: clamp(28px, 4.6vw, 44px);
	line-height: 1.06;
	font-weight: 700;
	letter-spacing: -.01em;
	color: #FFFFFF !important;
}

.ch__lead {
	position: relative;
	margin: 0 0 28px !important;
	max-width: 54ch;
	font-size: 16.5px;
	color: rgba(255, 255, 255, .74) !important;
}

/* Buscador dentro del bloque navy */
.ch__search { position: relative; max-width: 460px; }

.ch__search-ico {
	position: absolute;
	left: 18px; top: 50%;
	width: 18px; height: 18px;
	margin-top: -9px;
	color: var(--navy);
	opacity: .5;
	pointer-events: none;
}

.ch__search input[type="search"] {
	width: 100% !important;
	height: 54px;
	padding: 0 18px 0 48px !important;
	font-size: 16px;
	font-family: inherit;
	color: var(--navy) !important;
	background: #FFFFFF !important;
	border: 2px solid transparent !important;
	border-radius: 999px !important;
	box-shadow: none !important;
	outline: none;
	transition: border-color .18s ease;
	-webkit-appearance: none;
	appearance: none;
}

.ch__search input[type="search"]::placeholder { color: #9AA0B0; }

.ch__limpiar {
	position: absolute;
	right: 8px; top: 50%;
	transform: translateY(-50%);
	width: 34px; height: 34px;
	border: 0;
	border-radius: 50%;
	background: rgba(28, 35, 64, .07);
	color: var(--navy);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	font-family: inherit;
}

.ch__limpiar[hidden] { display: none; }
.ch__limpiar:hover { background: rgba(28, 35, 64, .14); }
.ch__search input[type="search"]:focus { border-color: var(--teal) !important; }

/* ---------- Filtros por módulo ---------- */
.ch__tools {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	margin-bottom: 18px;
	padding: 0 4px;
}

.ch__filtros { display: flex; gap: 8px; flex-wrap: wrap; }

.ch__chip {
	font-family: inherit;
	color: var(--navy) !important;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .02em;
	padding: 9px 18px;
	border-radius: 999px;
	border: 1.5px solid var(--line);
	background: var(--card);
	color: var(--navy);
	cursor: pointer;
	transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}

.ch__chip:hover { border-color: var(--navy); }

.ch__chip.is-activo { background: var(--navy); border-color: var(--navy); color: #FFFFFF !important; }
.ch__chip--m1.is-activo { background: var(--m1); border-color: var(--m1); color: var(--navy) !important; }
.ch__chip--m2.is-activo { background: var(--m2); border-color: var(--m2); color: var(--navy) !important; }
.ch__chip--m3.is-activo { background: var(--m3); border-color: var(--m3); color: var(--navy) !important; }

.ch__meta {
	display: flex;
	align-items: center;
	gap: 14px;
	white-space: nowrap;
}

.ch__todo {
	font-family: inherit;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--navy);
	background: none;
	border: 0;
	border-bottom: 1.5px solid var(--teal);
	padding: 2px 0;
	cursor: pointer;
}

.ch__todo:hover { color: var(--teal); }

.ch__chip-num {
	display: inline-block;
	min-width: 20px;
	margin-left: 6px;
	padding: 1px 6px;
	border-radius: 999px;
	background: rgba(28, 35, 64, .1);
	font-size: 11px;
	font-weight: 700;
}

.ch__chip.is-activo .ch__chip-num { background: rgba(255, 255, 255, .3); }
.ch__chip--m1.is-activo .ch__chip-num,
.ch__chip--m2.is-activo .ch__chip-num,
.ch__chip--m3.is-activo .ch__chip-num { background: rgba(28, 35, 64, .16); }

.ch__grupo[hidden] { display: none; }

.ch__count {
	margin: 0 !important;
	font-size: 12px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
	white-space: nowrap;
}

/* ---------- Lista de sedes ---------- */
.ch__list { list-style: none !important; margin: 0 !important; padding: 0 !important; }

.ch__item { margin: 0 0 8px !important; padding: 0 !important; list-style: none !important; }
.ch__item[hidden] { display: none; }

.ch__details {
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: 14px;
	overflow: hidden;
	transition: border-color .18s ease, box-shadow .18s ease;
}

.ch__details[open] {
	border-color: #C9D1DE;
	box-shadow: 0 14px 34px -20px rgba(28, 35, 64, .5);
}

.ch__summary {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 20px 24px;
	cursor: pointer;
	list-style: none;
	user-select: none;
}

.ch__summary::-webkit-details-marker { display: none; }
.ch__summary:hover .ch__nombre { color: var(--teal); }
.ch__summary:focus-visible { outline: 3px solid var(--teal); outline-offset: -3px; }

.ch__sede { flex: 1; min-width: 0; }

.ch__nombre {
	display: block;
	font-size: clamp(19px, 2.3vw, 23px);
	font-weight: 700;
	letter-spacing: -.005em;
	transition: color .16s ease;
}

.ch__ciudad { display: block; font-size: 13px; color: var(--muted); margin-top: 2px; }

/* Pastillas de módulo */
.ch__mods { display: flex; gap: 6px; flex-wrap: wrap; }

.ch__mod {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
	padding: 5px 11px;
	border-radius: 999px;
	white-space: nowrap;
}

.ch__mod--1 { background: var(--m1) !important; color: var(--navy) !important; }
.ch__mod--2 { background: var(--m2) !important; color: var(--navy) !important; }
.ch__mod--3 { background: var(--m3) !important; color: var(--navy) !important; }

.ch__docs { font-size: 12px; color: var(--muted); white-space: nowrap; }

.ch__chevron {
	flex: 0 0 auto;
	width: 9px; height: 9px;
	border-right: 2px solid var(--navy);
	border-bottom: 2px solid var(--navy);
	transform: rotate(45deg) translateY(-2px);
	transition: transform .22s cubic-bezier(.22, 1, .36, 1);
}

.ch__details[open] .ch__chevron { transform: rotate(225deg) translateY(-2px); }

/* ---------- Panel abierto ---------- */
.ch__panel { padding: 4px 24px 22px; }

.ch__nota {
	margin: 0 0 18px !important;
	padding: 11px 15px;
	background: rgba(184, 216, 216, .34);
	border-radius: 8px;
	font-size: 14px;
	color: var(--navy);
}

.ch__grupo { padding-top: 4px; }
.ch__grupo + .ch__grupo { margin-top: 24px; }

.ch__grupo--m1 { --mod: var(--m1); }
.ch__grupo--m2 { --mod: var(--m2); }
.ch__grupo--m3 { --mod: var(--m3); }

.ch__grupo-nombre {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0 0 12px !important;
	font-size: 12px !important;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--navy) !important;
}

.ch__punto {
	width: 9px; height: 9px;
	border-radius: 50%;
	background: var(--mod);
	flex: 0 0 auto;
}

.ch__links { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid; gap: 8px; }
.ch__links li { margin: 0 !important; padding: 0 !important; list-style: none !important; }

.ch__link {
	display: flex;
	align-items: center;
	gap: 13px;
	padding: 14px 16px;
	border: 1px solid var(--line);
	border-radius: 11px;
	background: var(--paper);
	color: var(--navy) !important;
	text-decoration: none !important;
	font-weight: 600;
	font-size: 15px;
	transition: transform .16s cubic-bezier(.22, 1, .36, 1), background-color .16s ease, border-color .16s ease;
}

.ch__link:hover,
.ch__link:focus-visible {
	transform: translateX(4px);
	background: var(--card);
	border-color: var(--mod);
}

.ch__link-ico {
	flex: 0 0 auto;
	width: 36px; height: 36px;
	display: grid;
	place-items: center;
	border-radius: 9px;
	background: var(--mod);
	color: var(--navy) !important;
}

.ch__grupo--m3 .ch__link-ico { color: var(--navy) !important; }
.ch__link--manual .ch__link-ico { background: var(--navy); color: #FFFFFF !important; }

.ch__link-ico svg { width: 18px; height: 18px; display: block; }
.ch__link-texto { flex: 1; min-width: 0; }

.ch__link-tag {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .12em;
	padding: 4px 9px;
	border-radius: 5px;
	background: rgba(28, 35, 64, .08);
	color: var(--muted);
}

/* ---------- Estados ---------- */
.ch__empty,
.ch-vacio {
	margin: 24px 0 0 !important;
	padding: 26px;
	border: 1px dashed var(--line);
	border-radius: 12px;
	text-align: center;
	color: var(--muted);
	font-size: 15px;
}

.ch__empty[hidden] { display: none; }

/* ---------- Móvil ---------- */
@media (max-width: 700px) {
	.ch__head    { padding: 32px 24px 28px; border-radius: 16px; }
	.ch__summary { padding: 16px 18px; gap: 10px; flex-wrap: wrap; }
	.ch__sede    { flex: 1 1 100%; }
	.ch__panel   { padding: 4px 18px 18px; }
	.ch__docs    { display: none; }
	.ch__chevron { margin-left: auto; }
	.ch__link    { padding: 13px 14px; font-size: 14.5px; }
	.ch__count   { display: none; }
	.ch__tools   { justify-content: flex-start; }
	.ch__filtros { width: 100%; }
	.ch__chip    { flex: 1 1 auto; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
	.ch *, .ch *::before { transition: none !important; }
}
