/* css/login-style.css */

/* Wrapper Utama dengan Background SVG Abstrak Geometris Ringan */
.login-wrapper {
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg fill='%230284c7' fill-opacity='0.03'%3E%3Cpath d='M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm63 31c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 90c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm56-76c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4z'/%3E%3C/g%3E%3C/svg%3E");
}

/* Judul Utama */
.login-header-title {
    letter-spacing: -0.8px; 
    font-weight: 800; 
    color: #0f172a !important;
}

/* Card Form Login */
.login-card {
    border-radius: 16px; 
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
}

.login-card-divider {
    border-bottom: 2px solid #f1f5f9;
}

.login-card-title {
    font-size: 14px; 
    color: #334155;
}

/* Label & Input Field */
.login-label {
    font-size: 13px; 
    letter-spacing: 0.3px;
}

.login-input-group-icon {
    border-radius: 8px 0 0 8px; 
    border-color: #cbd5e1;
}

.login-input-group-icon i {
    font-size: 13px;
}

.login-field {
    border-radius: 0 8px 8px 0; 
    height: 45px; 
    font-size: 14px; 
    border-color: #cbd5e1;
}

/* Efek Interaktif Penegas Fokus Input */
.login-field:focus {
    border-color: #1e3a8a !important;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.15) !important;
}

/* Tombol Submit Tegas */
.login-btn-tegas {
    background-color: #1e3a8a !important;
    border: none !important;
    height: 46px; 
    border-radius: 8px; 
    font-size: 15px;
    transition: all 0.2s ease;
}

.login-btn-tegas:hover {
    background-color: #1d4ed8 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(29, 78, 216, 0.2) !important;
}