/**
 * Samburu Hoguera — estilos del front.
 * Sistema de diseño: tipografía SF Pro, un único azul de acción,
 * tarjetas con filete fino sin sombras y superficies alternas claro/oscuro.
 */

:root {
	--sh-primary: #0066cc;
	--sh-primary-focus: #0071e3;
	--sh-primary-on-dark: #2997ff;
	--sh-ink: #1d1d1f;
	--sh-ink-80: #333333;
	--sh-ink-48: #7a7a7a;
	--sh-divider: #f0f0f0;
	--sh-hairline: #e0e0e0;
	--sh-canvas: #ffffff;
	--sh-parchment: #f5f5f7;
	--sh-pearl: #fafafc;
	--sh-tile-dark: #272729;
	--sh-tile-dark-2: #2a2a2c;
	--sh-on-dark: #ffffff;
	--sh-body-muted: #cccccc;

	--sh-r-xs: 5px;
	--sh-r-sm: 8px;
	--sh-r-md: 11px;
	--sh-r-lg: 18px;
	--sh-r-pill: 9999px;

	--sh-s-xxs: 4px;
	--sh-s-xs: 8px;
	--sh-s-sm: 12px;
	--sh-s-md: 17px;
	--sh-s-lg: 24px;
	--sh-s-xl: 32px;
	--sh-s-xxl: 48px;
	--sh-s-section: 80px;

	--sh-font: "SF Pro Display", "SF Pro Text", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--sh-max: 1040px;
}

/* ---------------------------------------------------------------- Base */

.sh,
.sh * {
	box-sizing: border-box;
}

.sh {
	font-family: var(--sh-font);
	font-size: 17px;
	font-weight: 400;
	line-height: 1.47;
	letter-spacing: -0.374px;
	color: var(--sh-ink);
	max-width: var(--sh-max);
	margin: 0 auto;
	padding: var(--sh-s-lg) var(--sh-s-lg) var(--sh-s-section);
}

.sh :where(p, ul, ol) {
	font-size: 17px;
	line-height: 1.47;
}

.sh-main {
	background: var(--sh-canvas);
}

/* Titulares: SF Pro Display 600 con tracking negativo. */

.sh-display {
	font-size: 56px;
	font-weight: 600;
	line-height: 1.07;
	letter-spacing: -0.28px;
	margin: 0 0 var(--sh-s-sm);
	color: inherit;
}

.sh-display--md {
	font-size: 40px;
	line-height: 1.1;
	letter-spacing: -0.374px;
}

.sh-h2 {
	font-size: 28px;
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.2px;
	margin: var(--sh-s-xl) 0 var(--sh-s-md);
}

.sh-h2--on-dark {
	color: var(--sh-on-dark);
}

.sh-h3 {
	font-size: 21px;
	font-weight: 600;
	line-height: 1.19;
	margin: var(--sh-s-lg) 0 var(--sh-s-sm);
}

.sh-lead {
	font-size: 28px;
	font-weight: 400;
	line-height: 1.14;
	letter-spacing: 0.196px;
	color: var(--sh-ink-80);
	margin: 0 0 var(--sh-s-lg);
}

.sh-lead-sm {
	font-size: 21px;
	font-weight: 300;
	line-height: 1.4;
	color: var(--sh-ink-80);
	margin: 0 0 var(--sh-s-md);
}

.sh-fine {
	font-size: 12px;
	line-height: 1.5;
	letter-spacing: -0.12px;
	color: var(--sh-ink-48);
}

.sh-empty {
	font-size: 17px;
	color: var(--sh-ink-48);
	padding: var(--sh-s-xl);
	text-align: center;
	list-style: none;
}

.sh-prose :where(h2, h3) {
	font-weight: 600;
	letter-spacing: -0.3px;
	margin: var(--sh-s-lg) 0 var(--sh-s-xs);
}

.sh-prose h3 {
	font-size: 21px;
}

.sh-prose p {
	margin: 0 0 var(--sh-s-md);
}

.sh-prose ul {
	margin: 0 0 var(--sh-s-md);
	padding-left: 1.2em;
}

.sh-prose a {
	color: var(--sh-primary);
}

