/*
#	Project: SupDoc - Document Management System
#	This is NOT a freeware, use is subject to license terms.
#	Website: https://supixsoft.com/
#	Author: SupDoc Team
#	Copyright (C) 2024-2026 SupDoc. All Rights Reserved.
*/

/* ---- from login.html ---- */
body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
            background-color: var(--auth-bg, #f5f5f5);
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 20px;
            margin: 0;
        }

        [data-theme="light"] {
            --auth-bg: #f5f5f5;
            --auth-card-bg: #ffffff;
            --auth-text-primary: #1f2937;
            --auth-text-secondary: #6b7280;
            --auth-border: #e5e7eb;
            --auth-border-focus: #9ca3af;
            --auth-btn-bg: #374151;
            --auth-btn-hover: #1f2937;
            --auth-icon-color: #6b7280;
        }

        [data-theme="dark"] {
            --auth-bg: #1a1a1a;
            --auth-card-bg: #2d2d2d;
            --auth-text-primary: #e5e7eb;
            --auth-text-secondary: #9ca3af;
            --auth-border: #404040;
            --auth-border-focus: #6b7280;
            --auth-btn-bg: #e5e7eb;
            --auth-btn-hover: #f3f4f6;
            --auth-icon-color: #9ca3af;
        }

        .auth-container { width: 100%; max-width: 420px; }

        .auth-card {
            background: var(--auth-card-bg);
            border-radius: 12px;
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
            padding: 40px;
            border: 1px solid var(--auth-border);
        }

        [data-theme="dark"] .auth-card {
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
        }

        .auth-header { text-align: center; margin-bottom: 32px; }
        .auth-header .logo { font-size: 3rem; color: var(--auth-icon-color); margin-bottom: 16px; }
        .auth-header h1 {
            color: var(--auth-text-primary);
            font-weight: 600;
            font-size: 1.5rem;
            margin-bottom: 8px;
        }
        .auth-header p { color: var(--auth-text-secondary); font-size: 0.9rem; margin: 0; }

        .form-floating { margin-bottom: 20px; }
        .form-floating label { color: var(--auth-text-secondary); }

        .form-control {
            background-color: var(--auth-card-bg);
            border: 1px solid var(--auth-border);
            border-radius: 8px;
            padding: 12px 15px;
            height: auto;
            color: var(--auth-text-primary);
            transition: border-color 0.2s, box-shadow 0.2s;
        }

        .form-control:focus {
            background-color: var(--auth-card-bg);
            border-color: var(--auth-border-focus);
            box-shadow: 0 0 0 0.2rem rgba(107, 114, 128, 0.15);
            color: var(--auth-text-primary);
        }

        .btn-primary {
            background-color: var(--auth-btn-bg);
            border: none;
            border-radius: 8px;
            padding: 12px;
            font-weight: 600;
            width: 100%;
            margin-top: 10px;
            color: #ffffff;
            transition: background-color 0.2s;
        }

        [data-theme="dark"] .btn-primary { color: #1a1a1a; }
        .btn-primary:hover { background-color: var(--auth-btn-hover); }
        .btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }

        .alert { border-radius: 8px; margin-bottom: 20px; border: 1px solid var(--auth-border); }
        .form-check-label { color: var(--auth-text-secondary); }
        .form-check-input { border-color: var(--auth-border); }
        .form-check-input:checked { background-color: var(--auth-btn-bg); border-color: var(--auth-btn-bg); }

        .auth-footer { text-align: center; margin-top: 24px; }
        .auth-footer a {
            color: var(--auth-text-secondary);
            text-decoration: none;
            font-size: 0.875rem;
            transition: color 0.2s;
        }
        .auth-footer a:hover { color: var(--auth-text-primary); }

        .theme-toggle-container { position: fixed; top: 20px; right: 20px; }
        .docs-theme-toggle {
            background: var(--auth-card-bg);
            border: 1px solid var(--auth-border);
            border-radius: 8px;
            width: 40px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: all 0.2s;
            color: var(--auth-text-primary);
        }
        .docs-theme-toggle:hover { background-color: var(--auth-border); }

