:root {
    /* Primary Colors */
    --main-color: #7C3AED;  /* Primary Purple */
    --color-two: #6D28D9;   /* Darker Purple */
    --color-three: #8B5CF6;  /* Lighter Purple */

    /* Secondary Colors */
    --color-thirtytwo: #7C3AED;  /* Secondary Purple */
    --color-thirtythree: #5B21B6;  /* Dark Purple */

    /* Accent Colors */
    --color-seven: #EC4899;  /* Pink */
    --color-nine: #F472B6;   /* Light Pink */

    /* Background Colors */
    --color-five: #f8fafc;  /* Light Gray Background */
    --color-fifteen: #f1f5f9;  /* Secondary Background */
    --color-twenty: #f8fafc;  /* Tertiary Background */
    --color-thirtynine: #f1f5f9;  /* Quaternary Background */

    /* Text Colors */
    --color-thirtyfour: #1e293b;  /* Primary Text */
    --color-thirtyseven: #475569;  /* Secondary Text */
    --color-fourty: #64748b;  /* Tertiary Text */
    --color-six: #94a3b8;  /* Light Text */

    /* Border Colors */
    --color-eighteen: #e2e8f0;  /* Border Color */
    --color-fourtyone: #cbd5e1;  /* Secondary Border */

    /* Gradient Colors */
    --gradient-primary: linear-gradient(to right, var(--color-two) 0%, var(--color-seven) 100%);
    --gradient-secondary: linear-gradient(to right, var(--color-thirtythree) 0%, var(--color-thirtytwo) 100%);

    /* Button Colors */
    --color-twentyfour: #7C3AED;  /* Primary Button */
    --color-fourteen: #6D28D9;  /* Secondary Button */

    /* Success Colors */
    --color-fiftyone: #22c55e;  /* Success */

    /* Warning Colors */
    --color-fourtyeight: #eab308;  /* Warning */

    /* Error Colors */
    --color-fiftysix: #ef4444;  /* Error */
}

/* Header/Navbar Styles */
.main-header {
    background: #ffffff !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.main-header .navigation > li > a {
    color: var(--color-thirtyfour) !important;
}

.main-header .navigation > li:hover > a {
    color: var(--main-color) !important;
}

.main-header .button-box .btn-style-four {
    background: var(--gradient-primary);
    color: #ffffff;
}

.main-header .social-box li a {
    color: var(--color-thirtyfour);
}

.main-header .social-box li a:hover {
    color: var(--main-color);
}

/* Override specific component colors */
.btn-style-four {
    background: var(--gradient-primary);
}

.feature-block_one-inner:hover .color-layer {
    background: var(--gradient-primary);
}

.service-block_three-inner:hover {
    background: var(--gradient-secondary);
}

.price-block .inner-box .price {
    background: var(--gradient-primary);
}

.testimonial-block .author-box .author-image {
    background: var(--gradient-secondary);
}

.cta-one {
    background-color: var(--color-twentyfour);
}

.counter-two_inner-container {
    background: var(--gradient-primary);
}

/* Button Styles */
.theme-btn {
    background: var(--gradient-primary);
    border: none;
}

.theme-btn:hover {
    opacity: 0.9;
    transform: translateY(-2px);
}

/* Feature Block Styles */
.feature-block_one-inner {
    border: 1px solid var(--color-eighteen);
}

.feature-block_one-inner:hover {
    transform: translateY(-5px);
    border-color: var(--main-color);
}

/* Service Block Styles */
.service-block_three-inner {
    border: 1px solid var(--color-eighteen);
}

.service-block_three-inner:hover {
    transform: translateY(-5px);
}

/* Pricing Block Styles */
.price-block .inner-box {
    border: 1px solid var(--color-eighteen);
    transition: all 0.3s ease;
}

.price-block .inner-box:hover {
    transform: translateY(-5px);
    border-color: var(--main-color);
}

/* Add smooth transitions */
.main-header,
.btn-style-four,
.feature-block_one-inner,
.service-block_three-inner,
.price-block .inner-box,
.testimonial-block,
.theme-btn {
    transition: all 0.3s ease;
}

/* Hover Effects */
.btn-style-four:hover,
.theme-btn:hover {
    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.15);
}

/* Active States */
.navigation > li.current > a {
    color: var(--main-color) !important;
}

/* Mobile Menu */
.mobile-menu {
    background: #ffffff;
}

.mobile-menu .navigation li > a {
    color: var(--color-thirtyfour);
}

.mobile-menu .navigation li:hover > a {
    color: var(--main-color);
}

/* Sticky Header */
.sticky-header {
    background: #ffffff;
}