.sh-icon {
	vertical-align: -0.18em;
	flex: none;
}

/* ------------------------------------------------------------- Botones */

.sh-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--sh-s-xs);
	min-height: 44px;
	padding: 11px 22px;
	border: 0;
	border-radius: var(--sh-r-pill);
	font-family: var(--sh-font);
	font-size: 17px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.374px;
	text-decoration: none;
	cursor: pointer;
	transition: transform 0.15s ease, opacity 0.15s ease;
}

.sh-btn--primary {
	background: var(--sh-primary);
	color: #fff;
}

.sh-btn--ghost {
	background: transparent;
	color: var(--sh-primary);
	box-shadow: inset 0 0 0 1px var(--sh-hairline);
}

.sh-btn:active {
	transform: scale(0.95);
}

.sh-btn:focus-visible,
.sh-action:focus-visible,
.sh-chip:focus-visible,
.sh-input:focus-visible,
.sh-textarea:focus-visible {
	outline: 2px solid var(--sh-primary-focus);
	outline-offset: 2px;
}

.sh-btn[disabled] {
	opacity: 0.35;
	cursor: not-allowed;
}

.sh-link {
	color: var(--sh-primary);
	text-decoration: none;
	font-size: 17px;
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.sh-link:hover {
	text-decoration: underline;
}

.sh-action {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--sh-pearl);
	color: var(--sh-ink-80);
	border: 3px solid var(--sh-divider);
	border-radius: var(--sh-r-md);
	padding: 8px 14px;
	font-family: var(--sh-font);
	font-size: 14px;
	line-height: 1.29;
	letter-spacing: -0.224px;
	cursor: pointer;
	transition: transform 0.15s ease;
}

.sh-action:active {
	transform: scale(0.95);
}

.sh-action--danger {
	color: #b42318;
}

/* -------------------------------------------------------------- Tiles */

.sh-tile {
	border-radius: 0;
	padding: var(--sh-s-section) var(--sh-s-lg);
	text-align: center;
	margin: 0 0 var(--sh-s-xl);
}

.sh-tile--light {
	background: var(--sh-canvas);
}

.sh-tile--parchment {
	background: var(--sh-parchment);
}

.sh-tile--dark {
	background: var(--sh-tile-dark);
	color: var(--sh-on-dark);
}

.sh-tile--dark .sh-lead-sm,
.sh-tile--dark p {
	color: var(--sh-body-muted);
}

.sh-tile--dark a:not(.sh-btn) {
	color: var(--sh-primary-on-dark);
}

.sh-hero {
	padding-top: var(--sh-s-xxl);
}

.sh-hero__flame {
	font-size: 44px;
	display: block;
	margin-bottom: var(--sh-s-sm);
}

.sh-hero__actions {
	display: flex;
	gap: var(--sh-s-md);
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: var(--sh-s-lg);
}

.sh-section {
	margin-bottom: var(--sh-s-xxl);
}

/* ------------------------------------------------------------ Avisos */

.sh-notice {
	display: flex;
	gap: var(--sh-s-sm);
	align-items: flex-start;
	background: var(--sh-parchment);
	border-radius: var(--sh-r-lg);
	padding: var(--sh-s-md) var(--sh-s-lg);
	margin: 0 0 var(--sh-s-lg);
	font-size: 14px;
	line-height: 1.43;
	letter-spacing: -0.224px;
	color: var(--sh-ink-80);
}

.sh-notice .sh-icon {
	margin-top: 2px;
	color: var(--sh-ink-48);
}

/* --------------------------------------------------------- Rejilla */

.sh-grid {
	display: grid;
	gap: var(--sh-s-lg);
	grid-template-columns: repeat(var(--sh-cols, 2), minmax(0, 1fr));
}

.sh-grid--1 { --sh-cols: 1; }
.sh-grid--2 { --sh-cols: 2; }
.sh-grid--3 { --sh-cols: 3; }
.sh-grid--4 { --sh-cols: 4; }

.sh-card {
	background: var(--sh-canvas);
	border: 1px solid var(--sh-hairline);
	border-radius: var(--sh-r-lg);
	overflow: hidden;
	transition: transform 0.2s ease, border-color 0.2s ease;
}

