/**
 * AIServices brand — blue primary + blue secondary (Repio / WowDash).
 * Primary: #487FFF | Secondary: #458EFF | Repio accent: #0162e8
 */
:root {
    --ais-primary: #487fff;
    --ais-primary-rgb: 72, 127, 255;
    --ais-primary-hover: #3d6fe6;
    --ais-primary-dark: #486cea;

    --ais-secondary: #458eff;
    --ais-secondary-rgb: 69, 142, 255;
    --ais-secondary-hover: #3b82f6;
    --ais-secondary-dark: #3d6fe6;

    --ais-text-on-primary: #ffffff;
    --ais-text-on-secondary: #ffffff;
    --ais-text-body: #111111;
    --ais-text-muted: #4b5563;
    --ais-text-on-dark: #ffffff;

    --main-color-one: var(--ais-primary);
    --main-color-one-rgb: var(--ais-primary-rgb);
    --main-color-two: var(--ais-secondary);
    --main-color-two-rgb: var(--ais-secondary-rgb);

    --aiservices-hero-cta-yellow: var(--ais-secondary);
    --aiservices-hero-cta-yellow-hover: var(--ais-secondary-hover);

    --primary-color: var(--ais-primary);
    --ud-accent: var(--ais-primary);
    --cg-accent: var(--ais-primary);
    --user-panel-primary: var(--ais-primary);

    /* WowDash / admin — blue primary scale (matches assets/backend/wowdash/css/style.css) */
    --primary-50: #e4f1ff;
    --primary-100: #bfdcff;
    --primary-200: #95c7ff;
    --primary-300: #6bb1ff;
    --primary-400: #519fff;
    --primary-500: #458eff;
    --primary-600: #487fff;
    --primary-700: #486cea;
    --primary-800: #4759d6;
    --primary-900: #4536b6;
    --brand: var(--primary-600);

    /* Live chat widget — Repio brand blue */
    --livechat-accent: #0162e8;
    --livechat-accent-rgb: 1, 98, 232;
    --livechat-accent-hover: #0154c7;
}

/*
 * Repio public theme — keep main-eight blue (hue 213) aligned with repio main.css.
 */
body.repio-theme-active {
    --main-eight-h: 213;
    --main-eight-s: 99%;
    --main-eight-l: 44%;
    --main-color-one: var(--ais-primary);
    --main-color-one-rgb: var(--ais-primary-rgb);
    --main-color-two: var(--ais-secondary);
    --main-color-two-rgb: var(--ais-secondary-rgb);
    --main-color-three: var(--ais-primary-hover);
}

/* Buyer / seller WowDash panels — blue accent, same Repio scale */
body.repio-theme-active.aiservices-wowdash-user {
    --main-eight-h: 213;
    --main-eight-s: 99%;
    --main-eight-l: 44%;
    --ud-accent: var(--ais-primary);
}

/*
 * WowDash backend (admin + buyer/seller) — map template brand slots to AIServices tokens.
 * Primary + secondary -> blue scale
 */
