/* Coastal Flow Theme - Source of Truth */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@500;600;700&display=swap');

:root {
    /* Coastal Flow palette */
    --cf-bg: linear-gradient(180deg, #062c36 0%, #052a34 50%, #041f26 100%);
    --cf-shell: linear-gradient(155deg, rgba(2, 24, 32, 0.96), rgba(6, 46, 58, 0.92));
    --cf-panel: rgba(6, 64, 74, 0.42);
    --cf-panel-accent: rgba(12, 98, 108, 0.52);
    --cf-border: rgba(94, 234, 212, 0.28);
    --cf-border-strong: rgba(94, 234, 212, 0.42);
    --cf-text: rgba(224, 255, 248, 0.92);
    --cf-text-muted: rgba(178, 226, 230, 0.68);
    --cf-heading: rgba(236, 254, 255, 0.82);
    --cf-accent: rgba(94, 234, 212, 0.92);
    --cf-accent-strong: rgba(94, 234, 212, 0.18);
    --cf-btn: linear-gradient(135deg, rgba(45, 205, 190, 0.95), rgba(94, 234, 212, 0.98));
    
    /* Shadows */
    --shadow-shell: 0 52px 110px rgba(2, 26, 36, 0.62);
    --shadow-panel: inset 0 1px 0 rgba(236, 254, 255, 0.12);
    
    /* Mappings for legacy/generic names */
    --card-surface: var(--cf-panel);
    --card-outline: var(--cf-border);
    --primary-color: #0F766E;
    --secondary-color: #0E7490;
    --accent-color: var(--cf-accent);
    --background-color: #041f26; /* Fallback */
    --text-color: var(--cf-text);
    --border-color: var(--cf-border);
    --radius: 16px;
    --transition: all 0.2s ease;
    
    /* Status Colors */
    --warning-color: #FBBF24;
    --danger-color: #EF4444;
    --success-color: #14B8A6;
}

/* Global Reset & Base Styles */
* {
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    min-height: 100vh;
}

body {
    font-family: 'Inter', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    line-height: 1.6;
    color: var(--cf-text);
    background-color: #041f26; /* Fallback color */
    background-image: var(--cf-bg);
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    color: var(--cf-heading);
    letter-spacing: 0.06em;
}

a {
    color: var(--cf-accent);
    text-decoration: none;
    transition: var(--transition);
}

a:hover {
    color: #ffffff;
}

/* Scrollbar Styling */
::-webkit-scrollbar {
    width: 12px;
    background: transparent;
}

::-webkit-scrollbar-track {
    background: rgba(2, 30, 40, 0.6);
    border-radius: 999px;
    border: 1px solid rgba(4, 120, 136, 0.35);
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, rgba(45, 205, 190, 0.7), rgba(94, 234, 212, 0.9));
    border-radius: 999px;
    border: 2px solid rgba(1, 18, 26, 0.65);
    box-shadow: 0 6px 16px rgba(6, 180, 190, 0.25);
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, rgba(94, 234, 212, 0.95), rgba(167, 255, 244, 0.95));
}
