/* 
LIVE: https://www.karitane.com.au/wp-content/themes/buildystrap-child/dist/fonts/Roobert-Medium.woff
STAGING: https://karitane.staging.handmadeweb.com.au/wp-content/themes/buildystrap-child/dist/fonts/Roobert-Medium.woff
 */
/* set some globals */

@font-face {
 font-family: 'Roobert';
 src: url("/Roobert-Medium.woff");
}

:root {
    --color-warm-sand: #F8F3ED;
    --color-legacy-blue: #13285b;
    --color-charcoal: #272727;
    --color-curious-orange: #FF7B51;
    --color-dark-orange: #d95024;
    --font-roobert: 'Roobert', 'Verdana', sans-serif;
}
body * {
    font-family: var(--font-roobert);
}

/* progress bar */
.progress{
    background-color: var(--color-warm-sand)!important;
    --bs-progress-bar-bg: var(--color-curious-orange);
}

.tab-title, h2.tab-title, legend.section-title h3, 
#ValidationSummaryEntityFormView .validation-header,
#ValidationSummaryEntityFormView ul li a
{
    color: var(--color-legacy-blue);
    padding: 0 28px 14px;
    font-family: var(--font-roobert);
}

/* All input labels */
label {
    color: var(--color-legacy-blue) !important;
}

/* All Inputs / Selects / Textareas */
body .form-control {
    color: var(--color-legacy-blue);
    background-color: var(--color-warm-sand) !important;
    border: 1px solid var(--color-warm-sand) !important;
}
.form-control:focus {
    box-shadow: 0 0 7px var(--color-curious-orange) !important;
}

.form-control > *::placeholder {
    color: var(--color-charcoal) !important;
}
/* input buttons */

a[role=button]{    
     color: var(--color-legacy-blue);
	 font-family: var(--font-roobert);
}

input[type="button"], a.btn.create-action[role=button], #InsertButton {
    background-color: var(--color-curious-orange);
    border: 1px solid var(--color-curious-orange);
    color: white;
    border-radius: 15px !important;
    font-family: var(--font-roobert);
}
input[type="button"]:hover,a.btn.create-action[role=button]:hover, #InsertButton:hover {
    background-color: transparent;
    color: var(--color-curious-orange);
    border: 1px solid var(--color-curious-orange) !important;
}
input[type="button"][value="Processing..."] {
    background-color: var(--color-warm-sand);
}
input[type="button"][disabled] {
    background-color: var(--color-dark-orange);
}

/* override primary btn styles */
.btn-primary {
    --bs-btn-bg: var(--color-curious-orange);
    --bs-btn-hover-bg: var(--color-dark-orange);
    background-color: var(--bs-btn-bg);
    border-color: var(--color-curious-orange);    
}
.btn-primary:hover {
    background-color: white;
    border-color: var(--color-curious-orange);
    color: var(--color-curious-orange);
}

/* Align the custom radio button vertically with the text */
.control .boolean-radio{
    display:flex;
    align-items: center;
}
/* custom radio button */
input[type="radio"] {
    appearance: none;
    width: 15px;
    height: 15px;
    border: 1px solid var(--color-charcoal);
    border-radius: 50%;
    background-color: white;
    cursor: pointer;
}
input[type="radio"]:checked {
    background-color: var(--color-curious-orange);
    border-color: var(--color-curious-orange);
}

/* Base style for checkbox */
input[type="checkbox"] {
    appearance: none;
    width: 20px;
    height: 20px;
    background-color: transparent;
    border: 1px solid var(--color-curious-orange);
    cursor: pointer;
    position:relative;
    border-radius:4px;
    margin-top: 2px;
}
input[type="checkbox"]:checked {
    background-color: var(--color-curious-orange);
    border-color: var(--color-curious-orange);
}
input[type="checkbox"]:checked::after {
    content: "✔";
    color: white;
    font-size: 11px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.alert-warning {
    --bs-alert-border-color: var(--color-warm-sand);
    --bs-alert-bg: var(--color-warm-sand);
    --bs-alert-color: var(--color-legacy-blue);
}

.crmEntityFormView, .entitylist, .modal-content, .popover-content{
	border-width:0px !important;
}