/* Pezani platform palette. Keep in sync with Dashboard and Profile assets. */
:root {
    --pz-brand-purple: #56226B;
    --pz-brand-purple-hover: #451B57;
    --pz-brand-purple-tint: #F3EAF6;
    --pz-brand-teal: #3EBEB7;
    --pz-brand-teal-strong: #006B66;
    --pz-brand-teal-tint: #E7F6F4;
    --pz-brand-amber: #FAAF40;
    --pz-brand-amber-ink: #493000;
    --pz-brand-amber-tint: #FFF4DE;
    --pz-brand-red: #EE4036;
    --pz-danger: #C62828;
    --pz-danger-tint: #FDECEC;
    --pz-ink: #18253B;
    --pz-muted: #526173;
    --pz-canvas: #F4F6F9;
    --pz-surface: #FFFFFF;
    --pz-control-border: #788493;
    --pz-discovery-accent: #344A63;
    --pz-discovery-accent-tint: #EDF1F4;
    --pz-discovery-accent-line: #C8D1D9;
}

body.pezani-mobile-app {
    --pezani-navy: var(--pz-brand-purple);
    --pezani-navy-deep: var(--pz-brand-purple-hover);
    --pezani-ink: var(--pz-ink);
    --pezani-muted: var(--pz-muted);
}

body.pezani-mobile-app .nav-header,
body.pezani-mobile-app .header {
    background: var(--pz-brand-purple) !important;
}

body.pezani-mobile-app .nav-header .brand-logo img {
    background: var(--pz-brand-amber);
}

body.pezani-mobile-app .dlabnav .metismenu > li.mm-active > a {
    background: var(--pz-brand-purple) !important;
    color: #fff !important;
}

body.pezani-mobile-app .dlabnav .metismenu > li.mm-active > a > i,
body.pezani-mobile-app .dlabnav .metismenu > li.mm-active > a .nav-text {
    color: #fff !important;
}

body.pezani-mobile-app .custom-tab-1 > .nav-tabs > .nav-item > .nav-link.active,
body.pezani-mobile-app .nav-tabs[role="tablist"] > .nav-item > .nav-link.active {
    border-bottom-color: var(--pz-brand-purple) !important;
    color: var(--pz-brand-purple) !important;
}

body.pezani-mobile-app.mobile-view-directory .custom-tab-1 > .nav-tabs > .nav-item > .nav-link.active,
body.pezani-mobile-app.mobile-view-directory .nav-tabs[role="tablist"] > .nav-item > .nav-link.active {
    border-bottom-color: var(--pz-discovery-accent) !important;
    color: var(--pz-discovery-accent) !important;
}

body.pezani-mobile-app.mobile-view-directory .custom-tab-1 > .nav-tabs > .nav-item > .nav-link.active h4 {
    color: var(--pz-discovery-accent) !important;
}

body.pezani-mobile-app .btn-primary,
body.pezani-mobile-app [data-pezani-primary] {
    background-color: var(--pz-brand-purple) !important;
    border-color: var(--pz-brand-purple) !important;
    box-shadow: 0 .35rem .9rem rgb(86 34 107 / 20%);
    color: #fff !important;
}

body.pezani-mobile-app .btn-primary:hover,
body.pezani-mobile-app .btn-primary:focus-visible,
body.pezani-mobile-app [data-pezani-primary]:hover,
body.pezani-mobile-app [data-pezani-primary]:focus-visible {
    background-color: var(--pz-brand-purple-hover) !important;
    border-color: var(--pz-brand-purple-hover) !important;
}

body.pezani-mobile-app.mobile-view-directory .btn-primary,
body.pezani-mobile-app.mobile-view-directory [data-pezani-primary] {
    background-color: var(--pz-discovery-accent) !important;
    border-color: var(--pz-discovery-accent) !important;
    box-shadow: 0 .35rem .9rem rgb(52 74 99 / 20%);
    color: #fff !important;
}

body.pezani-mobile-app.mobile-view-directory .btn-primary:hover,
body.pezani-mobile-app.mobile-view-directory .btn-primary:focus-visible,
body.pezani-mobile-app.mobile-view-directory [data-pezani-primary]:hover,
body.pezani-mobile-app.mobile-view-directory [data-pezani-primary]:focus-visible {
    background-color: #283B50 !important;
    border-color: #283B50 !important;
}

