/* TajerPay Brand Colors Override */

/* 
 * TajerPay Brand Colors:
 * Primary Teal: #277d8b
 * Primary Gold: #FFC043
 * Dark Charcoal: #2C3A3C
 */

/* ============================================
   GLOBAL COLOR REPLACEMENTS
   Replace all blue/purple theme colors with TajerPay teal
   ============================================ */

/* Primary color (p9-clr) - Change from default to TajerPay teal */
.p9-clr {
    color: #277d8b !important;
}

/* Primary background color */
.p9-bg {
    background-color: #277d8b !important;
}

/* Box style backgrounds - Replace blue with teal */
/* Only for buttons with colored backgrounds (box-style3) */
.box-style3 {
    background: linear-gradient(135deg, #277d8b 0%, #3a9fad 100%) !important;
}

/* White background buttons - use TajerPay teal text and border */
.box-style.n0-bg {
    border: 2px solid #277d8b !important;
}

.box-style.n0-bg span {
    color: #277d8b !important;
}

.box-style.n0-bg i {
    color: #277d8b !important;
}

.box-style.n0-bg:hover {
    background: #277d8b !important;
}

.box-style.n0-bg:hover span,
.box-style.n0-bg:hover i {
    color: #ffffff !important;
}

/* Section badges and icons */
.section-header .p9-clr {
    color: #277d8b !important;
}

/* Links and interactive elements */
a.p9-clr:hover {
    color: #1f6370 !important;
}

/* ============================================
   SECTION-SPECIFIC OVERRIDES
   ============================================ */

/* Section 3: Why Choose Us */
.choose-section .display-six {
    color: #000000 !important;
}

.choose-section .section-header .p9-clr {
    color: #277d8b !important;
}

.choose-items14 .box-style3 {
    background: linear-gradient(135deg, #277d8b 0%, #3a9fad 100%) !important;
}

.choose-items14 .icon i {
    color: #FFC043 !important;
}

/* Buttons and CTAs - Only override specific TajerPay branded buttons */
/* Hero section "Join Waitlist" button - keep as teal */
.banner-section14 .cmn-btn.style14 {
    background: linear-gradient(135deg, #277d8b 0%, #3a9fad 100%) !important;
    border-color: #277d8b !important;
}

.banner-section14 .cmn-btn.style14:hover {
    background: #1f6370 !important;
}

/* Other buttons keep their original template colors */

/* Badge styles - Keep original gradient background from template */
/* .badge-14 uses template default colors - do not override */

/* ============================================
   ICON AND ELEMENT COLORS
   ============================================ */

/* Ensure all icons use TajerPay colors */
.icon.box-style i,
.icon.box-style2 i,
.icon.box-style3 i {
    color: #FFC043 !important;
}

/* Counter/stat elements */
.counter-single .icon {
    background: linear-gradient(135deg, #277d8b 0%, #3a9fad 100%) !important;
}

/* ============================================
   UTILITY CLASSES
   ============================================ */

/* Text colors */
.teal-clr {
    color: #277d8b !important;
}

.gold-clr {
    color: #FFC043 !important;
}

/* Background colors */
.teal-bg {
    background-color: #277d8b !important;
}

.gold-bg {
    background-color: #FFC043 !important;
}

/* Borders */
.teal-border {
    border-color: #277d8b !important;
}

.gold-border {
    border-color: #FFC043 !important;
}