/* City Mall Premium Theme */

@font-face {
    font-family: 'HM pangram Thin';
    src: url('/fonts/HMpangram-Thin.ttf') format('truetype');
    font-style: normal;
}

@font-face {
    font-family: 'HM pangram Extra Light';
    src: url('/fonts/HMpangram-ExtraLight.ttf') format('truetype');
    font-style: normal;
}

@font-face {
    font-family: 'HM pangram Light';
    src: url('/fonts/HMpangram-Light.ttf') format('truetype');
    font-style: normal;
}

@font-face {
    font-family: 'HM pangram Medium';
    src: url('/fonts/HMpangram-Medium.ttf') format('truetype');
    font-style: normal;
}

@font-face {
    font-family: 'HM pangram Bold';
    src: url('/fonts/HMpangram-Bold.ttf') format('truetype');
    font-style: normal;
}

@font-face {
    font-family: 'HM pangram ExtraBold';
    src: url('/fonts/HMpangram-ExtraBold.ttf') format('truetype');
    font-style: normal;
}

@font-face {
    font-family: 'HM pangram Heavy';
    src: url('/fonts/HMpangram-Heavy.ttf') format('truetype');
    font-style: normal;
}

@font-face {
    font-family: 'HM pangram Black';
    src: url('/fonts/HMpangram-Black.ttf') format('truetype');
    font-style: normal;
}

:root {
    /* Fonts Override */
    --font-primary: 'HM pangram Medium', 'Fira Sans Georgian', 'Noto Sans Georgian', sans-serif;
    --font-heading: 'HM pangram Bold', 'Fira Sans Georgian', 'Noto Sans Georgian', sans-serif;
    /* Brand Colors (Dark Onyx & Premium Gold based on design sheet) */
    --primary-color: #c69a5c; /* Elegant Bronze/Gold */
    --primary-hover: #d1ab75; /* Lighter Gold */
    --primary-light: #c69a5c; /* Used for active states and shadows */
    --primary-dark: #7c5c2b; /* Darker brown (Topaz-700) */
    --primary-border: #c69a5c;
    /* Success & Status Colors */
    --success-color: #c69a5c; /* Using gold for success to keep it perfectly monochromatic/premium */
    --success-light: rgba(198, 154, 92, 0.1);
    --success-border: #c69a5c;
    --success-highlight: #c69a5c;
    --error-color: #e50b09; /* Deep red from the 'Error' section of the design sheet */
    /* Backgrounds & Surfaces (Deep darks) */
    --background-color: #FFFFFF;
    --surface-card: #1b1d20; /* opal-900 */
    --secondary-color: #41444c; /* Adjusted to match the cool slate palette */
    --button-text-color: #0d0f16; /* Match dark text to new background */
    --text-main: #ffffff;
    --text-muted: #929398; /* Cooler muted text */
    /* Shape & Elevation (Sharp and sophisticated) */
    --border-radius: 12px;
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.6);
    /* Animation */
    --transition-smooth: 0.3s ease-in-out;
    --disabled-bg: rgba(198, 154, 92, 0.1);
    --disabled-bg-solid: color-mix(in srgb, var(--primary-color) 10%, var(--surface-card));
    --disabled-color: #c69a5c;
    --disabled-border: #4b4f5a;
    --section-border: transparent;
    --section-border-fee: rgba(198, 154, 92, 0.12);
    --section-card-bg: #34373d; /* between opal-600 and opal-700 */
}

/* Scoped Overrides for City Mall */

.is-valid {
    border-color: #c69a5c !important;
    background-image: none !important; 
}

.is-valid:focus {
    box-shadow: 0 0 0 0.15rem rgba(198, 154, 92, 0.25) !important;
}

:root {
    --header-subtitle-color: #c69a5c;
    --fee-row-color: #ffffff;
    --fee-total-color: #c69a5c;
    --fee-total-bg-color: rgba(198, 154, 92, 0.1);
    --buy-myself-color: #c69a5c;
    
    --pm-bg-color: transparent;
    --pm-active-bg-color: transparent;
    --pm-border-width: 1px;
    --pm-border-color: rgba(198, 154, 92, 0.2);
    --pm-active-border-color: #c69a5c;
    --pm-hover-bg-color: rgba(255, 255, 255, 0.03);
    --pm-hover-border-color: rgba(198, 154, 92, 0.5);
    --pm-label-color: #ffffff;
    --pm-desc-color: #9ca3af;
    --pm-fee-color: #c69a5c;
    --pm-fee-bg: rgba(198, 154, 92, 0.1);
    
    --valid-shadow-color: rgba(198, 154, 92, 0.25);
    --terms-link-color: #c69a5c;
    
    --lang-bg-color: transparent;
    --lang-text-color: #ffffff;
    --lang-border-color: #4b4f5a; /* Adapted to new surface color */
    --lang-hover-bg: rgba(255, 255, 255, 0.05);
    --lang-hover-color: #ffffff;
    --lang-active-color: #0d0f16;
}