.sh-card:hover {
	border-color: var(--sh-ink-48);
}

.sh-card:active {
	transform: scale(0.99);
}

.sh-card__link {
	display: block;
	padding: var(--sh-s-lg);
	color: inherit;
	text-decoration: none;
	height: 100%;
}

.sh-card__icon {
	font-size: 30px;
	display: block;
	margin-bottom: var(--sh-s-xs);
}

.sh-card__title {
	font-size: 21px;
	font-weight: 600;
	letter-spacing: -0.2px;
	line-height: 1.19;
	margin: 0 0 var(--sh-s-xs);
}

.sh-card__desc {
	font-size: 14px;
	line-height: 1.43;
	color: var(--sh-ink-48);
	margin: 0 0 var(--sh-s-md);
}

.sh-card__meta {
	display: flex;
	gap: var(--sh-s-md);
	flex-wrap: wrap;
	font-size: 12px;
	color: var(--sh-ink-48);
	margin-bottom: var(--sh-s-sm);
}

.sh-meta {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.sh-meta--locked {
	color: var(--sh-ink-80);
}

.sh-card__cta {
	color: var(--sh-primary);
	font-size: 14px;
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.sh-card.is-locked {
	background: var(--sh-pearl);
}

/* ------------------------------------------------------- Miga de pan */

.sh-breadcrumb {
	display: flex;
	align-items: center;
	gap: var(--sh-s-xs);
	font-size: 14px;
	color: var(--sh-ink-48);
	margin-bottom: var(--sh-s-md);
	flex-wrap: wrap;
}

.sh-breadcrumb a {
	color: var(--sh-primary);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

/* ------------------------------------------------------- Cabecera foro */

.sh-forum__head {
	display: flex;
	align-items: center;
	gap: var(--sh-s-lg);
	text-align: left;
	border-radius: var(--sh-r-lg);
	padding: var(--sh-s-xl);
	margin-bottom: var(--sh-s-lg);
}

.sh-forum__head > div {
	flex: 1 1 auto;
	min-width: 0;
}

.sh-forum__icon {
	font-size: 40px;
	line-height: 1;
}

.sh-forum__head .sh-display--md {
	font-size: 34px;
	margin-bottom: 4px;
}

.sh-forum__head .sh-lead-sm {
	font-size: 17px;
	margin: 0;
}

/* ---------------------------------------------------------- Filtros */

.sh-filters {
	display: flex;
	gap: var(--sh-s-md);
	align-items: center;
	flex-wrap: wrap;
	margin-bottom: var(--sh-s-md);
}

.sh-search {
	display: inline-flex;
	align-items: center;
	gap: var(--sh-s-xs);
	background: var(--sh-canvas);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: var(--sh-r-pill);
	padding: 0 20px;
	height: 44px;
	flex: 1 1 240px;
	color: var(--sh-ink-48);
}

.sh-search input {
	border: 0;
	background: transparent;
	font-family: var(--sh-font);
	font-size: 17px;
	color: var(--sh-ink);
	width: 100%;
	outline: none;
	padding: 0;
}

.sh-chips {
	display: flex;
	gap: var(--sh-s-xs);
	flex-wrap: wrap;
}

.sh-chip {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	background: var(--sh-canvas);
	border: 1px solid var(--sh-hairline);
	border-radius: var(--sh-r-pill);
	padding: 9px 16px;
	font-size: 14px;
	letter-spacing: -0.224px;
	color: var(--sh-ink);
	text-decoration: none;
	cursor: pointer;
}

.sh-chip.is-selected,
.sh-chip--check input:checked + span {
	border-color: var(--sh-primary-focus);
	color: var(--sh-primary);
}

.sh-chip--check {
	padding: 0;
	border: 0;
	background: none;
}

.sh-chip--check input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.sh-chip--check span {
	display: inline-block;
	border: 1px solid var(--sh-hairline);
	border-radius: var(--sh-r-pill);
	padding: 9px 16px;
}

.sh-chip--muted {
	color: var(--sh-ink-48);
	background: var(--sh-pearl);
}

.sh-chip--accent {
	color: var(--sh-primary);
	border-color: var(--sh-primary);
}

/* ------------------------------------------------------ Lista de temas */

.sh-topics {
	list-style: none;
	margin: 0 0 var(--sh-s-lg);
	padding: 0;
	border: 1px solid var(--sh-hairline);
	border-radius: var(--sh-r-lg);
	overflow: hidden;
	background: var(--sh-canvas);
}

.sh-topic-row + .sh-topic-row {
	border-top: 1px solid var(--sh-divider);
}

.sh-topic-row.is-pinned {
	background: var(--sh-pearl);
}

.sh-topic-row.is-moderated {
	background: #fff8e6;
}

.sh-topic-row__link {
	display: flex;
	align-items: center;
	gap: var(--sh-s-md);
	padding: var(--sh-s-md) var(--sh-s-lg);
	color: inherit;
	text-decoration: none;
}

.sh-topic-row__main {
	flex: 1 1 auto;
	min-width: 0;
	display: block;
}

.sh-topic-row__title {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 17px;
	font-weight: 600;
	letter-spacing: -0.374px;
	line-height: 1.24;
	margin-bottom: 2px;
}

.sh-topic-row__excerpt {
	display: block;
	font-size: 14px;
	color: var(--sh-ink-48);
	line-height: 1.43;
	margin-bottom: 6px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.sh-topic-row__meta {
	display: flex;
	align-items: center;
	gap: var(--sh-s-xs);
	flex-wrap: wrap;
	font-size: 12px;
	color: var(--sh-ink-48);
}

.sh-topic-row__count {
	flex: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 72px;
	color: var(--sh-ink-48);
}

.sh-topic-row__count strong {
	font-size: 21px;
	font-weight: 600;
	color: var(--sh-ink);
	letter-spacing: -0.3px;
}

.sh-topic-row__count small {
	font-size: 11px;
}

.sh-topic-row__last {
	margin-top: 4px;
}

/* ---------------------------------------------------------- Avatares */

.sh-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--sh-r-pill);
	overflow: hidden;
	font-size: 15px;
	font-weight: 600;
	flex: none;
}

.sh-avatar img,
.sh-avatar__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: var(--sh-r-pill);
	display: block;
}

.sh-avatar--ghost {
	width: 44px;
	height: 44px;
	background: var(--sh-divider);
	color: var(--sh-ink-48);
}

/* ---------------------------------------------------------- Insignias */

.sh-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1;
	padding: 5px 9px;
	border-radius: var(--sh-r-pill);
	background: var(--sh-parchment);
	color: var(--sh-ink-80);
}

