/* 
 * Mashkia Platform - Auth Compact CSS
 * Path: assets/css/auth-compact.css
 * Purpose: Compact sizing for all authentication pages
 */

/* Auth Card Sizing */
.auth-card {
    padding: var(--spacing-lg) !important;
    max-width: 400px !important;
}

/* Header Adjustments */
.auth-header {
    margin-bottom: var(--spacing-lg) !important;
}

.auth-header img {
    height: 40px !important;
    margin-bottom: var(--spacing-md) !important;
}

.auth-header h1 {
    font-size: 1.4rem !important;
    margin-bottom: var(--spacing-xs) !important;
}

.auth-header p {
    font-size: 0.85rem !important;
}

/* Form Elements */
.form-group {
    margin-bottom: var(--spacing-md) !important;
}

.form-label {
    font-size: 0.8rem !important;
    margin-bottom: var(--spacing-xs) !important;
}

.form-input {
    padding: var(--spacing-sm) var(--spacing-md) !important;
    font-size: 0.85rem !important;
    border-radius: var(--radius-sm) !important;
}

/* Buttons */
.google-signin-btn {
    padding: var(--spacing-sm) var(--spacing-md) !important;
    font-size: 0.85rem !important;
    margin-bottom: var(--spacing-lg) !important;
    border-radius: var(--radius-md) !important;
    gap: var(--spacing-sm) !important;
}

.btn-large, .btn-xl {
    padding: var(--spacing-sm) var(--spacing-lg) !important;
    font-size: 0.9rem !important;
}

/* Submit buttons in forms */
form button[type="submit"] {
    padding: var(--spacing-sm) var(--spacing-lg) !important;
    font-size: 0.9rem !important;
    margin-top: var(--spacing-md) !important;
}

/* Divider */
.divider {
    margin: var(--spacing-lg) 0 !important;
    font-size: 0.8rem !important;
}

.divider span {
    padding: 0 var(--spacing-md) !important;
}

/* Messages */
.error-message, .success-message {
    padding: var(--spacing-sm) var(--spacing-md) !important;
    margin-bottom: var(--spacing-md) !important;
    font-size: 0.8rem !important;
    border-radius: var(--radius-sm) !important;
}

/* Signup Benefits */
.signup-benefits {
    padding: var(--spacing-md) !important;
    margin-bottom: var(--spacing-lg) !important;
}

.signup-benefits h3 {
    font-size: 1rem !important;
    margin-bottom: var(--spacing-sm) !important;
}

.signup-benefits li {
    font-size: 0.85rem !important;
    padding: var(--spacing-xs) 0 !important;
}

/* Links */
.signup-links, .login-links {
    margin-top: var(--spacing-lg) !important;
    padding-top: var(--spacing-lg) !important;
}

.signup-links p, .login-links p {
    font-size: 0.8rem !important;
    margin-bottom: var(--spacing-xs) !important;
}

.signup-links a, .login-links a {
    font-size: 0.85rem !important;
}

.forgot-password {
    margin-top: var(--spacing-md) !important;
}

.forgot-password a {
    font-size: 0.75rem !important;
}

.back-home {
    margin-top: var(--spacing-md) !important;
}

.back-home a {
    font-size: 0.75rem !important;
}

/* Left Panel Content */
.welcome-content {
    max-width: 350px !important;
}

.welcome-icon {
    font-size: 3rem !important;
    margin-bottom: var(--spacing-lg) !important;
}

.welcome-content h2 {
    font-size: 1.8rem !important;
    margin-bottom: var(--spacing-md) !important;
}

.welcome-content p {
    font-size: 0.95rem !important;
    margin-bottom: var(--spacing-lg) !important;
}

.features-list li {
    font-size: 0.9rem !important;
    padding: var(--spacing-xs) 0 !important;
}

.features-list li::before {
    font-size: 1rem !important;
    margin-right: var(--spacing-sm) !important;
}

/* Certification/CTA Badges */
.certification-badge, .cta-badge {
    padding: var(--spacing-md) !important;
    margin-top: var(--spacing-lg) !important;
}

.certification-badge h4, .cta-badge h4 {
    font-size: 1rem !important;
    margin-bottom: var(--spacing-xs) !important;
}

.certification-badge p, .cta-badge p {
    font-size: 0.8rem !important;
}

/* Form Row Adjustments */
.form-row {
    gap: var(--spacing-sm) !important;
}

/* Mobile Responsive Adjustments */
@media (max-width: 768px) {
    .auth-card {
        padding: var(--spacing-md) !important;
        max-width: 100% !important;
    }
    
    .welcome-content h2 {
        font-size: 1.6rem !important;
    }
    
    .welcome-content p {
        font-size: 0.9rem !important;
    }
}