/* ============================================
   TaxPoint Design System - Base
   Reset, Typography, and Bulma Dark-Mode Overrides
   ============================================ */

*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background-color: var(--color-bg);
    color: var(--color-text);
    line-height: 1.6;
    min-height: 100vh;
}

a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}

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


/* ============================================
   BULMA DARK-MODE OVERRIDES
   Force all Bulma elements into the dark theme.
   These use high-specificity selectors to win.
   ============================================ */

/* --- Global Text --- */
.title,
.subtitle,
h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
div,
li,
td,
th {
    color: var(--color-text);
}

strong,
b {
    color: var(--color-text);
}

/* --- Labels --- */
.label,
label.label,
form label,
.field>label {
    color: var(--color-text-muted) !important;
    font-weight: 600;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* --- Inputs --- */
.input,
.textarea,
.select select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="search"] {
    background-color: var(--color-bg) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
    border-radius: var(--radius-md);
    box-shadow: none !important;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.input::placeholder,
.textarea::placeholder,
input::placeholder {
    color: var(--color-text-dim) !important;
}

.input:focus,
.textarea:focus,
.select select:focus,
input:focus {
    border-color: var(--color-border-focus) !important;
    box-shadow: 0 0 0 3px var(--color-primary-glow) !important;
    outline: none;
}

/* Bulma .is-dark modifier (used in auth templates) */
.input.is-dark,
input.is-dark {
    background-color: var(--color-bg) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

.input.is-dark:focus,
input.is-dark:focus {
    border-color: var(--color-border-focus) !important;
    box-shadow: 0 0 0 3px var(--color-primary-glow) !important;
}

/* --- Buttons --- */
.button.is-link,
.button.is-primary {
    background: linear-gradient(135deg, var(--color-primary), #4f46e5) !important;
    border-color: transparent !important;
    color: #fff !important;
    font-weight: 600;
    transition: all var(--transition-base);
}

.button.is-link:hover,
.button.is-primary:hover {
    background: linear-gradient(135deg, var(--color-primary-hover), #6366f1) !important;
    box-shadow: var(--shadow-glow);
    transform: translateY(-1px);
}

.button.is-link:active,
.button.is-primary:active {
    transform: translateY(0);
}

.button.is-ghost {
    color: var(--color-primary) !important;
    background: transparent !important;
    border: none !important;
    text-decoration: none !important;
}

.button.is-ghost:hover {
    color: var(--color-primary-hover) !important;
    background: rgba(99, 102, 241, 0.08) !important;
}

/* --- Notifications / Alerts --- */
.notification {
    background-color: var(--color-surface) !important;
    border: 1px solid var(--color-border);
    color: var(--color-text) !important;
    border-radius: var(--radius-md);
}

.notification.is-success {
    background: rgba(16, 185, 129, 0.12) !important;
    border-color: rgba(16, 185, 129, 0.3) !important;
    color: var(--color-success) !important;
}

.notification.is-danger {
    background: rgba(239, 68, 68, 0.12) !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
    color: var(--color-error) !important;
}

.notification.is-warning {
    background: rgba(245, 158, 11, 0.12) !important;
    border-color: rgba(245, 158, 11, 0.3) !important;
    color: var(--color-warning) !important;
}

.notification .delete {
    background: rgba(255, 255, 255, 0.15);
}

.notification .delete:hover {
    background: rgba(255, 255, 255, 0.3);
}

/* --- Icons in Inputs --- */
.icon,
.icon.is-small,
.icon.is-left .fas,
.icon.is-left .fa,
span.icon {
    color: var(--color-text-dim) !important;
}

/* --- Control / Field --- */
.field:not(:last-child) {
    margin-bottom: var(--space-lg);
}

/* --- Text helpers --- */
.has-text-grey-light {
    color: var(--color-text-muted) !important;
}

.has-text-white {
    color: var(--color-text) !important;
}

/* --- Bulma columns spacing fix --- */
.columns.is-gapless .column {
    padding: 0;
}

/* --- General Bulma backgrounds --- */
.has-background-black-bis {
    background-color: var(--color-bg) !important;
}

.box {
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    color: var(--color-text);
}

/* --- Select dropdown --- */
.select:not(.is-multiple):not(.is-loading)::after {
    border-color: var(--color-primary);
}

/* --- HR --- */
hr {
    background-color: var(--color-border);
}