.sh-badge--mod {
	background: rgba(0, 102, 204, 0.1);
	color: var(--sh-primary);
}

.sh-badge--student {
	background: rgba(52, 120, 72, 0.1);
	color: #2d6a3e;
}

.sh-badge--guest {
	background: var(--sh-parchment);
	color: var(--sh-ink-48);
}

.sh-badge--queue {
	background: #fff3d1;
	color: #8a5a00;
}

.sh-badge--alert {
	background: #fde8e6;
	color: #b42318;
}

/* ------------------------------------------------------------- Hilo */

.sh-topic__head {
	margin-bottom: var(--sh-s-lg);
}

.sh-topic__flags {
	display: flex;
	gap: var(--sh-s-xs);
	flex-wrap: wrap;
	margin-bottom: var(--sh-s-sm);
}

.sh-byline {
	display: flex;
	align-items: center;
	gap: var(--sh-s-sm);
	font-size: 14px;
	color: var(--sh-ink-48);
	margin-top: var(--sh-s-md);
}

.sh-byline__name {
	font-weight: 600;
	color: var(--sh-ink);
	margin-right: 6px;
}

.sh-byline__date {
	margin-left: 6px;
}

.sh-post {
	display: flex;
	gap: var(--sh-s-md);
	padding: var(--sh-s-lg);
	border: 1px solid var(--sh-hairline);
	border-radius: var(--sh-r-lg);
	background: var(--sh-canvas);
	margin-bottom: var(--sh-s-sm);
}

