/*
 * theme.css — estilos propios del theme Endesa Educa.
 * Se carga después de Bootstrap 5. Mantener ligero.
 */

/* --- Marca (placeholders; ajustar a la paleta oficial) --- */
:root {
	--ee-primary: #7ab800;
	--ee-primary-dark: #5f9200;
}

/* --- Layout --- */
.ee-main {
	min-height: 60vh;
}

.ee-header .ee-logo img {
	max-height: 56px;
	width: auto;
}

.ee-header p.ee-edicion {
	color:#000 !important;
}

/* --- Botones de marca (reutilizan las clases success de Bootstrap) --- */
.btn-success {
	--bs-btn-bg: var(--ee-primary);
	--bs-btn-border-color: var(--ee-primary);
	--bs-btn-hover-bg: var(--ee-primary-dark);
	--bs-btn-hover-border-color: var(--ee-primary-dark);
	--bs-btn-active-bg: var(--ee-primary-dark);
	--bs-btn-active-border-color: var(--ee-primary-dark);
}

.btn-outline-success {
	--bs-btn-color: var(--ee-primary-dark);
	--bs-btn-border-color: var(--ee-primary);
	--bs-btn-hover-bg: var(--ee-primary);
	--bs-btn-hover-border-color: var(--ee-primary);
}

/* --- Icono inline (helper ee_icon) --- */
.ee-icon {
	vertical-align: -0.125em;
	margin-right: 0.35em;
}

/* --- Login / formularios --- */
.ee-login-form {
	max-width: 420px;
}

/* --- acf_form en el front: aspecto Bootstrap ---
 * Acotado a .acf-form para no afectar NUNCA al Dashboard.
 * Replica el look de .form-control/.form-select sobre el marcado nativo de ACF,
 * así se aplica solo a todos los campos (incluidos nuevos y condicionales). */

.acf-form .acf-fields > .acf-field {
	padding: 0 0 1rem;
	border-top: 0;
}

.acf-form .acf-label label {
	font-weight: 500;
	margin-bottom: 0.4rem;
}

.acf-form .acf-label p.description {
	color: #6c757d;
	font-size: 0.875em;
}

.acf-form .acf-input input[type="text"],
.acf-form .acf-input input[type="email"],
.acf-form .acf-input input[type="number"],
.acf-form .acf-input input[type="url"],
.acf-form .acf-input input[type="password"],
.acf-form .acf-input textarea,
.acf-form .acf-input select {
	display: block;
	width: 100%;
	max-width: 100%;
	padding: 0.5rem 0.75rem;
	font-size: 1rem;
	line-height: 1.5;
	color: #212529;
	background-color: #fff;
	border: 1px solid #ced4da;
	border-radius: 0.375rem;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	height: auto;
}

.acf-form .acf-input input:focus,
.acf-form .acf-input textarea:focus,
.acf-form .acf-input select:focus {
	border-color: var(--ee-primary);
	outline: 0;
	box-shadow: 0 0 0 0.25rem rgba(122, 184, 0, 0.25);
}

/* Select como .form-select: sin apariencia nativa + flecha propia (igual que Bootstrap).
 * Solo para selects simples (no múltiples). */
.acf-form .acf-input select:not([multiple]) {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	padding-right: 2.25rem;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 16px 12px;
}

/* Pestañas de ACF: separación limpia */
.acf-form .acf-tab-wrap {
	margin-bottom: 1rem;
    background:#fff !important;
}

/* Botón de subida del uploader básico y toggle true_false: se dejan como los
 * pinta ACF (ya resultan usables); el botón de guardar usa .btn .btn-success. */

/* --- Ficha de proyecto --- */
.accordion-button:not(.collapsed) {
	color: var(--ee-primary-dark);
	background-color: rgba(122, 184, 0, 0.08);
}
