/* =========================================================
   Spazio Vitale - Componentes reutilizables
   Botones, cards, formularios. Se ampliara en Fase 4/7.
   ========================================================= */

/* ---- Botones ---- */
.gym-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-sm);
    padding: 0.6em 1.4em;
    font-family: var(--font-body);
    font-size: var(--text-base);
    font-weight: 600;
    line-height: 1;
    border: 2px solid transparent;
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
    text-decoration: none;
}
.gym-btn:hover { text-decoration: none; }

.gym-btn--primary {
    background: var(--color-primary);
    color: var(--color-text-invert);
}
.gym-btn--primary:hover { background: var(--color-primary-dark); color: var(--color-text-invert); }

.gym-btn--secondary {
    background: var(--color-secondary);
    color: var(--color-text-invert);
}
.gym-btn--secondary:hover { background: var(--color-secondary-dark); }

.gym-btn--ghost {
    background: transparent;
    border-color: var(--color-border);
    color: var(--color-text);
}
.gym-btn--ghost:hover { border-color: var(--color-primary); color: var(--color-primary-dark); }

.gym-btn--lg { font-size: var(--text-lg); padding: 0.8em 2em; }

.gym-btn[disabled], .gym-btn--disabled {
    opacity: .5;
    cursor: not-allowed;
    pointer-events: none;
}

/* ---- Cards ---- */
.gym-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: var(--space-lg);
}

/* ---- Formularios ---- */
.gym-field { margin-bottom: var(--space-md); }
.gym-label {
    display: block;
    margin-bottom: var(--space-sm);
    font-weight: 600;
    font-size: var(--text-sm);
}
.gym-input,
.gym-select,
.gym-textarea {
    width: 100%;
    padding: 0.7em 0.9em;
    font-family: var(--font-body);
    font-size: var(--text-base);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
}
.gym-input:focus,
.gym-select:focus,
.gym-textarea:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(111, 181, 44, 0.15);
}

/* ---- Avisos ---- */
.gym-alert { padding: var(--space-md); border-radius: var(--radius-sm); margin-bottom: var(--space-md); }
.gym-alert--success { background: #EAF5DE; color: var(--color-success); }
.gym-alert--error   { background: #FBE6E6; color: var(--color-danger); }
.gym-alert--info    { background: #E6F0FA; color: var(--color-info); }

/* Honeypot anti-spam: oculto para humanos, visible para bots */
.gym-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---- Auth (login / registro) ---- */
.gym-auth { max-width: 460px; }
.gym-auth__card { padding: var(--space-lg); }
.gym-auth__title { margin-bottom: var(--space-sm); }
.gym-auth__sub { color: var(--color-text-muted); margin-bottom: var(--space-lg); }
.gym-auth__links { margin-top: var(--space-md); font-size: var(--text-sm); text-align: center; }
.gym-auth__links a { color: var(--color-primary-dark); font-weight: 600; }

/* wp_login_form() markup */
#gym-loginform p { margin: 0 0 var(--space-md); }
#gym-loginform label { display: block; margin-bottom: var(--space-sm); font-weight: 600; font-size: var(--text-sm); }
#gym-loginform input[type="text"],
#gym-loginform input[type="password"] {
	width: 100%;
	padding: 0.7em 0.9em;
	font-family: var(--font-body);
	font-size: var(--text-base);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
}
#gym-loginform .login-remember label { font-weight: 400; }
#gym-loginform .button,
#gym-loginform #wp-submit {
	width: 100%;
	padding: 0.8em 1.4em;
	font-weight: 600;
	color: var(--color-text-invert);
	background: var(--color-primary);
	border: none;
	border-radius: var(--radius-md);
	cursor: pointer;
}
#gym-loginform .button:hover,
#gym-loginform #wp-submit:hover { background: var(--color-primary-dark); }

/* ---- Portal de cliente ---- */
.gym-portal { max-width: 640px; }
.gym-form .gym-btn { margin-top: var(--space-sm); }
.gym-sep { border: none; border-top: 1px solid var(--color-border); margin: var(--space-lg) 0; }
.gym-subtitle { font-size: var(--text-lg); margin-bottom: var(--space-sm); }
.gym-text-muted { color: var(--color-text-muted); font-size: var(--text-sm); }
.gym-portal__logout { margin-top: var(--space-lg); }
.gym-input:disabled { background: var(--color-surface-alt); color: var(--color-text-muted); cursor: not-allowed; }