.sh-post--opener {
	background: var(--sh-parchment);
	border-color: transparent;
	display: block;
	padding: var(--sh-s-xl);
}

.sh-post.is-moderated {
	background: #fff8e6;
	border-color: #f0dca8;
}

.sh-post__content {
	flex: 1 1 auto;
	min-width: 0;
}

.sh-post__head {
	display: flex;
	align-items: center;
	gap: var(--sh-s-xs);
	flex-wrap: wrap;
	font-size: 14px;
	color: var(--sh-ink-48);
	margin-bottom: var(--sh-s-xs);
}

.sh-post__author {
	font-weight: 600;
	color: var(--sh-ink);
}

.sh-post__body {
	overflow-wrap: break-word;
}

.sh-post__actions {
	display: flex;
	align-items: center;
	gap: var(--sh-s-xs);
	flex-wrap: wrap;
	margin-top: var(--sh-s-sm);
}

.sh-modtools {
	display: inline-flex;
	gap: var(--sh-s-xs);
	flex-wrap: wrap;
	margin-left: auto;
	align-items: center;
}

/* --------------------------------------------------------- Formularios */

.sh-field {
	display: block;
	margin-bottom: var(--sh-s-md);
	border: 0;
	padding: 0;
}

.sh-field__label {
	display: block;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.224px;
	margin-bottom: 6px;
}

.sh-input,
.sh-textarea {
	width: 100%;
	font-family: var(--sh-font);
	font-size: 17px;
	line-height: 1.47;
	color: var(--sh-ink);
	background: var(--sh-canvas);
	border: 1px solid var(--sh-hairline);
	border-radius: var(--sh-r-md);
	padding: 12px 16px;
}

.sh-input {
	border-radius: var(--sh-r-pill);
	min-height: 44px;
}

.sh-textarea {
	resize: vertical;
	min-height: 120px;
}

.sh-composer,
.sh-reply-form,
.sh-request {
	background: var(--sh-canvas);
	border: 1px solid var(--sh-hairline);
	border-radius: var(--sh-r-lg);
	padding: var(--sh-s-lg);
	margin-bottom: var(--sh-s-lg);
}

.sh-composer.is-hidden,
.sh-request.is-hidden {
	display: none;
}

.sh-composer__foot,
.sh-reply-form__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--sh-s-md);
	flex-wrap: wrap;
	margin-top: var(--sh-s-sm);
}

.sh-composer__buttons {
	display: flex;
	gap: var(--sh-s-xs);
	margin-left: auto;
}

.sh-reply-form__head {
	display: flex;
	align-items: center;
	gap: var(--sh-s-sm);
	margin-bottom: var(--sh-s-sm);
	font-size: 14px;
}

.sh-counter {
	font-size: 12px;
	color: var(--sh-ink-48);
}

.sh-counter.is-over {
	color: #b42318;
}

.sh-check {
	display: flex;
	gap: var(--sh-s-sm);
	align-items: flex-start;
	font-size: 14px;
	line-height: 1.43;
	color: var(--sh-ink-80);
	cursor: pointer;
}

.sh-check input {
	margin-top: 3px;
	width: 18px;
	height: 18px;
	accent-color: var(--sh-primary);
	flex: none;
}

.sh-form-msg {
	font-size: 14px;
	margin: var(--sh-s-sm) 0 0;
	min-height: 1em;
}

.sh-form-msg.is-error {
	color: #b42318;
}

.sh-form-msg.is-ok {
	color: #2d6a3e;
}

/* ------------------------------------------------------ Muro de normas */

.sh-gate {
	max-width: 780px;
}

.sh-gate__card,
.sh-locked__card,
.sh-panel__card,
.sh-signed__card {
	background: var(--sh-canvas);
	border: 1px solid var(--sh-hairline);
	border-radius: var(--sh-r-lg);
	padding: var(--sh-s-xl);
}

.sh-gate__head {
	text-align: center;
	margin-bottom: var(--sh-s-lg);
}

.sh-gate__flame {
	font-size: 40px;
	display: block;
	margin-bottom: var(--sh-s-xs);
}

