:root {
    --complementary: #8b581d;
    --complementary-100: #81521b;
    --complementary-200: #774b19;
    --complementary-300: #6d4517;
    --complementary--100: #9f6522;
    --complementary--200: #b37126;
    --complementary--300: #c77e2a;
    --complementary-rgba-0: rgba(139, 88, 29, 0);
    --complementary-rgba-10: rgba(139, 88, 29, 0.1);
    --complementary-rgba-20: rgba(139, 88, 29, 0.2);
    --complementary-rgba-30: rgba(139, 88, 29, 0.3);
    --complementary-rgba-40: rgba(139, 88, 29, 0.4);
    --complementary-rgba-50: rgba(139, 88, 29, 0.5);
    --complementary-rgba-60: rgba(139, 88, 29, 0.6);
    --complementary-rgba-70: rgba(139, 88, 29, 0.7);
    --complementary-rgba-80: rgba(139, 88, 29, 0.8);
    --complementary-rgba-90: rgba(139, 88, 29, 0.9);
}

:root {
    --complementary-inverse: #fff;
}

@media (min-width: 992px) {
    .custom-text-background.custom-text-hight-ar {
        background-position: 100% 48%;
    }
}

#header .header-top.header-top-default {
    /* background: var(--grey-100); */
    background: linear-gradient(
        90deg,
        rgba(14, 42, 74, 1) 0%,
        rgba(54, 113, 184, 1) 25%,
        rgba(255, 255, 255, 1) 75%
    ) !important;
}

html[dir="rtl"] #header .header-top.header-top-default {
    /* background: var(--grey-100); */
    background: linear-gradient(
        270deg,
        rgba(14, 42, 74, 1) 0%,
        rgba(54, 113, 184, 1) 25%,
        rgba(255, 255, 255, 1) 75%
    ) !important;
}

/* Featured Box - - Skin */
.featured-box-complementary .icon-featured {
    background-color: var(--complementary);
}

.featured-box-complementary h4 {
    color: var(--complementary);
}

.featured-box-complementary .box-content {
    border-top-color: var(--complementary);
}

.featured-box-complementary .box-content-border-bottom {
    border-bottom-color: var(--complementary);
}

.featured-boxes-style-8
    .featured-box.featured-box-complementary
    .icon-featured {
    color: var(--complementary);
}

/* Button complementary */
.btn-complementary {
    --hover: var(--complementary-200);
    background-color: var(--complementary);
    border-color: var(--complementary) var(--complementary)
        var(--complementary-300);
    color: var(--complementary-inverse);
}

.btn-complementary:hover,
.btn-complementary.hover {
    border-color: var(--complementary-200) var(--complementary-200)
        var(--complementary);
    color: var(--complementary-inverse);
}

.btn-complementary:hover:not(.bg-transparent),
.btn-complementary.hover:not(.bg-transparent) {
    background-color: var(--complementary-200);
}

.btn-complementary:focus,
.btn-complementary.focus {
    border-color: var(--complementary-300) var(--complementary-300)
        var(--complementary-300);
    color: var(--complementary-inverse);
    box-shadow: 0 0 0 3px var(--complementary-rgba-50);
}

.btn-complementary:focus:not(.bg-transparent),
.btn-complementary.focus:not(.bg-transparent) {
    background-color: var(--complementary-200);
}

.btn-complementary.disabled,
.btn-complementary:disabled {
    border-color: var(--complementary) var(--complementary)
        var(--complementary-300);
}

.btn-complementary.disabled:not(.bg-transparent),
.btn-complementary:disabled:not(.bg-transparent) {
    background-color: var(--complementary);
}

.btn-complementary:active,
.btn-complementary.active {
    border-color: var(--complementary-300) var(--complementary-300)
        var(--complementary-300) !important;
}

.btn-complementary:active:not(.bg-transparent),
.btn-complementary.active:not(.bg-transparent) {
    background-color: var(--complementary-200) !important;
    background-image: none !important;
}

.list-complementary.list-icons.list-icons-style-3
    li
    > [class*="fa-"]:first-child,
.list-complementary.list-icons.list-icons-style-3 li > .icons:first-child,
.list-complementary.list-icons.list-icons-style-3
    li
    a:first-child
    > [class*="fa-"]:first-child,
.list-complementary.list-icons.list-icons-style-3
    li
    a:first-child
    > .icons:first-child {
    background-color: var(--complementary);
    color: var(--complementary-inverse);
}

.justify-items-center {
    justify-items: center !important;
}

/* Moyasar customization */

html[dir="rtl"]
    #mysr-form-form-el#mysr-form-form-el#mysr-form-form-el.mysr-form-moyasarForm[payment-form="true"]
    input.mysr-form-input,
html[dir="rtl"]
    #mysr-form-form-el#mysr-form-form-el#mysr-form-form-el.mysr-form-moyasarForm[payment-form="true"]
    input.mysr-form-input[type="text"],
html[dir="rtl"]
    #mysr-form-form-el#mysr-form-form-el#mysr-form-form-el.mysr-form-moyasarForm[payment-form="true"]
    .mysr-form-label,
html[dir="rtl"]
    #mysr-form-form-el#mysr-form-form-el#mysr-form-form-el.mysr-form-moyasarForm[payment-form="true"]
    label.mysr-form-label {
    font-family: "Noto Kufi Arabic", Arial, sans-serif !important;
    /* font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,"Helvetica Neue",Ubuntu,sans-serif; */
}

.mysr-form-footer a {
    display: none;
}

/* Price Box GPR Style */

.custom-price-box-gpr-style {
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    border-top-color: var(--primary);
}

/* SVG Rial Style */
.svg-rial-style-1 {
    fill: var(--grey) !important;
    width: 16px !important;
}

.custom-accordion-style-1 > .card .card-header a:after {
    content: "" !important;
    display: none !important;
}

.custom-accordion-style-1 > .card .card-header div {
    background-color: var(--primary);
    color: var(--primary-inverse) !important;
}

.font-family-default {
    font-family: "Noto Kufi Arabic", Arial, sans-serif !important;
}

.testimonial-grey-100 blockquote {
    background: var(--grey-100) !important;
}
.testimonial-grey-100 blockquote p {
    color: var(--primary--300) !important;
}

.testimonial-grey-100 blockquote:before {
    color: var(--primary--300) !important;
}

.svg-flip {
    transform: scale(-1, 1);
}

.gpr-consulting .icons {
    font-size: 1.7em;
}