/*
 * Puente para las paginas AUN SIN VISTA PROPIA en el tema.
 * Ya solo quedan las legacy sin uso claro: archivos.php, content.php,
 * gallery.php, cart2.php, login_dist.php. Todo lo demas migro a views/.
 *
 * Porto (style.min.css) ya no se carga. Estas paginas emiten su markup viejo
 * —clases de Bootstrap 4 mas algunas propias de Porto— y este archivo las
 * viste con los tokens del tema para que no queden en Bootstrap pelado.
 *
 * Todo lee de --au-* / --shop-*, asi que respeta la paleta que el admin
 * configure para cada skin, incluidos los oscuros.
 *
 * Este archivo se ACHICA a medida que las paginas migran a views/: cuando
 * caiga la ultima, se borra entero.
 */

/* == Restos de Porto que ya no tienen CSS ================================= */

/* el preloader de Porto: sin su JS nadie lo apagaria, mejor que no exista */
.loading-overlay,
.mobile-menu-overlay,
.mobile-menu-container,
.sticky-navbar:not(.au-tabbar) {
	display: none !important;
}

/* iconos de fuente de Porto -> glifos equivalentes de Font Awesome 5, que
   sigue cargada. Solo los que las paginas sin migrar usan de verdad. */
.icon-home::before,
.icon-angle-up::before,
.icon-angle-left::before,
.icon-angle-right::before,
.icon-cancel::before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-style: normal;
}

.icon-home::before { content: "\f015"; }
.icon-angle-up::before { content: "\f106"; }
.icon-angle-left::before { content: "\f104"; }
.icon-angle-right::before { content: "\f105"; }
.icon-cancel::before { content: "\f00d"; }

/* == Estructura general de pagina ========================================= */

/* Bootstrap corta .container en 1140px con padding de 15: se alinea con el
   contenedor del tema (1200/15) para que el contenido de las paginas sin
   migrar no quede corrido respecto del header y el footer. Esta regla gana
   a las media queries de Bootstrap por orden de carga. */
.container {
	max-width: var(--au-max, 1200px);
	padding-left: var(--au-gutter, 15px);
	padding-right: var(--au-gutter, 15px);
}

.main {
	min-height: 40vh;
	padding-bottom: 48px;
}

.page-header {
	padding: 34px 0 26px;
	margin-bottom: 26px;
	background: var(--au-surface, #f6f5f2);
	text-align: center;
}

.page-header h1 {
	font-size: 30px;
	margin: 0;
}

.breadcrumb-nav {
	padding: 16px 0 6px;
}

.breadcrumb {
	background: transparent;
	margin: 0;
	padding: 0;
	font-size: 12px;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.breadcrumb-item a {
	color: var(--au-text, #5c6468);
}

.breadcrumb-item.active {
	color: var(--au-ink, #12181b);
	font-weight: 600;
}

/* == Formularios y botones (Bootstrap -> tokens del tema) ================= */

.form-control {
	height: 44px;
	padding: 0 14px;
	border: 1px solid var(--au-border, #e4e2dd);
	border-radius: var(--au-radius, 4px);
	background: var(--au-bg, #fff);
	color: var(--au-ink, #12181b);
	font-family: var(--au-font, inherit);
	font-size: 14px;
	box-shadow: none;
}

textarea.form-control {
	height: auto;
	min-height: 96px;
	padding: 10px 14px;
}

.form-control:focus {
	border-color: var(--au-primary, #0b6e5f);
	box-shadow: 0 0 0 3px var(--au-primary-tint, #e7f2f0);
	background: var(--au-bg, #fff);
	color: var(--au-ink, #12181b);
}

.form-control:disabled,
.form-control[readonly] {
	background: var(--au-surface, #f6f5f2);
	opacity: .8;
}

label {
	font-size: 13px;
	font-weight: 600;
	color: var(--au-ink, #12181b);
}

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 11px 24px;
	border: 1px solid transparent;
	border-radius: var(--au-radius, 4px);
	font-family: var(--au-font, inherit);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .18s ease, color .18s ease, filter .18s ease;
	box-shadow: none;
}

.btn-dark,
.btn-primary,
.btn-shop,
.btn-place-order {
	background: var(--au-primary, #0b6e5f);
	border-color: var(--au-primary, #0b6e5f);
	color: #fff;
}

.btn-dark:hover,
.btn-primary:hover,
.btn-shop:hover,
.btn-place-order:hover {
	filter: brightness(1.12);
	background: var(--au-primary, #0b6e5f);
	border-color: var(--au-primary, #0b6e5f);
	color: #fff;
}

.btn-gray,
.btn-default,
.btn-outline {
	background: transparent;
	border-color: var(--au-ink, #12181b);
	color: var(--au-ink, #12181b);
}

.btn-gray:hover,
.btn-default:hover,
.btn-outline:hover {
	background: var(--au-ink, #12181b);
	color: #fff;
}

.btn:disabled,
.btn.disabled {
	background: var(--au-border, #e4e2dd);
	border-color: var(--au-border, #e4e2dd);
	color: var(--au-text, #5c6468);
	cursor: not-allowed;
	filter: none;
}

.alert {
	border-radius: var(--au-radius, 4px);
	font-size: 14px;
}