/**
 * AGTI TaskMaster - Login Page Styles (SmartHR)
 * Force override AGTI Authentication System styles
 */

/* Login Page Wrapper */
.agti-tm-login-wrapper {
    max-width: 420px !important;
    margin: 60px auto !important;
    padding: 40px 30px !important;
    background: #ffffff !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08) !important;
    text-align: center !important;
    border: none !important;
}

/* Login Header */
.agti-tm-login-header {
    text-align: center !important;
    margin-bottom: 30px !important;
    display: block !important;
    width: 100% !important;
}

.agti-tm-login-icon {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 80px !important;
    height: 80px !important;
    margin: 0 auto 24px auto !important;
    background: rgba(202, 142, 70, 0.1) !important;
    border-radius: 50% !important;
}

.agti-tm-login-icon svg {
    width: 40px !important;
    height: 40px !important;
}

.agti-tm-login-header h2 {
    margin: 0 0 12px 0 !important;
    font-size: 24px !important;
    color: var(--tm-dark, #212121) !important;
    font-weight: 700 !important;
    text-align: center !important;
    display: block !important;
    width: 100% !important;
}

.agti-tm-login-header p {
    margin: 0 auto !important;
    color: var(--tm-gray-500, #6b7280) !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    text-align: center !important;
    max-width: 320px !important;
    display: block !important;
    width: 100% !important;
}

/* Override AGTI Authentication form styles with high specificity */
.agti-tm-login-wrapper .agti-login-form-container,
div.agti-tm-login-wrapper .agti-login-form-container {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

.agti-tm-login-wrapper .agti-login-form,
div.agti-tm-login-wrapper .agti-login-form,
.agti-tm-login-wrapper .agti-login-form-container .agti-login-form {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    border: none !important;
    background: transparent !important;
    border-radius: 0 !important;
}

.agti-tm-login-wrapper .agti-form-header,
.agti-tm-login-wrapper .agti-login-form .agti-form-header {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.agti-tm-login-wrapper .agti-form-group,
.agti-tm-login-wrapper form .agti-form-group,
.agti-tm-login-wrapper .agti-login-form .agti-form-group {
    margin-bottom: 16px !important;
    text-align: left !important;
}

.agti-tm-login-wrapper .agti-form-group label,
.agti-tm-login-wrapper form .agti-form-group label,
.agti-tm-login-wrapper .agti-login-form .agti-form-group label {
    display: block !important;
    margin-bottom: 8px !important;
    font-weight: 500 !important;
    color: #212121 !important;
    font-size: 14px !important;
    text-align: left !important;
}

.agti-tm-login-wrapper .agti-form-group input,
.agti-tm-login-wrapper form .agti-form-group input,
.agti-tm-login-wrapper .agti-login-form .agti-form-group input,
.agti-tm-login-wrapper .agti-form-group input[type="email"],
.agti-tm-login-wrapper .agti-form-group input[type="password"],
.agti-tm-login-wrapper .agti-form-group input[type="text"] {
    width: 100% !important;
    padding: 14px 16px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
    background: #ffffff !important;
}

.agti-tm-login-wrapper .agti-form-group input:focus,
.agti-tm-login-wrapper form .agti-form-group input:focus,
.agti-tm-login-wrapper .agti-login-form .agti-form-group input:focus {
    outline: none !important;
    border-color: #ca8e46 !important;
    box-shadow: 0 0 0 3px rgba(202, 142, 70, 0.15) !important;
}

.agti-tm-login-wrapper .agti-password-wrapper {
    width: 100% !important;
}

.agti-tm-login-wrapper .agti-password-wrapper input {
    padding-right: 45px !important;
}

.agti-tm-login-wrapper .agti-form-links {
    text-align: right !important;
    margin-bottom: 20px !important;
}

.agti-tm-login-wrapper .agti-btn,
.agti-tm-login-wrapper form .agti-btn,
.agti-tm-login-wrapper .agti-login-form .agti-btn,
.agti-tm-login-wrapper button.agti-btn,
.agti-tm-login-wrapper button.agti-btn-primary,
.agti-tm-login-wrapper form button[type="submit"] {
    width: 100% !important;
    padding: 14px 24px !important;
    background: #ca8e46 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: background 0.2s, transform 0.1s !important;
    box-shadow: none !important;
    text-align: center !important;
    display: block !important;
}

.agti-tm-login-wrapper .agti-btn:hover,
.agti-tm-login-wrapper form .agti-btn:hover,
.agti-tm-login-wrapper button.agti-btn:hover,
.agti-tm-login-wrapper button.agti-btn-primary:hover {
    background: #b87d3a !important;
    transform: translateY(-1px) !important;
}

.agti-tm-login-wrapper .agti-btn:active,
.agti-tm-login-wrapper form .agti-btn:active,
.agti-tm-login-wrapper button.agti-btn:active {
    transform: scale(0.98) !important;
}

.agti-tm-login-wrapper .agti-form-footer,
.agti-tm-login-wrapper form .agti-form-footer,
.agti-tm-login-wrapper .agti-login-form .agti-form-footer {
    margin-top: 24px !important;
    padding-top: 20px !important;
    border-top: 1px solid #e5e7eb !important;
    text-align: center !important;
}

.agti-tm-login-wrapper .agti-form-footer p,
.agti-tm-login-wrapper .agti-form-footer a {
    text-align: center !important;
}

/* Access Denied Card */
.agti-tm-access-wrapper {
    max-width: 420px;
    margin: 60px auto;
    padding: 0 20px;
}

.agti-tm-access-card {
    background: var(--tm-white, #fff);
    border-radius: var(--tm-radius-xl, 16px);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    padding: 40px 30px;
    text-align: center;
}

.agti-tm-access-card.agti-tm-access-denied {
    border-top: 4px solid var(--tm-danger, #ef4444);
}

.agti-tm-access-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 80px;
    margin: 0 auto 24px auto;
    background: rgba(239, 68, 68, 0.1);
    border-radius: 50%;
}

.agti-tm-access-icon svg {
    width: 40px;
    height: 40px;
}

.agti-tm-access-card h2 {
    margin: 0 0 12px 0;
    font-size: 24px;
    color: var(--tm-dark, #212121);
    font-weight: 700;
}

.agti-tm-access-card p {
    margin: 0 0 16px 0;
    color: var(--tm-gray-500, #6b7280);
    font-size: 15px;
    line-height: 1.6;
}

.agti-tm-contact-text {
    font-size: 14px !important;
    color: var(--tm-gray-400, #9ca3af) !important;
}

/* Responsive */
@media (max-width: 480px) {
    .agti-tm-login-wrapper,
    .agti-tm-access-card {
        margin: 30px auto !important;
        padding: 30px 20px !important;
    }
    
    .agti-tm-login-header h2,
    .agti-tm-access-card h2 {
        font-size: 20px !important;
    }
}