:root {
    /* Single source of truth for component colours */
    --ui-accent: #3d5adb;
    --ui-accent-dark: #2d44b8;
    --ui-accent-soft: #eef1fc;
    --ui-text: #2c2c2c;
    --ui-text-muted: #888888;
    --ui-border: #e8e4dc;
    --ui-border-soft: #f0eee8;
    --ui-bg: #ffffff;
    --ui-bg-soft: #faf9f6;
    --ui-success: #16a34a;
    --ui-success-bg: #d1fae5;
    --ui-warn: #d97706;
    --ui-warn-bg: #fef3c7;
    --ui-danger: #c0392b;
    --ui-danger-bg: #fee2e2;
    --ui-radius: 6px;
    --ui-radius-sm: 4px;
}

.btn,
.adm-add-btn,
.db-btn,
.profile-btn,
.profile-btn--primary,
.gv-submit,
.gvc-pay,
.gvs-btn,
.rev-filter__submit,
input[type="submit"]:not([class*="--"]):not(.adm-filter__submit),
button[type="submit"]:not([class*="--"]):not(.adm-filter__submit) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    padding: 10px 22px !important;
    background: var(--ui-accent) !important;
    color: #fff !important;
    border: none !important;
    border-radius: var(--ui-radius) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: background 0.15s !important;
    font-family: inherit !important;
    line-height: 1.2 !important;
    text-align: center !important;
}

.btn:hover,
.adm-add-btn:hover,
.db-btn:hover,
.profile-btn:hover,
.profile-btn--primary:hover,
.gv-submit:hover,
.gvc-pay:hover,
.gvs-btn:hover,
.rev-filter__submit:hover {
    background: var(--ui-accent-dark) !important;
    color: #fff !important;
    text-decoration: none !important;
}

.btn--ghost,
.db-btn--ghost,
.profile-btn--ghost,
.gvs-btn--ghost {
    background: transparent !important;
    color: var(--ui-text) !important;
    border: 1px solid var(--ui-border) !important;
}

.btn--ghost:hover,
.db-btn--ghost:hover,
.profile-btn--ghost:hover,
.gvs-btn--ghost:hover {
    background: var(--ui-bg-soft) !important;
    color: var(--ui-text) !important;
}

/* Danger variants */
.btn--danger {
    background: var(--ui-danger) !important;
    color: #fff !important;
}

.btn--danger:hover {
    background: #9d1c14 !important;
}

/* Disabled state */
.btn:disabled,
.adm-add-btn:disabled,
.db-btn:disabled,
.gv-submit:disabled,
.gvc-pay:disabled {
    opacity: 0.55 !important;
    cursor: not-allowed !important;
}

/* ============================================================
   FORM INPUTS  —  unify across all dashboards / public pages
   ============================================================ */
.form-input,
.gv-input,
.gv-custom-amount,
.gv-textarea,
.db-form-input,
input[type="text"]:not(.adm-filter input):not(#search):not(.cake-form-control),
input[type="email"]:not(.adm-filter input),
input[type="password"]:not(.adm-filter input),
input[type="number"]:not(.adm-filter input):not(.gv-custom-amount),
input[type="date"]:not(.adm-filter input),
input[type="tel"]:not(.adm-filter input),
input[type="url"]:not(.adm-filter input),
select:not(.adm-filter select),
textarea:not(.adm-filter textarea) {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-sm);
    font-size: 14px;
    font-family: inherit;
    color: var(--ui-text);
    background: var(--ui-bg);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.form-input:focus,
.gv-input:focus,
.gv-custom-amount:focus,
.gv-textarea:focus,
.db-form-input:focus,
input[type="text"]:not(.adm-filter input):not(#search):not(.cake-form-control):focus,
input[type="email"]:not(.adm-filter input):focus,
input[type="password"]:not(.adm-filter input):focus,
input[type="number"]:not(.adm-filter input):not(.gv-custom-amount):focus,
input[type="date"]:not(.adm-filter input):focus,
input[type="tel"]:not(.adm-filter input):focus,
input[type="url"]:not(.adm-filter input):focus,
select:not(.adm-filter select):focus,
textarea:not(.adm-filter textarea):focus {
    border-color: var(--ui-accent);
    box-shadow: 0 0 0 2px rgba(61, 90, 219, 0.12);
}

/* Form labels — consistent style across the site */
.form-label,
.db-form-label,
.gv-label {
    display: block;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ui-text-muted);
    margin-bottom: 6px;
}

/* ============================================================
   BADGES  —  unified status badges
   ============================================================ */
.badge,
.db-badge,
.adm-badge {
    display: inline-block;
    padding: 3px 9px;
    border-radius: var(--ui-radius-sm);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.badge--green,
.adm-badge--green,
.db-badge--scheduled,
.db-badge--success {
    background: var(--ui-success-bg);
    color: #065F46;
}

.badge--amber,
.adm-badge--amber,
.db-badge--pending,
.db-badge--warn {
    background: var(--ui-warn-bg);
    color: #92400e;
}

.badge--red,
.adm-badge--red,
.db-badge--cancelled,
.db-badge--danger {
    background: var(--ui-danger-bg);
    color: #991B1B;
}

.badge--blue,
.adm-badge--indigo,
.adm-badge--blue {
    background: var(--ui-accent-soft);
    color: var(--ui-accent-dark);
}

.badge--grey,
.adm-badge--grey,
.db-badge--neutral {
    background: #f1efe8;
    color: #555;
}

/* ============================================================
   TYPOGRAPHY  —  align serif headings consistently
   ============================================================ */
:root {
    --ui-font-serif: 'Cormorant Garamond', Georgia, serif;
    --ui-font-sans: 'Helvetica Neue', Arial, sans-serif;
}

/* Apply our font defaults wherever a page hasn't set its own */
body {
    font-family: var(--ui-font-sans);
    color: var(--ui-text);
}

/* Restore consistent button/input fonts in case a layout overrides body */
button,
input,
select,
textarea {
    font-family: inherit;
}