body.pezani-mobile-app.mobile-view-directory .btn-outline-primary {
    border-color: var(--pz-discovery-accent) !important;
    color: var(--pz-discovery-accent) !important;
}

body.pezani-mobile-app.mobile-view-directory .btn-outline-primary:hover,
body.pezani-mobile-app.mobile-view-directory .btn-outline-primary:focus-visible {
    background-color: var(--pz-discovery-accent) !important;
    color: #fff !important;
}

body.pezani-mobile-app.mobile-view-chats .btn-primary,
body.pezani-mobile-app.mobile-view-chats [data-pezani-primary],
body.pezani-mobile-app.mobile-view-contacts .btn-primary,
body.pezani-mobile-app.mobile-view-contacts [data-pezani-primary],
body.pezani-mobile-app.mobile-view-account .btn-primary,
body.pezani-mobile-app.mobile-view-account [data-pezani-primary] {
    background-color: var(--pz-discovery-accent) !important;
    border-color: var(--pz-discovery-accent) !important;
    color: #fff !important;
}

body.pezani-mobile-app.mobile-view-chats .btn-primary:hover,
body.pezani-mobile-app.mobile-view-chats .btn-primary:focus-visible,
body.pezani-mobile-app.mobile-view-chats [data-pezani-primary]:hover,
body.pezani-mobile-app.mobile-view-chats [data-pezani-primary]:focus-visible,
body.pezani-mobile-app.mobile-view-contacts .btn-primary:hover,
body.pezani-mobile-app.mobile-view-contacts .btn-primary:focus-visible,
body.pezani-mobile-app.mobile-view-contacts [data-pezani-primary]:hover,
body.pezani-mobile-app.mobile-view-contacts [data-pezani-primary]:focus-visible,
body.pezani-mobile-app.mobile-view-account .btn-primary:hover,
body.pezani-mobile-app.mobile-view-account .btn-primary:focus-visible,
body.pezani-mobile-app.mobile-view-account [data-pezani-primary]:hover,
body.pezani-mobile-app.mobile-view-account [data-pezani-primary]:focus-visible {
    background-color: #283B50 !important;
    border-color: #283B50 !important;
}

body.pezani-mobile-app.mobile-view-chats .btn-outline-primary,
body.pezani-mobile-app.mobile-view-contacts .btn-outline-primary,
body.pezani-mobile-app.mobile-view-account .btn-outline-primary {
    border-color: var(--pz-discovery-accent) !important;
    color: var(--pz-discovery-accent) !important;
}

body.pezani-mobile-app.mobile-view-chats .btn-outline-primary:hover,
body.pezani-mobile-app.mobile-view-chats .btn-outline-primary:focus-visible,
body.pezani-mobile-app.mobile-view-contacts .btn-outline-primary:hover,
body.pezani-mobile-app.mobile-view-contacts .btn-outline-primary:focus-visible,
body.pezani-mobile-app.mobile-view-account .btn-outline-primary:hover,
body.pezani-mobile-app.mobile-view-account .btn-outline-primary:focus-visible {
    background-color: var(--pz-discovery-accent) !important;
    color: #fff !important;
}

body.pezani-mobile-app .btn-danger,
body.pezani-mobile-app [data-pezani-destructive] {
    background-color: var(--pz-danger) !important;
    border-color: var(--pz-danger) !important;
    color: #fff !important;
}

body.pezani-mobile-app :is(input, select, textarea, .form-control, .form-select):focus {
    border-color: var(--pz-brand-purple) !important;
    box-shadow: 0 0 0 .2rem rgb(86 34 107 / 22%) !important;
    outline: 0;
}

body.pezani-mobile-app :is(input, select, textarea, .form-control, .form-select) {
    border-color: var(--pz-control-border) !important;
}

body.pezani-mobile-app .mobile-header-search .search-area,
body.pezani-mobile-app .header-left .search-area,
body.pezani-mobile-app .pezani-money-group {
    border-color: var(--pz-control-border) !important;
}

body.pezani-mobile-app :is(button, a, input, select, textarea, [role="button"]):focus-visible {
    outline: 3px solid var(--pz-brand-purple);
    outline-offset: 2px;
}

body.pezani-mobile-app :is(.header, .nav-header) :is(button, a, [role="button"]):focus-visible {
    outline-color: #fff;
}

body.pezani-mobile-app :is(input[type="checkbox"], input[type="radio"], progress) {
    accent-color: var(--pz-brand-purple);
}