body.aiservices-wowdash-admin,
body.aiservices-wowdash-user {
    --ais-primary: #487fff;
    --ais-primary-rgb: 72, 127, 255;
    --ais-primary-hover: #3d6fe6;
    --ais-primary-dark: #486cea;

    --ais-secondary: #458eff;
    --ais-secondary-rgb: 69, 142, 255;
    --ais-secondary-hover: #3b82f6;
    --ais-secondary-dark: #3d6fe6;

    --primary-50: #e4f1ff;
    --primary-100: #bfdcff;
    --primary-200: #95c7ff;
    --primary-300: #6bb1ff;
    --primary-400: #519fff;
    --primary-500: #458eff;
    --primary-600: #487fff;
    --primary-700: #486cea;
    --primary-800: #4759d6;
    --primary-900: #4536b6;
    --brand: var(--primary-600);

    --ud-accent: var(--ais-primary);
    --user-panel-primary: var(--ais-primary);
    --cg-accent: var(--ais-primary);
    --primary-color: var(--ais-primary);

    /* Template --yellow slot -> primary blue */
    --yellow: var(--ais-primary);
    --yellow-light: rgba(var(--ais-primary-rgb, 72, 127, 255), 0.15);
    --yellow-light-white: rgba(var(--ais-primary-rgb, 72, 127, 255), 0.25);

    /* Template --warning-main slot -> secondary blue */
    --warning-main: var(--ais-secondary);
    --warning-surface: rgba(var(--ais-secondary-rgb, 69, 142, 255), 0.15);
    --warning-border: rgba(var(--ais-secondary-rgb, 69, 142, 255), 0.4);
    --warning-hover: var(--ais-secondary-hover, #3b82f6);
    --warning-pressed: var(--ais-secondary-dark, #3d6fe6);
    --warning-focus: rgba(var(--ais-secondary-rgb, 69, 142, 255), 0.1490196078);
}

/* Primary surfaces: white text */
.btn-primary,
.cmn-btn.btn-bg-1,
.bg-main,
body.aiservices-wowdash-admin .btn-primary,
body.aiservices-wowdash-admin .bg-primary-600,
body.aiservices-wowdash-user .btn-primary {
    color: var(--ais-text-on-primary);
}

.open-button:not(.live-chat-button-class-for-style) {
    background-color: var(--livechat-accent);
    color: var(--ais-text-on-primary);
}

.open-button:not(.live-chat-button-class-for-style):hover {
    background-color: var(--livechat-accent-hover);
    color: var(--ais-text-on-primary);
}

/* Secondary blue surfaces: white text */
.aiservices-hero__btn--accent,
.btn-ais-secondary,
body.aiservices-wowdash-admin .btn-warning,
body.aiservices-wowdash-user .btn-warning {
    color: var(--ais-text-on-secondary);
}

.aiservices-hero__btn:not(.aiservices-hero__btn--accent) {
    color: var(--ais-text-on-primary);
}

/* Service listing cards (homepage sections, featured, popular) — black text for readability */
.new_services_area .new_service__single__price__title,
.new_services_area .new_service__single__price__starting,
.new_services_area .new_service__single__contents__title,
.new_services_area .new_service__single__contents__title a,
.new_services_area .new_service__single__contents__para,
.new_services_area .new_jobs__single__contents__location,
.new_services_area .single_authors__title,
.new_services_area .author_tag__review__para {
    color: #111111 !important;
}

.new_services_area .new_service__single__contents__title a:hover {
    color: #111111 !important;
}

.new_services_area .new_service__single__price__title s {
    color: #4b5563 !important;
}

/* Live chat popup — header, actions, and accents use brand blue */
.chat-wrapper-area .public-chat-flex::before,
.chat-wrapper-area .public-chat-flex {
    background: var(--livechat-accent);
}

.chat-wrapper-area .public-chat-flex {
    background-color: unset;
}

.chat-wrapper-area .public-chat-btn .btn-icon {
    background-color: var(--livechat-accent);
    color: var(--ais-text-on-primary);
}

.chat-wrapper-area .panel-title {
    color: var(--ais-text-on-primary);
}

.chat-wrapper-area .login_to_chat {
    border-color: var(--livechat-accent);
    color: var(--livechat-accent);
}

.chat-wrapper-area .login_to_chat:hover {
    background-color: var(--livechat-accent);
    color: var(--ais-text-on-primary);
}

.chat-wrapper-area .footer-panel-input-flex .input-group .btn-chat {
    background: var(--livechat-accent);
    border-color: var(--livechat-accent);
}

.chat-wrapper-area .panel-body.chat-area,
.chat-wrapper-area .chat-wrapper-conversation {
    scrollbar-color: var(--livechat-accent) #fff;
}

.chat-wrapper-area .panel-body.chat-area::-webkit-scrollbar-thumb,
.chat-wrapper-area .chat-wrapper-conversation::-webkit-scrollbar-thumb {
    background: var(--livechat-accent);
}

.chat-wrapper-area .base_sent p {
    background-color: rgba(var(--livechat-accent-rgb), 0.12);
}

.chat-wrapper-area .chat_button_group button {
    background: rgba(var(--livechat-accent-rgb), 0.12) !important;
}