.sh-gate .sh-display--md {
	font-size: 34px;
	line-height: 1.2;
}

.sh-gate__progress {
	height: 3px;
	background: var(--sh-divider);
	border-radius: var(--sh-r-pill);
	overflow: hidden;
	margin-bottom: var(--sh-s-sm);
}

.sh-gate__bar {
	display: block;
	height: 100%;
	width: 0;
	background: var(--sh-primary);
	transition: width 0.15s linear;
}

.sh-gate__doc {
	max-height: 46vh;
	min-height: 280px;
	overflow-y: auto;
	background: var(--sh-parchment);
	border-radius: var(--sh-r-lg);
	padding: var(--sh-s-lg);
	-webkit-overflow-scrolling: touch;
}

.sh-gate__doc h3 {
	font-size: 17px;
	font-weight: 600;
	margin-top: var(--sh-s-md);
}

.sh-gate__doc p,
.sh-gate__doc li {
	font-size: 15px;
	line-height: 1.5;
}

.sh-gate__end {
	text-align: center;
	color: var(--sh-ink-48);
	font-size: 12px;
	padding-top: var(--sh-s-xs);
}

.sh-gate__hint {
	font-size: 12px;
	color: var(--sh-ink-48);
	text-align: center;
	margin: var(--sh-s-xs) 0 var(--sh-s-md);
}

.sh-gate__hint.is-done {
	color: #2d6a3e;
}

.sh-gate__sign {
	margin-bottom: var(--sh-s-md);
}

.sh-gate__actions {
	display: flex;
	gap: var(--sh-s-sm);
	flex-wrap: wrap;
	align-items: center;
}

/* ------------------------------------------------------------ Bloqueos */

.sh-locked {
	max-width: 680px;
	text-align: center;
}

.sh-locked__icon {
	font-size: 44px;
	display: block;
	margin-bottom: var(--sh-s-sm);
}

.sh-locked .sh-display--md {
	font-size: 34px;
}

.sh-locked__actions {
	display: flex;
	gap: var(--sh-s-md);
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	margin: var(--sh-s-lg) 0 0;
}

.sh-locked .sh-request {
	text-align: left;
	margin-top: var(--sh-s-lg);
	border: 0;
	padding: 0;
}

/* -------------------------------------------------------------- Panel */

.sh-panel {
	max-width: 780px;
}

.sh-panel__head {
	display: flex;
	align-items: center;
	gap: var(--sh-s-md);
	margin-bottom: var(--sh-s-lg);
}

.sh-panel__head .sh-h2 {
	margin: 0 0 6px;
	font-size: 24px;
}

.sh-panel__facts {
	list-style: none;
	margin: 0 0 var(--sh-s-lg);
	padding: 0;
	display: grid;
	gap: var(--sh-s-sm);
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.sh-panel__facts li {
	background: var(--sh-parchment);
	border-radius: var(--sh-r-md);
	padding: var(--sh-s-sm) var(--sh-s-md);
}

.sh-panel__label {
	display: block;
	font-size: 12px;
	color: var(--sh-ink-48);
	margin-bottom: 2px;
}

.sh-panel__actions {
	display: flex;
	gap: var(--sh-s-sm);
	flex-wrap: wrap;
	margin-top: var(--sh-s-lg);
}

/* ------------------------------------------------------------- Firmado */

.sh-signed__card {
	display: flex;
	align-items: center;
	gap: var(--sh-s-md);
	flex-wrap: wrap;
}

.sh-signed__card > div {
	flex: 1 1 260px;
}

.sh-signed__icon {
	width: 44px;
	height: 44px;
	border-radius: var(--sh-r-pill);
	background: rgba(45, 106, 62, 0.12);
	color: #2d6a3e;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.sh-signed__card .sh-h2 {
	margin: 0 0 4px;
	font-size: 21px;
}

.sh-signed__details {
	margin-top: var(--sh-s-md);
	font-size: 14px;
}

.sh-signed__details summary {
	cursor: pointer;
	color: var(--sh-primary);
}

.sh-signed__doc {
	margin-top: var(--sh-s-md);
	background: var(--sh-parchment);
	border-radius: var(--sh-r-lg);
	padding: var(--sh-s-lg);
	max-height: 50vh;
	overflow-y: auto;
}

/* --------------------------------------------------------- Paginación */

.sh-pagination {
	display: flex;
	gap: var(--sh-s-xs);
	justify-content: center;
	margin: var(--sh-s-lg) 0;
	flex-wrap: wrap;
}

.sh-pagination .page-numbers {
	min-width: 44px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--sh-r-pill);
	text-decoration: none;
	color: var(--sh-primary);
	font-size: 15px;
}

