/* HACKATON PUEBLA 2026 - ADMIN UI */

:root {
    --admin-bg: #052b40;
    --admin-deep: #041c2d;
    --admin-surface: #0c3549;
    --admin-accent: #35d6cc;
    --admin-text: #f3fbff;
    --admin-muted: #a8c7d5;
    --admin-border: rgba(111, 215, 220, .23);
}

body {
    background:
        radial-gradient(
            circle at 80% 15%,
            rgba(31, 155, 167, .22),
            transparent 38%
        ),
        linear-gradient(135deg, #041c2d, #052b40 60%, #0b3c51) !important;
    color: var(--admin-text) !important;
}

/* LOGIN */
.login {
    background: rgba(9, 47, 66, .96) !important;
    color: var(--admin-text) !important;
    border: 1px solid var(--admin-border);
    box-shadow: 0 25px 70px rgba(0, 0, 0, .35) !important;
    backdrop-filter: blur(12px);
}

.login h1 {
    color: white;
    letter-spacing: -.5px;
}

.login .subtitle {
    color: var(--admin-muted);
}

.login label {
    color: #d9eef4;
}

.login input {
    background: #071f30;
    border: 1px solid #376579;
    color: white;
}

.login input:focus {
    outline: 2px solid var(--admin-accent);
    outline-offset: 1px;
}

.login button[type="submit"] {
    background: var(--admin-accent);
    color: #042c3a;
    font-weight: 800;
}

.login button[type="submit"]:hover {
    background: #75eee4;
}

.login .password-toggle {
    color: #a8c7d5;
}

.login .password-toggle:hover {
    background: rgba(255,255,255,.09);
    color: white;
}

.login .back {
    color: #70e3da;
}

/* ADMIN DASHBOARD */
body > header {
    background: rgba(4, 28, 45, .96) !important;
    border-bottom: 1px solid var(--admin-border);
}

body > header h1 {
    color: white;
}

body > header p {
    color: var(--admin-muted);
}

body > header .logout {
    color: var(--admin-accent);
    font-weight: 700;
}

main h2 {
    color: white;
}

main .subtitle {
    color: var(--admin-muted);
}

.grid .card {
    background: rgba(11, 54, 74, .96);
    border: 1px solid var(--admin-border);
    box-shadow: 0 10px 28px rgba(0,0,0,.13);
    transition: transform .2s, border-color .2s;
}

.grid .card:hover {
    transform: translateY(-3px);
    border-color: rgba(53,214,204,.65);
}

.grid .card .value {
    color: var(--admin-accent);
}

.grid .card .label {
    color: #d0e4eb;
}

.panel {
    background: rgba(11, 54, 74, .96);
    color: var(--admin-text);
    border: 1px solid var(--admin-border);
}

.panel h3 {
    color: white;
}

.panel p {
    color: #c4dce5;
}

@media (max-width: 600px) {
    .login {
        padding: 28px !important;
    }

    body > header {
        padding: 18px 5%;
    }

    main {
        margin-top: 25px;
    }
}

/* Configuración del evento */

.settings-panel label {
    display: block;
    font-size: 14px;
    font-weight: 700;
    margin: 20px 0 10px;
    color: #d2e8ef;
}

.settings-form-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.settings-form-row input {
    width: 150px;
    max-width: 100%;
    padding: 13px 15px;
    background: #071f30;
    border: 1px solid #376579;
    border-radius: 9px;
    color: white;
    font-size: 20px;
    font-weight: 700;
}

.settings-form-row input:focus {
    outline: 2px solid #35d6cc;
    outline-offset: 2px;
}

.settings-form-row button {
    padding: 15px 22px;
    background: #35d6cc;
    border: none;
    border-radius: 9px;
    color: #052b40;
    font-weight: 800;
    cursor: pointer;
}

.settings-form-row button:hover {
    background: #75eee4;
}

.settings-help {
    margin-top: 18px;
    color: #a8c7d5;
    font-size: 13px;
}

.settings-notice {
    padding: 15px 20px;
    margin-top: 22px;
    background: rgba(53, 214, 204, .12);
    border: 1px solid #35d6cc;
    border-radius: 10px;
    color: #a5fff5;
}

@media (max-width: 600px) {
    .settings-form-row input,
    .settings-form-row button {
        width: 100%;
    }
}

/* Etapa 4.4: gestión de inscripciones */
.admin-primary-link{display:inline-block;padding:12px 18px;border-radius:9px;background:#35d6cc;color:#052b40;font-weight:800;text-decoration:none}
.admin-primary-link:hover{background:#75eee4}
.admin-filter{display:flex;gap:15px;flex-wrap:wrap;align-items:end;padding:20px;background:#0c3549;border:1px solid #376579;border-radius:12px}
.admin-filter label,.admin-review-form label{display:block;color:#d2e8ef;font-weight:700;font-size:14px}
.admin-filter input,.admin-filter select,.admin-review-form textarea{display:block;margin-top:8px;padding:12px;border-radius:8px;border:1px solid #376579;background:#071f30;color:#fff;width:100%;font:inherit}
.admin-filter button,.admin-review-actions button{border:0;background:#35d6cc;color:#052b40;font-weight:800;border-radius:8px;padding:13px 18px;cursor:pointer}
.admin-table-wrap{overflow-x:auto;background:#0c3549;border-radius:12px;border:1px solid #376579}
.admin-table{width:100%;border-collapse:collapse;color:#e8f5fa;font-size:14px}
.admin-table th,.admin-table td{text-align:left;padding:15px;border-bottom:1px solid #376579}
.admin-table th{color:#80e9df}
.admin-table a{color:#6ee8dd;font-weight:700}
.admin-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.admin-details strong{color:#67e5da}
.admin-details p{overflow-wrap:anywhere}
.admin-review-form textarea{width:100%;min-height:110px}
.admin-review-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:15px}