/**
 * TAINNTECH SOFTWARE SOLUTIONS - OFFICIAL BRAND DESIGN SYSTEM
 * Primary Brand Color: #002752
 * Secondary / Caption Color: #353535
 * Background: #FFFFFF
 * Light Background: #F7F9FC
 * Subtle Border: #E3E7EC
 * Title Font: Bentham
 * Caption / Supporting Font: Bellefair
 */

@font-face {
    font-family: 'Bentham';
    src: url('../fonts/Bentham/Bentham.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bellefair';
    src: url('../fonts/bellefair/Bellefair-Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@import url('https://fonts.googleapis.com/css2?family=Bellefair&family=Bentham&family=Inter:wght@300;400;500;600;700&display=swap');

:root {
    /* Primary Brand Palette */
    --primary: #002752;
    --primary-hover: #001A38;
    --primary-dark: #00152E;
    --primary-light: rgba(0, 39, 82, 0.07);
    --primary-border: rgba(0, 39, 82, 0.2);
    
    /* Secondary / Neutral Palette */
    --secondary: #353535;
    --secondary-light: #525252;
    --secondary-hover: #1F1F1F;
    
    /* Backgrounds & Surfaces */
    --background: #FFFFFF;
    --surface: #F7F9FC;
    --surface-alt: #EEF2F6;
    --surface-card: #FFFFFF;
    --surface-dark: #002752;
    --surface-dark-card: #001F42;
    
    /* Typography Colors */
    --text-primary: #002752;
    --text-secondary: #353535;
    --text-muted: #6B7280;
    --text-white: #FFFFFF;
    
    /* Borders & Accents */
    --border: #E3E7EC;
    --border-dark: rgba(255, 255, 255, 0.15);
    --border-focus: #002752;
    
    /* Buttons */
    --button-primary: #002752;
    --button-hover: #001A38;
    --button-text: #FFFFFF;
    
    /* Typography Families */
    --font-title: 'Bentham', Georgia, serif;
    --font-caption: 'Bellefair', Georgia, serif;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    
    /* Shadows & Radii */
    --shadow-sm: 0 2px 6px rgba(0, 39, 82, 0.04);
    --shadow-md: 0 6px 20px -2px rgba(0, 39, 82, 0.07);
    --shadow-lg: 0 16px 36px -4px rgba(0, 39, 82, 0.1);
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 10px;
}

/* Base Utility Classes */
a {
    color: var(--primary);
}

a:hover, a:focus {
    color: var(--primary-hover);
}

.text-primary-brand {
    color: var(--primary) !important;
}

.bg-primary-brand {
    background-color: var(--primary) !important;
}

.font-bentham {
    font-family: var(--font-title) !important;
}

.font-bellefair {
    font-family: var(--font-caption) !important;
}

.btn-skin {
    color: var(--button-text);
    background-color: var(--button-primary);
    border-color: var(--button-primary);
    font-weight: 600;
}

.btn-skin:hover,
.btn-skin:focus,
.btn-skin:active {
    color: var(--button-text);
    background-color: var(--button-hover);
    border-color: var(--button-hover);
}