/* Arctic Aurora Premium Theme - Teal/Cyan Palette */
/* Based on Dark Theme with -56° hue shift (indigo 243° → teal 187°) */

[data-theme="arctic-aurora"] {
    /* Primary colors - hue shifted to teal */
    --primary: #46e5d8;
    --primary-hover: #38cabb;
    --primary-light: rgba(70, 229, 216, 0.1);
    --primary-text: #5ff5e8;
    --primary-text-hover: #46e5d8;
    --secondary: #657886;
    --accent: #46e5d8;
    --contrast: black;

    /* Status colors - kept standard for dark theme */
    --success: #34d399;
    --warning: #fbbf24;
    --error: #f87171;

    /* Background colors - hue shifted with teal tint */
    --bg-primary: #0f2a2a;
    --bg-secondary: #1e3b3b;
    --bg-tertiary: #335555;

    /* Text colors - PRESERVED from dark theme for accessibility */
    --text-primary: #f8fafc;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;

    /* Border colors - hue shifted */
    --border: #334f55;
    --border-light: #476569;

    /* Shadow base */
    --shadow: rgba(0, 0, 0, 0.3);
    --shadow-lg: rgba(0, 0, 0, 0.4);

    /* Transparency variations - using primary teal RGB (70, 229, 216) */
    --overlay-light: rgba(0, 0, 0, 0.6);
    --overlay-dark: rgba(0, 0, 0, 0.8);
    --bg-blur: rgba(30, 59, 59, 0.8);
    --bg-subtle: rgba(70, 229, 216, 0.1);
    --bg-hover: rgba(70, 229, 216, 0.15);
    --border-focus: rgba(70, 229, 216, 0.25);
    --shadow-primary: rgba(70, 229, 216, 0.2);
    --shadow-primary-lg: rgba(70, 229, 216, 0.3);
    --shadow-primary-xl: rgba(70, 229, 216, 0.4);
    --bg-white-overlay: rgba(255, 255, 255, 0.1);
    --border-white-overlay: rgba(255, 255, 255, 0.2);
    --bg-black-overlay: rgba(0, 0, 0, 0.2);
    --bg-success-subtle: rgba(52, 211, 153, 0.1);
    --bg-error-subtle: rgba(248, 113, 113, 0.1);
    --border-success: rgba(52, 211, 153, 0.3);
    --border-error: rgba(248, 113, 113, 0.3);
}

/* Theme-specific adjustments */
[data-theme="arctic-aurora"] .btn-primary {
    background: var(--primary);
    color: black;
    border: 1px solid var(--primary);
}

[data-theme="arctic-aurora"] .btn-primary:hover {
    background: var(--primary-hover);
    color: black;
}

[data-theme="arctic-aurora"] a {
    color: var(--primary-text);
}

[data-theme="arctic-aurora"] a:hover {
    color: var(--primary-text-hover);
}

[data-theme="arctic-aurora"] .form-control {
    background: var(--bg-primary);
    color: var(--text-primary);
    border: 1px solid var(--border);
}

[data-theme="arctic-aurora"] .form-control:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 2px var(--border-focus);
}