.sh-pagination .page-numbers.current {
	background: var(--sh-primary);
	color: #fff;
}

/* ------------------------------------------------------------- Modales */

.sh-modal {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.45);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--sh-s-lg);
	z-index: 99999;
}

.sh-modal__box {
	background: var(--sh-canvas);
	border-radius: var(--sh-r-lg);
	padding: var(--sh-s-xl);
	max-width: 440px;
	width: 100%;
	font-family: var(--sh-font);
	color: var(--sh-ink);
}

.sh-modal__box h3 {
	margin: 0 0 var(--sh-s-sm);
	font-size: 21px;
	font-weight: 600;
}

.sh-modal__box .sh-textarea {
	min-height: 90px;
}

.sh-modal__actions {
	display: flex;
	gap: var(--sh-s-xs);
	justify-content: flex-end;
	margin-top: var(--sh-s-md);
}

.sh-toast {
	position: fixed;
	left: 50%;
	bottom: 24px;
	transform: translateX(-50%);
	background: var(--sh-ink);
	color: #fff;
	font-family: var(--sh-font);
	font-size: 14px;
	padding: 12px 20px;
	border-radius: var(--sh-r-pill);
	z-index: 100000;
	max-width: calc(100% - 32px);
	text-align: center;
}

/* ---------------------------------------------------- Responsive */

@media (max-width: 1068px) {
	.sh-display { font-size: 40px; }
}

@media (max-width: 834px) {
	.sh-grid { --sh-cols: 1 !important; }
	.sh-forum__head { flex-wrap: wrap; }
	.sh-forum__head .sh-btn { width: 100%; }
}

@media (max-width: 734px) {
	.sh { padding: var(--sh-s-md) var(--sh-s-md) var(--sh-s-xxl); }
	.sh-tile { padding: var(--sh-s-xxl) var(--sh-s-md); }
	.sh-gate__card,
	.sh-locked__card,
	.sh-panel__card,
	.sh-signed__card,
	.sh-post--opener { padding: var(--sh-s-lg); }
}

@media (max-width: 640px) {
	.sh-display { font-size: 34px; }
	.sh-display--md { font-size: 28px; }
	.sh-h2 { font-size: 24px; }
	.sh-lead { font-size: 21px; }
	.sh-lead-sm { font-size: 17px; }

	.sh-topic-row__link { padding: var(--sh-s-sm) var(--sh-s-md); align-items: flex-start; }
	.sh-topic-row__excerpt { white-space: normal; }
	.sh-topic-row__count {
		flex-direction: row;
		gap: 5px;
		align-items: baseline;
		min-width: 0;
		margin-left: 56px;
	}
	.sh-topic-row__count strong { font-size: 15px; }
	.sh-topic-row__link { flex-wrap: wrap; }
	.sh-topic-row__main { flex-basis: calc(100% - 60px); }

	.sh-post { padding: var(--sh-s-md); }
	.sh-post__aside .sh-avatar { width: 36px !important; height: 36px !important; }

	.sh-gate__doc { max-height: 52vh; }
	.sh-gate__actions .sh-btn { flex: 1 1 100%; }
	.sh-hero__actions .sh-btn { width: 100%; }
	.sh-modtools { margin-left: 0; width: 100%; }
}

@media (max-width: 419px) {
	.sh-display { font-size: 28px; }
	.sh-tile { padding: var(--sh-s-xl) var(--sh-s-sm); }
	.sh-action { padding: 8px 10px; font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
	.sh-btn,
	.sh-card,
	.sh-action,
	.sh-gate__bar {
		transition: none;
	}
}