/* Text Colors */
.text-primary {
    color: var(--main-color) !important;
}

.text-secondary {
    color: var(--color-thirtyseven) !important;
}

.text-light {
    color: var(--color-six) !important;
}

/* Links */
a {
    color: var(--main-color);
    transition: color 0.3s ease;
}

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

/* Headings */
h1, h2, h3, h4, h5, h6 {
    color: var(--color-thirtyfour);
}

/* Buttons */
.btn {
    background: var(--gradient-primary);
    color: #ffffff;
    transition: all 0.3s ease;
}

.btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.15);
}

/* Borders */
.border {
    border-color: var(--color-eighteen) !important;
}

/* Backgrounds */
.bg-primary {
    background: var(--gradient-primary) !important;
}

.bg-secondary {
    background: var(--gradient-secondary) !important;
}

.bg-light {
    background-color: var(--color-five) !important;
}

/* Forms */
input, textarea, select {
    border-color: var(--color-eighteen);
}

input:focus, textarea:focus, select:focus {
    border-color: var(--main-color);
}

/* Alerts */
.alert-success {
    background-color: var(--color-fiftyone);
}

.alert-warning {
    background-color: var(--color-fourtyeight);
}

.alert-error {
    background-color: var(--color-fiftysix);
}

/* Cards */
.card {
    border-color: var(--color-eighteen);
    transition: all 0.3s ease;
}

.card:hover {
    transform: translateY(-5px);
    border-color: var(--main-color);
    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.15);
}

/* Navigation */
.nav-link {
    color: var(--color-thirtyfour);
}

.nav-link:hover, .nav-link.active {
    color: var(--main-color);
}

/* Badges */
.badge-primary {
    background: var(--gradient-primary);
}

.badge-secondary {
    background: var(--gradient-secondary);
}

/* Progress Bars */
.progress-bar {
    background: var(--gradient-primary);
}

/* Tooltips */
.tooltip {
    background: var(--color-thirtyfour);
}

/* Modals */
.modal-header {
    background: var(--gradient-primary);
    color: #ffffff;
}

/* Tables */
.table {
    border-color: var(--color-eighteen);
}

.table thead th {
    background: var(--color-five);
    color: var(--color-thirtyfour);
}

/* Pagination */
.pagination .page-link {
    color: var(--main-color);
    border-color: var(--color-eighteen);
}

.pagination .page-link:hover,
.pagination .page-item.active .page-link {
    background: var(--gradient-primary);
    border-color: var(--main-color);
    color: #ffffff;
}

/* Breadcrumbs */
.breadcrumb {
    background: var(--color-five);
}

.breadcrumb-item.active {
    color: var(--color-thirtyfour);
}

/* Lists */
.list-group-item {
    border-color: var(--color-eighteen);
}

.list-group-item.active {
    background: var(--gradient-primary);
    border-color: var(--main-color);
}

/* Spinners */
.spinner-border {
    border-color: var(--main-color);
    border-right-color: transparent;
}

/* Dropdowns */
.dropdown-menu {
    border-color: var(--color-eighteen);
}

.dropdown-item:hover {
    background: var(--color-five);
    color: var(--main-color);
}

/* Tabs */
.nav-tabs {
    border-color: var(--color-eighteen);
}

.nav-tabs .nav-link.active {
    border-color: var(--color-eighteen) var(--color-eighteen) #fff;
    color: var(--main-color);
}

/* Accordions */
.accordion-button:not(.collapsed) {
    background: var(--gradient-primary);
    color: #ffffff;
}

/* Footer */
.footer {
    background: var(--color-thirtyfour);
    color: #ffffff;
}

.footer a {
    color: var(--color-six);
}

.footer a:hover {
    color: var(--main-color);
}

/* Social Icons */
.social-icons a {
    color: var(--color-thirtyfour);
    transition: all 0.3s ease;
}

.social-icons a:hover {
    color: var(--main-color);
    transform: translateY(-2px);
}

/* Utility Classes */
.shadow {
    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.15) !important;
}

.rounded {
    border-radius: 0.5rem !important;
}

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

/* Animations */
@keyframes pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}

.pulse {
    animation: pulse 2s infinite;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .main-header {
        padding: 10px 0;
    }

    .nav-link {
        padding: 10px 15px;
    }

    .btn {
        padding: 8px 16px;
    }
}

/* Print Styles */
@media print {
    .main-header,
    .footer {
        background: none !important;
        color: var(--color-thirtyfour) !important;
    }

    a {
        color: var(--color-thirtyfour) !important;
    }

    .btn {
        border: 1px solid var(--color-thirtyfour) !important;
        background: none !important;
        color: var(--color-thirtyfour) !important;
    }
}