/* ---- from register.html ---- */
body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
            background-color: var(--auth-bg, #f5f5f5);
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 20px;
            margin: 0;
        }

        [data-theme="light"] {
            --auth-bg: #f5f5f5;
            --auth-card-bg: #ffffff;
            --auth-text-primary: #1f2937;
            --auth-text-secondary: #6b7280;
            --auth-border: #e5e7eb;
            --auth-border-focus: #9ca3af;
            --auth-btn-bg: #374151;
            --auth-btn-hover: #1f2937;
            --auth-icon-color: #6b7280;
        }

        [data-theme="dark"] {
            --auth-bg: #1a1a1a;
            --auth-card-bg: #2d2d2d;
            --auth-text-primary: #e5e7eb;
            --auth-text-secondary: #9ca3af;
            --auth-border: #404040;
            --auth-border-focus: #6b7280;
            --auth-btn-bg: #e5e7eb;
            --auth-btn-hover: #f3f4f6;
            --auth-icon-color: #9ca3af;
        }

        .auth-container { width: 100%; max-width: 480px; }

        .auth-card {
            background: var(--auth-card-bg);
            border-radius: 12px;
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
            padding: 40px;
            border: 1px solid var(--auth-border);
        }

        [data-theme="dark"] .auth-card {
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
        }

        .auth-header { text-align: center; margin-bottom: 28px; }
        .auth-header .logo { font-size: 3rem; color: var(--auth-icon-color); margin-bottom: 16px; }
        .auth-header h1 {
            color: var(--auth-text-primary);
            font-weight: 600;
            font-size: 1.5rem;
            margin-bottom: 8px;
        }
        .auth-header p { color: var(--auth-text-secondary); font-size: 0.9rem; margin: 0; }

        .form-floating { margin-bottom: 16px; }
        .form-floating label { color: var(--auth-text-secondary); }

        .form-control {
            background-color: var(--auth-card-bg);
            border: 1px solid var(--auth-border);
            border-radius: 8px;
            padding: 12px 15px;
            height: auto;
            color: var(--auth-text-primary);
        }

        .form-control:focus {
            background-color: var(--auth-card-bg);
            border-color: var(--auth-border-focus);
            box-shadow: 0 0 0 0.2rem rgba(107, 114, 128, 0.15);
            color: var(--auth-text-primary);
        }

        .captcha-box {
            height: 58px;
            border: 1px solid var(--auth-border);
            border-radius: 8px;
            background: #f9fafb;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            overflow: hidden;
        }

        [data-theme="dark"] .captcha-box { background: #1f1f1f; }

        .captcha-box img { max-width: 100%; max-height: 100%; object-fit: contain; }

        .btn-primary {
            background-color: var(--auth-btn-bg);
            border: none;
            border-radius: 8px;
            padding: 12px;
            font-weight: 600;
            width: 100%;
            margin-top: 10px;
            color: #ffffff;
        }

        [data-theme="dark"] .btn-primary { color: #1a1a1a; }
        .btn-primary:hover { background-color: var(--auth-btn-hover); }
        .btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }

        .alert { border-radius: 8px; margin-bottom: 20px; border: 1px solid var(--auth-border); }
        .form-check-label { color: var(--auth-text-secondary); font-size: 0.875rem; }
        .form-check-input { border-color: var(--auth-border); }
        .form-check-input:checked { background-color: var(--auth-btn-bg); border-color: var(--auth-btn-bg); }

        .auth-footer { text-align: center; margin-top: 24px; }
        .auth-footer a {
            color: var(--auth-text-secondary);
            text-decoration: none;
            font-size: 0.875rem;
        }
        .auth-footer a:hover { color: var(--auth-text-primary); }

        .theme-toggle-container { position: fixed; top: 20px; right: 20px; }
        .docs-theme-toggle {
            background: var(--auth-card-bg);
            border: 1px solid var(--auth-border);
            border-radius: 8px;
            width: 40px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            color: var(--auth-text-primary);
        }