/* ========================================
   VISTAWIN SOLUTION ? Brand Theme
   Palette from official logo
   ======================================== */

:root {
    /* Logo colors */
    --brand-primary: #4B2C62;
    --brand-primary-dark: #3A224D;
    --brand-primary-mid: #6B4580;
    --brand-lavender: #C4A7D1;
    --brand-lavender-soft: #EDE4F3;
    --brand-surface: #F7F3FA;
    --brand-white: #FFFFFF;
    --brand-ink: #2A1A38;

    /* Map legacy tokens ? brand */
    --primary: #4B2C62;
    --primary-dark: #3A224D;
    --primary-light: #C4A7D1;
    --accent: #C4A7D1;
    --secondary: #F7F3FA;
    --dark: #2A1A38;
    --light: #FFFFFF;

    --header-primary: #4B2C62;
    --header-secondary: #6B4580;
    --header-accent: #C4A7D1;
    --header-dark: #2A1A38;
    --header-light: #FFFFFF;

    --color-purple: #4B2C62;
    --color-pink: #6B4580;
    --color-blue: #5A3A72;
    --color-cyan: #C4A7D1;
    --color-green: #6B4580;
    --color-yellow: #C4A7D1;
    --color-orange: #6B4580;
    --color-red: #4B2C62;

    --gradient-brand: linear-gradient(135deg, #4B2C62 0%, #6B4580 100%);
    --gradient-brand-soft: linear-gradient(135deg, #FCFBFD 0%, #F6F2F9 100%);
    --gradient-brand-deep: linear-gradient(145deg, #F6F2F9 0%, #EFE7F5 100%);
    --gradient-purple: linear-gradient(135deg, #4B2C62 0%, #6B4580 100%);
    --gradient-blue: linear-gradient(135deg, #4B2C62 0%, #6B4580 100%);
    --gradient-green: linear-gradient(135deg, #6B4580 0%, #C4A7D1 100%);
    --gradient-orange: linear-gradient(135deg, #4B2C62 0%, #6B4580 100%);
    --gradient-rainbow: linear-gradient(90deg, #F6F2F9 0%, #EFE7F5 50%, #F6F2F9 100%);
}

/* ========== GLOBAL ========== */
body {
    color: var(--brand-ink);
    background: var(--brand-white);
}

::selection {
    background: var(--brand-lavender);
    color: var(--brand-primary-dark);
}

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

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

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

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

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

/* ========== BUTTONS ========== */
.btn-primary,
.btn-nav,
a.btn-primary {
    background: var(--gradient-brand) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 8px 24px rgba(75, 44, 98, 0.28);
}

.btn-primary:hover,
.btn-nav:hover,
a.btn-primary:hover {
    background: linear-gradient(135deg, #3A224D 0%, #4B2C62 100%) !important;
    color: #fff !important;
    box-shadow: 0 10px 28px rgba(75, 44, 98, 0.35);
}

.btn-outline-primary {
    color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    background: transparent !important;
}

.btn-outline-primary:hover {
    background: var(--brand-primary) !important;
    color: #fff !important;
}

/* ========== HERO ========== */
.hero-carousel-wrapper::before,
.hero-slide::before {
    background: linear-gradient(
        120deg,
        rgba(42, 26, 56, 0.82) 0%,
        rgba(75, 44, 98, 0.55) 50%,
        rgba(107, 69, 128, 0.35) 100%
    ) !important;
}

.hero-badge,
.carousel-badge,
.badge-modern {
    background: rgba(196, 167, 209, 0.2) !important;
    border: 1px solid rgba(196, 167, 209, 0.45) !important;
    color: #fff !important;
    backdrop-filter: blur(8px);
}

.owl-carousel .owl-dot.active span,
.carousel-indicators .active {
    background: var(--brand-lavender) !important;
}

/* ========== FEATURES ========== */
.features-section-ultra,
.features-section {
    background: var(--gradient-brand-soft) !important;
}

.feature-card-ultra,
.feature-card {
    border-color: rgba(75, 44, 98, 0.08) !important;
}

.feature-card-ultra:hover,
.feature-card:hover {
    border-color: var(--brand-lavender) !important;
    box-shadow: 0 16px 40px rgba(75, 44, 98, 0.12) !important;
}

.feature-icon-ultra,
.feature-icon,
.icon-box {
    background: var(--gradient-brand) !important;
    color: #fff !important;
    box-shadow: 0 10px 24px rgba(75, 44, 98, 0.25) !important;
}

.section-title span,
.section-badge,
.badge-title {
    color: var(--brand-primary-mid) !important;
    background: var(--brand-lavender-soft) !important;
}

.section-title h2,
.section-heading {
    color: var(--brand-primary) !important;
}

.counter,
.stat-number {
    color: var(--brand-primary) !important;
}

/* ========== ABOUT ========== */
.about-section-ultra-v2,
.about-section-ultra,
.about-section {
    background: #fff !important;
}

.about-image-wrapper::after,
.about-accent,
.image-badge {
    background: var(--gradient-brand) !important;
}

.about-feature-item i,
.check-icon {
    color: var(--brand-primary) !important;
    background: var(--brand-lavender-soft) !important;
}

/* ========== SERVICES ========== */
.services-section {
    background: var(--brand-surface) !important;
}

.service-card,
.services-card {
    border: 1px solid rgba(75, 44, 98, 0.08) !important;
    background: #fff !important;
}

.service-card:hover,
.services-card:hover {
    border-color: var(--brand-lavender) !important;
    box-shadow: 0 18px 40px rgba(75, 44, 98, 0.14) !important;
}

.service-icon,
.service-card .icon {
    background: var(--gradient-brand) !important;
    color: #fff !important;
}

.service-card h4,
.service-card h5 {
    color: var(--brand-primary) !important;
}

/* Card accents: keep variety but within brand family */
.service-card:nth-child(1) .service-icon,
.service-card:nth-child(4n+1) .icon {
    background: linear-gradient(135deg, #4B2C62, #6B4580) !important;
}
.service-card:nth-child(2) .service-icon,
.service-card:nth-child(4n+2) .icon {
    background: linear-gradient(135deg, #6B4580, #C4A7D1) !important;
}
.service-card:nth-child(3) .service-icon,
.service-card:nth-child(4n+3) .icon {
    background: linear-gradient(135deg, #3A224D, #4B2C62) !important;
}
.service-card:nth-child(4) .service-icon,
.service-card:nth-child(4n+4) .icon {
    background: linear-gradient(135deg, #4B2C62, #C4A7D1) !important;
}

/* ========== CLIENTS ========== */
.clients-section,
.clients-ultra {
    background: var(--brand-surface) !important;
}

.client-card:hover {
    box-shadow: 0 16px 36px rgba(75, 44, 98, 0.12) !important;
    border-color: var(--brand-lavender) !important;
}

/* ========== FORMS / CONTACT ========== */
.form-control:focus,
input:focus,
textarea:focus,
select:focus {
    border-color: var(--brand-lavender) !important;
    box-shadow: 0 0 0 0.2rem rgba(196, 167, 209, 0.35) !important;
}

/* ========== NAV ACTIVE STATES ========== */
.nav-link.active,
.nav-link:hover {
    color: var(--brand-primary) !important;
}

.nav-link.active::after,
.nav-link::after {
    background: var(--gradient-brand) !important;
}

.hamburger span {
    background: var(--brand-primary) !important;
}

/* ========== FOOTER ========== */
footer.container-fluid,
.footer {
    background: linear-gradient(145deg, var(--brand-primary) 0%, var(--brand-primary-dark) 100%) !important;
    border-color: rgba(196, 167, 209, 0.18) !important;
    color: var(--brand-white) !important;
}

footer h6,
footer .text-white {
    color: var(--brand-white) !important;
}

footer p,
footer .small,
footer a {
    color: var(--brand-lavender-soft) !important;
}

footer .text-primary,
footer i.text-primary,
footer i {
    color: var(--brand-lavender) !important;
}

footer .border-top {
    border-color: rgba(196, 167, 209, 0.22) !important;
}

.back-to-top,
.btn.back-to-top {
    background: var(--gradient-brand) !important;
    border: none !important;
    box-shadow: 0 8px 22px rgba(75, 44, 98, 0.45) !important;
}

/* ========== COLORFUL THEME OVERRIDES ========== */
.gradient-text,
.hero-title span,
.colored-text {
    background: var(--gradient-brand) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
}

[class*="bg-gradient-"],
.bg-gradient-purple,
.bg-gradient-blue,
.bg-gradient-green,
.bg-gradient-orange,
.bg-gradient-rainbow {
    background: var(--gradient-brand) !important;
}

/* Soft surfaces instead of rainbow washes */
.bg-soft-purple,
.bg-soft-blue,
.bg-soft-green,
.bg-soft-pink {
    background: var(--brand-lavender-soft) !important;
}

/* ========== MISC HARDCODED GRADIENT SWEEPS ========== */
.page-header,
.internal-hero,
.breadcrumb-section {
    background: #F6F2F9 !important;
}

.progress-bar {
    background: var(--gradient-brand) !important;
}

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

/* Soft slant motif hint (logo // bars) */
.brand-slash::before {
    content: '';
    display: inline-block;
    width: 10px;
    height: 28px;
    margin-right: 10px;
    background:
        linear-gradient(115deg, transparent 35%, var(--brand-lavender) 35% 48%, transparent 48%),
        linear-gradient(115deg, transparent 52%, var(--brand-primary) 52% 68%, transparent 68%);
    vertical-align: middle;
}

/* ========== COMPLETE APP SURFACE ? AUTH / GALLERY / ADMIN ========== */

.auth-page {
    background:
        radial-gradient(ellipse 70% 50% at 0% 0%, rgba(196, 167, 209, 0.45), transparent 55%),
        radial-gradient(ellipse 50% 40% at 100% 100%, rgba(75, 44, 98, 0.1), transparent 50%),
        #F7F3FA !important;
    min-height: calc(100vh - 180px);
    padding: 80px 0 !important;
}

.auth-card {
    border: none !important;
    border-radius: 20px !important;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(75, 44, 98, 0.14) !important;
}

.auth-card .card-header {
    background: #ffffff !important;
    border: none !important;
    border-bottom: 1px solid rgba(75, 44, 98, 0.08) !important;
    padding: 32px 28px !important;
}

.auth-card .card-body {
    padding: 32px 28px !important;
    background: #fff;
}

.auth-card .form-control {
    border-radius: 12px;
    border-color: rgba(75, 44, 98, 0.15);
    padding: 12px 14px;
}

.auth-card .form-control:focus {
    border-color: #C4A7D1 !important;
    box-shadow: 0 0 0 0.2rem rgba(196, 167, 209, 0.4) !important;
}

.auth-card .input-group-text {
    border-radius: 12px 0 0 12px;
    border-color: rgba(75, 44, 98, 0.15);
    background: #F7F3FA !important;
    color: #4B2C62 !important;
}

.auth-card .btn-primary {
    border-radius: 12px;
    padding: 12px 20px;
    font-weight: 700;
}

/* Page headers ? light */
.page-header {
    background: #F6F2F9 !important;
    padding: 64px 0 48px !important;
    position: relative;
    overflow: hidden;
}

.page-header::after {
    display: none;
}

.page-header h1,
.page-header h3 {
    font-weight: 800 !important;
    letter-spacing: 0.5px;
    color: #2F2438 !important;
}

/* Gallery */
.gallery-section {
    background: #F7F3FA !important;
    padding: 80px 0 !important;
}

.gallery-item {
    border-radius: 16px !important;
    overflow: hidden;
    border: 1px solid rgba(75, 44, 98, 0.08);
    box-shadow: 0 10px 28px rgba(42, 26, 56, 0.08);
}

.gallery-caption {
    background: linear-gradient(transparent, rgba(42, 26, 56, 0.85)) !important;
}

/* Contact */
.contact-info-wrapper {
    background: #fff !important;
    border-radius: 20px !important;
    border: 1px solid rgba(75, 44, 98, 0.08);
    box-shadow: 0 14px 36px rgba(75, 44, 98, 0.08);
}

.contact-info-icon {
    background: linear-gradient(135deg, #4B2C62, #6B4580) !important;
    color: #fff !important;
}

.contact-form {
    background: #fff;
    border-radius: 20px;
    padding: 32px;
    border: 1px solid rgba(75, 44, 98, 0.08);
    box-shadow: 0 14px 36px rgba(75, 44, 98, 0.08);
}

/* Dashboard cards polish */
.dashboard-card {
    border-radius: 18px !important;
    border: 1px solid rgba(75, 44, 98, 0.08) !important;
    box-shadow: 0 12px 32px rgba(75, 44, 98, 0.08) !important;
}

.dashboard-card:hover {
    border-color: #C4A7D1 !important;
}

/* Admin / table chrome */
.table thead th,
.table thead {
    background: #F6F2F9 !important;
    color: #4B2C62 !important;
    border: none !important;
    border-bottom: 1px solid rgba(75, 44, 98, 0.1) !important;
}

.badge-success,
.badge-info,
.badge-primary,
.badge-warning {
    background: #4B2C62 !important;
}

.badge-warning {
    background: #6B4580 !important;
}

.card {
    border-color: rgba(75, 44, 98, 0.08);
}

.card-header {
    border-color: rgba(75, 44, 98, 0.08);
}

/* Clients light-theme card text safety */
.clients-section-ultra .stat-card,
.clients-section-ultra .filter-btn,
.clients-section-ultra .client-card-ultra {
    color: #2A1A38;
}

.clients-section-ultra .filter-btn {
    background: #fff !important;
    border: 1px solid rgba(75, 44, 98, 0.12) !important;
    color: #4B2C62 !important;
}

.clients-section-ultra .filter-btn.active,
.clients-section-ultra .filter-btn:hover {
    background: linear-gradient(135deg, #4B2C62, #6B4580) !important;
    color: #fff !important;
    border-color: transparent !important;
}

/* Floating shapes brand tint */
.floating-shape {
    background: rgba(196, 167, 209, 0.25) !important;
}

/* Hero buttons */
.hero-buttons .btn-primary {
    background: linear-gradient(135deg, #4B2C62, #6B4580) !important;
    border: none !important;
}

.hero-buttons .btn-outline-light:hover {
    background: #C4A7D1 !important;
    color: #2A1A38 !important;
    border-color: #C4A7D1 !important;
}

/* Features / about soft wash */
.features-section-ultra {
    background:
        radial-gradient(ellipse 60% 40% at 100% 0%, rgba(196, 167, 209, 0.35), transparent 55%),
        #fff !important;
}

.about-section-ultra-v2 {
    background: #fff !important;
}