/* ==========================================================================
   Aurixxa brand palette
   --------------------------------------------------------------------------
   Neon Mint      #36ECDE    Deep Aqua   #014751    Core Navy  #00203F
   Soft Gray      #E6E9EC    Graphite    #2F2F2F

   The theme ships an orange accent driven almost entirely by custom properties
   (86 uses of the accent, 37 of its hover partner), so the palette swap is
   mostly a matter of repointing those. This file loads after `main.css` and
   leaves it untouched, so a theme update can be dropped in without re-applying
   anything here.

   Two things the repoint alone does not solve are handled further down: the
   fills that carry white text — legible on the old mid-dark orange, not on a
   bright mint — and the handful of places the theme hard-codes a warm value
   instead of reading the variable.
   ========================================================================== */

:root {
    --ax-brand-mint: #36ECDE;
    --ax-brand-aqua: #014751;
    --ax-brand-navy: #00203F;
    --ax-brand-gray: #E6E9EC;
    --ax-brand-graphite: #2F2F2F;

    /* The theme's own names, repointed. Keeping its variable names rather than
       renaming them across 145 rules means the theme's CSS still reads as the
       vendor wrote it. */
    --tp-theme-px-1: var(--ax-brand-mint);
    --tp-common-px-orange: var(--ax-brand-mint);
    --tp-common-px-orange-dark: var(--ax-brand-aqua);

    /* Used for button and link hovers rather than for errors, so it becomes the
       darker half of the accent pair: mint at rest, aqua on hover. */
    --tp-common-px-red: var(--ax-brand-aqua);

    --tp-common-px-black-2: var(--ax-brand-graphite);
    --tp-grey-px-1: var(--ax-brand-gray);
    --tp-border-px-1: var(--ax-brand-gray);
}

/* --------------------------------------------------------------------------
   Text on an accent fill.

   The theme pairs its accent fills with white text, which held up against
   #FF471D. Neon Mint is a bright colour — white on it lands near 1.9:1, far
   under the 4.5:1 a body-sized label needs — so every fill takes the darkest
   brand colour for its text instead. Core Navy on Neon Mint is about 9:1.

   Icons inside these controls inherit through `currentColor`.
   -------------------------------------------------------------------------- */
.px-btn-black.hover-orange-bg:hover,
.px-btn-grey:hover,
.tp-btn-px,
.postbox__comment-reply a:hover,
.basic-pagination ul li:hover a,
.basic-pagination ul li .current,
.postbox-details-social a:hover,
.tagcloud a:hover,
.in-blog-list-category span:hover,
.in-blog-list-category span.active,
.design-footer-widget-input-icon.hover-bg-orange:hover,
.px-footer-3-btn:hover,
.px-footer-3-social a:hover,
.px-hero-6-category span:hover,
.pf-3-hero-social a:hover,
.ar-testimonial-arrow button:hover,
.tp-team-details-info-social .px-footer-widget-social a:hover,
.tp-team-details-input-btn button,
.px-contact-wrapper .tp-contact-form-btn button,
.px-contact-info-item-btn a:hover,
.tp-contact-me-form-category-list span label input:checked ~ span,
.tp-contact-me-form-category-list span label span:hover,
.tp-contact-me-interest-form-wrap .tp-contact-form-btn button,
.tp-contact-form-btn button,
.tp-contact-us-btn .tp-btn-yellow-green.active {
    color: var(--ax-brand-navy);
}

/* Footer menu and social hovers fill with the accent from `.px-orange-style`;
   the class name is the theme's and is left alone so the markup still matches
   the vendor's. */
.px-orange-style .px-footer-widget-menu ul li a:hover,
.px-orange-style .px-footer-widget-social a:hover {
    color: var(--ax-brand-navy);
}

/* --------------------------------------------------------------------------
   The few places the theme writes a warm value straight into the rule instead
   of reading the variable.
   -------------------------------------------------------------------------- */
.inner-service-1-category-item span::before,
.px-line-shape span,
.bf-btn-circle-dot {
    background-color: var(--ax-brand-mint);
}

.px-funfact-inner-style .ar-funfact-item {
    box-shadow: -1px 0 0 0 var(--ax-brand-aqua);
}

.tp-team-details-input-content input:focus,
.tp-team-details-input-content textarea:focus,
.pixora-dark .tp-team-details-input-content input:focus,
.pixora-dark .tp-team-details-input-content textarea:focus {
    box-shadow: 0 0 0 3px rgba(54, 236, 222, 0.1);
}

/* Selection follows the accent rather than the browser default. */
::selection {
    color: var(--ax-brand-navy);
    background: var(--ax-brand-mint);
}