/* public/assets/css/auth_thema.css */
/* Specifiek blauw thema voor authenticatiepagina's */

:root {
    --auth-primary-color: #2563eb; /* blue-600 */
    --auth-primary-hover-color: #1d4ed8; /* blue-700 */
    --auth-primary-light-color: #60a5fa; /* blue-400 */
    --auth-primary-lighter-color: #eff6ff; /* blue-50 */
    --auth-primary-darker-color: #1e3a8a; /* blue-800 */
    
    --auth-text-on-primary: white;
    --auth-text-on-primary-subtle: #dbeafe; /* blue-200 */
    
    --auth-page-background: #f0f2f5; /* Standaard lichte pagina achtergrond */
    --auth-card-background: white;
    --auth-text-color: #1f2937; /* Standaard donkere tekst */
    --auth-link-color: #2563eb; /* Primair blauw voor links */
    --auth-border-color: #d1d5db; /* Standaard randkleur */
    --auth-input-border-color: #cbd5e1; /* gray-300 voor input randen */
    
    --header-height: 68px; /* Moet overeenkomen met style.css of hier gedefinieerd */
    --auth-primary-rgb: 37, 99, 235; 
    --auth-primary-light-color-rgb: 96, 165, 250; 
}

/* --- Globale Thema Toepassingen voor Auth Pagina's --- */
body { 
    background-color: var(--auth-page-background); 
    color: var(--auth-text-color); 
    font-family: 'Inter', sans-serif; /* Zorg dat dit consistent is */
}
main.site-main { 
    padding-top: var(--header-height); 
}
a { 
    color: var(--auth-link-color); 
}
a:hover { 
    color: var(--auth-primary-hover-color); 
}

/* --- Site Header Thema voor Auth Pagina's --- */
.site-header { 
    background-color: var(--auth-primary-color); 
    color: var(--auth-text-on-primary); 
    height: var(--header-height); 
}
.header-logo-link { 
    color: var(--auth-text-on-primary); 
}
.header-search-input { 
    background-color: #3b82f6; /* blue-500 */
    color: var(--auth-text-on-primary); 
    border-color: var(--auth-primary-light-color); 
}
.header-search-input::placeholder { color: var(--auth-text-on-primary-subtle); }
.header-search-input:focus { 
    background-color: white; 
    color: var(--auth-text-color); 
    border-color: var(--auth-primary-color); 
    box-shadow: 0 0 0 3px rgba(var(--auth-primary-rgb), 0.25); 
}
.header-nav-link { color: var(--auth-text-on-primary-subtle); }
.header-nav-link:hover { color: var(--auth-text-on-primary); background-color: var(--auth-primary-hover-color); }
.header-nav-link-highlight { background-color: var(--auth-text-on-primary); color: var(--auth-primary-color); }
.header-nav-link-highlight:hover { background-color: #e0e7ff; color: var(--auth-primary-hover-color); }
.header-nav-icon svg { stroke: var(--auth-text-on-primary-subtle); }
.header-nav-icon:hover svg { stroke: var(--auth-text-on-primary); }
.header-profile-pic { border: 2px solid var(--auth-text-on-primary-subtle); } /* Voor het geval het in de header staat */

/* --- Auth Forms Container & Form Content Thema --- */
.container.auth-container, .profile-edit-container { /* .profile-edit-container wordt hier ook meegenomen voor consistentie als het door index.php wordt geladen */
    background-color: var(--auth-card-background); 
    border-top: 4px solid var(--auth-primary-color); 
}
.form-content h2 { 
    color: var(--auth-primary-darker-color);
}
.form-content input[type="text"],
.form-content input[type="email"],
.form-content input[type="password"],
.form-content input[type="date"],
.form-content input[type="url"],
.form-content select,
.form-content textarea {
    border-color: var(--auth-input-border-color); 
    background-color: #fff; /* Witte achtergrond voor inputvelden */
}
.form-content input:focus, 
.form-content select:focus, 
.form-content textarea:focus {
    border-color: var(--auth-primary-color); 
    box-shadow: 0 0 0 3px rgba(var(--auth-primary-rgb), 0.25); 
}
.button-styling, /* Algemene knop class uit style.css */
.form-content button[type="submit"] {
    background-color: var(--auth-primary-color);
    color: var(--auth-text-on-primary);
    border-color: var(--auth-primary-color); 
}
.button-styling:hover, 
.form-content button[type="submit"]:hover { 
    background-color: var(--auth-primary-hover-color);
    border-color: var(--auth-primary-hover-color);
}
.form-content .link-container a { color: var(--auth-link-color); }

/* --- Pagina Footer Thema voor Auth Pagina's --- */
.site-footer { 
    background-color: #ffffff; 
    color: #4b5563; /* gray-600 */
    border-top: 1px solid var(--auth-border-color); 
}
.site-footer a { 
    color: var(--auth-link-color); 
}
.site-footer a:hover { 
    color: var(--auth-primary-hover-color); 
}

/* Eventuele specifieke overrides voor profielknoppen als ze op een auth pagina zouden verschijnen (onwaarschijnlijk) */
/* Deze zijn meer voor profiel.php's thema's */
/*
a.profile-action-button, button.profile-action-button { ... }
a.profile-action-button-secondary, button.profile-action-button-secondary { ... }
.photo-upload-trigger { ... }
*/