/* Variables base */
:root {
    --font-base: 1rem;
    --btn-padding: 0.75rem 1.25rem;
    --card-min-height: 180px;
}

/* Modo Senior (Activado via clase en body) */
body.senior-mode {
    --font-base: 1.3rem;
    --btn-padding: 1rem 2rem;
    font-size: var(--font-base) !important;
}

body.senior-mode h1 { font-size: 2.5rem; }
body.senior-mode h2 { font-size: 2rem; }
body.senior-mode h3 { font-size: 1.75rem; }
body.senior-mode .btn { 
    font-weight: bold; 
    border-width: 3px;
    font-size: 1.2rem;
}
body.senior-mode .card {
    border: 2px solid #000;
}

/* Tarjetas del Dashboard */
.dashboard-card {
    transition: transform 0.2s;
    cursor: pointer;
    min-height: var(--card-min-height);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    color: inherit;
    border: 1px solid #dee2e6;
}
.dashboard-card:hover {
    transform: translateY(-5px);
    background-color: #f8f9fa;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}

.icon-large {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #0d6efd; /* Bootstrap primary */
}

/* Badge grande para notificaciones */
.badge-counter {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 1rem;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}