/* body */
body {
    background-color: var(--theme-bg);
    color: var(--theme-color);
}

/* navbar */
.lpm-navbar-custom {
    background-color: var(--theme-navbar-bg);
    border-color: var(--theme-navbar-border);
}
.navbar-default .navbar-brand,
.navbar-default .navbar-nav > li > a {
    color: var(--theme-navbar-link);
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover {
    color: var(--theme-navbar-link-hover);
    background-color: var(--theme-navbar-link-hover-bg);
}
.navbar-default .navbar-toggle {
    border-color: var(--theme-navbar-toggle-border);
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: var(--theme-navbar-toggle-icon);
}

/* dropdowns */
.dropdown-menu {
    background-color: var(--theme-dropdown-bg);
    border-color: var(--theme-dropdown-border);
}
.dropdown-menu > li > a {
    color: var(--theme-dropdown-link);
}
.dropdown-menu > li > a:hover,
.dropdown-menu > .active > a {
    color: var(--theme-dropdown-link-hover-color);
    background-color: var(--theme-dropdown-link-hover-bg);
}
.dropdown-menu .divider {
    background-color: var(--theme-dropdown-divider);
}

/* buttons — remove Bootstrap gradient, apply theme colors */
/* .btn base sets a background so unclassed buttons (btn-sm only, no semantic class) don't inherit row colors */
.btn {
    background-image: none;
    background-color: var(--theme-btn-default-bg);
    color: var(--theme-btn-default-color);
    border-color: var(--theme-btn-default-border);
}

.btn-default {
    background-color: var(--theme-btn-default-bg);
    color: var(--theme-btn-default-color);
    border-color: var(--theme-btn-default-border);
}
.btn-default:hover, .btn-default:focus, .btn-default:active {
    background-color: var(--theme-btn-default-hover-bg);
    color: var(--theme-btn-default-hover-color);
    border-color: var(--theme-btn-default-hover-border);
}

.btn-primary {
    background-color: var(--theme-btn-primary-bg);
    color: var(--theme-btn-primary-color);
    border-color: var(--theme-btn-primary-border);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: var(--theme-btn-primary-hover-bg);
    color: var(--theme-btn-primary-hover-color);
    border-color: var(--theme-btn-primary-hover-border);
}

.btn-success {
    background-color: var(--theme-btn-success-bg);
    color: var(--theme-btn-success-color);
    border-color: var(--theme-btn-success-border);
}
.btn-success:hover, .btn-success:focus, .btn-success:active {
    background-color: var(--theme-btn-success-hover-bg);
    color: var(--theme-btn-success-hover-color);
    border-color: var(--theme-btn-success-hover-border);
}

.btn-warning {
    background-color: var(--theme-btn-warning-bg);
    color: var(--theme-btn-warning-color);
    border-color: var(--theme-btn-warning-border);
}
.btn-warning:hover, .btn-warning:focus, .btn-warning:active {
    background-color: var(--theme-btn-warning-hover-bg);
    color: var(--theme-btn-warning-hover-color);
    border-color: var(--theme-btn-warning-hover-border);
}

.btn-danger {
    background-color: var(--theme-btn-danger-bg);
    color: var(--theme-btn-danger-color);
    border-color: var(--theme-btn-danger-border);
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active {
    background-color: var(--theme-btn-danger-hover-bg);
    color: var(--theme-btn-danger-hover-color);
    border-color: var(--theme-btn-danger-hover-border);
}

.btn-info {
    background-color: var(--theme-btn-info-bg);
    color: var(--theme-btn-info-color);
    border-color: var(--theme-btn-info-border);
}
.btn-info:hover, .btn-info:focus, .btn-info:active {
    background-color: var(--theme-btn-info-hover-bg);
    color: var(--theme-btn-info-hover-color);
    border-color: var(--theme-btn-info-hover-border);
}

/* form inputs */
input.form-control,
select.form-control,
textarea.form-control {
    background-color: var(--theme-input-bg);
    color: var(--theme-input-color);
    border-color: var(--theme-input-border);
}
select.form-control option {
    background-color: var(--theme-input-bg);
    color: var(--theme-input-color);
}
select.form-control option[value=""],
select.form-control option:disabled {
    color: var(--theme-input-option-disabled-color);
}
input.form-control:focus,
select.form-control:focus,
textarea.form-control:focus {
    background-color: var(--theme-input-focus-bg);
    color: var(--theme-input-focus-color);
    border-color: var(--theme-input-focus-border);
    box-shadow: 0 0 4px var(--theme-input-focus-shadow);
}
input.form-control::placeholder {
    color: var(--theme-input-placeholder);
}

/* tabs */
.nav-tabs {
    border-bottom-color: var(--theme-tabs-border);
}
.nav-tabs > li > a {
    color: var(--theme-tab-color);
    background-color: var(--theme-tab-bg);
    border-color: var(--theme-tabs-border) var(--theme-tabs-border) transparent;
}
.nav-tabs > li > a:hover {
    color: var(--theme-tab-hover-color);
    background-color: var(--theme-tab-hover-bg);
    border-color: var(--theme-tabs-border) var(--theme-tabs-border) transparent;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    color: var(--theme-tab-active-color);
    background-color: var(--theme-tab-active-bg);
    border-color: var(--theme-tabs-border) var(--theme-tabs-border) transparent;
    border-bottom-color: var(--theme-tab-active-bg);
}

/* table */
table.lpm-table {
    border-color: var(--theme-table-border);
    color: var(--theme-table-color);
}
table.lpm-table th {
    color: var(--theme-table-th-color);
    border-color: var(--theme-table-th-border);
}
table.lpm-table td {
    border-color: var(--theme-table-td-border);
}
table.lpm-table > tbody > tr:hover > td,
table.lpm-table > tbody > tr:hover > th {
    background-color: var(--theme-table-hover-bg) !important;
    color: var(--theme-table-hover-color);
}
table.lpm-table > tbody > tr > td:hover,
table.lpm-table > tbody > tr > th:hover {
    background-color: var(--theme-table-cell-hover-bg) !important;
    color: var(--theme-table-cell-hover-color);
}

/* striped rows */
table.lpm-table[data-striped] tbody tr:nth-child(2n),
table.lpm-table.striped       tbody tr:nth-child(2n) { background: var(--theme-table-stripe); }

/* selected/highlighted item in hierarchy views */
.lpm-selected-user {
    background-color: var(--theme-selected-user-bg);
    color: var(--theme-selected-user-color);
}

/* pre / code blocks */
pre {
    background-color: var(--theme-pre-bg);
    color: var(--theme-pre-color);
    border-color: var(--theme-pre-border);
}
code {
    background-color: var(--theme-code-bg);
    color: var(--theme-code-color);
}

/* modals */
.modal-content {
    background-color: var(--theme-modal-bg);
    border-color: var(--theme-modal-border);
    color: var(--theme-modal-color);
}
.modal-header {
    background-color: var(--theme-modal-header-bg);
    border-bottom-color: var(--theme-modal-header-border);
}
.modal-header .modal-title {
    color: var(--theme-modal-title-color);
}
.modal-header .close {
    color: var(--theme-modal-close-color);
    opacity: 0.8;
    text-shadow: none;
}
.modal-header .close:hover {
    color: var(--theme-modal-close-hover);
    opacity: 1;
}
.modal-footer {
    border-top-color: var(--theme-modal-footer-border);
    background-color: var(--theme-modal-footer-bg);
}
.modal-backdrop {
    background-color: var(--theme-modal-backdrop);
}

/* page header / user selector area */
.content-header-title {
    color: var(--theme-content-header-title);
}
.content-header-select select,
.content-header-select input {
    background-color: var(--theme-content-header-input-bg);
    color: var(--theme-content-header-input-color);
    border-color: var(--theme-content-header-input-border);
}

/* datepicker */
#ui-datepicker-div {
    background-color: var(--theme-datepicker-bg);
}

/* ---- non-theme utility styles (unchanged) ---- */

.glyphicon-cog { /* icons for appt-cal2 */
    margin: 0 0.5em 0 0;
    padding: 1px;
    color: #008000; /* dark green */
    cursor: pointer;
    transition-duration: 0.2s;
    display: inline-block;
    transition-property: transform;
}
.glyphicon-cog:hover {
    transform:rotate(45deg);
}

.modal.modal-wide .modal-dialog {
    width: 90%;
}

.modal-wide .modal-body {
    overflow-y: auto;
}

.lpm-ajax-spinner {
    position:   fixed;
    z-index:    1000;
    top:        40%;
    left:       40%;
    height:     20%;
    width:      20%;
}

select.lpm-select-colored{
    float:left;
}
/* modified from: https://stackoverflow.com/questions/11890597/is-it-possible-to-add-div-or-span-inside-an-option-tag */
select.lpm-select-colored option::before {
    content: ' ';
    padding-right:1.2em;
    margin-right:0.5em;
    height: .6em;
    width: .6em;
    border: 1px solid black;
    border-radius: 2px;
    display: inline-block;
}

/* TBD: find a better way to do this! */
.lpm-select-colored option.AliceBlue::before { background: AliceBlue; }
.lpm-select-colored option.AntiqueWhite::before { background: AntiqueWhite; }
.lpm-select-colored option.Aqua::before { background: Aqua; }
.lpm-select-colored option.Aquamarine::before { background: Aquamarine; }
.lpm-select-colored option.Azure::before { background: Azure; }
.lpm-select-colored option.Beige::before { background: Beige; }
.lpm-select-colored option.Bisque::before { background: Bisque; }
.lpm-select-colored option.Black::before { background: Black; }
.lpm-select-colored option.BlanchedAlmond::before { background: BlanchedAlmond; }
.lpm-select-colored option.Blue::before { background: Blue; }
.lpm-select-colored option.BlueViolet::before { background: BlueViolet; }
.lpm-select-colored option.Brown::before { background: Brown; }
.lpm-select-colored option.BurlyWood::before { background: BurlyWood; }
.lpm-select-colored option.CadetBlue::before { background: CadetBlue; }
.lpm-select-colored option.Chartreuse::before { background: Chartreuse; }
.lpm-select-colored option.Chocolate::before { background: Chocolate; }
.lpm-select-colored option.Coral::before { background: Coral; }
.lpm-select-colored option.CornflowerBlue::before { background: CornflowerBlue; }
.lpm-select-colored option.Cornsilk::before { background: Cornsilk; }
.lpm-select-colored option.Crimson::before { background: Crimson; }
.lpm-select-colored option.Cyan::before { background: Cyan; }
.lpm-select-colored option.DarkBlue::before { background: DarkBlue; }
.lpm-select-colored option.DarkCyan::before { background: DarkCyan; }
.lpm-select-colored option.DarkGoldenRod::before { background: DarkGoldenRod; }
.lpm-select-colored option.DarkGrey::before { background: DarkGrey; }
.lpm-select-colored option.DarkGreen::before { background: DarkGreen; }
.lpm-select-colored option.DarkKhaki::before { background: DarkKhaki; }
.lpm-select-colored option.DarkMagenta::before { background: DarkMagenta; }
.lpm-select-colored option.DarkOliveGreen::before { background: DarkOliveGreen; }
.lpm-select-colored option.DarkOrange::before { background: DarkOrange; }
.lpm-select-colored option.DarkOrchid::before { background: DarkOrchid; }
.lpm-select-colored option.DarkRed::before { background: DarkRed; }
.lpm-select-colored option.DarkSalmon::before { background: DarkSalmon; }
.lpm-select-colored option.DarkSeaGreen::before { background: DarkSeaGreen; }
.lpm-select-colored option.DarkSlateBlue::before { background: DarkSlateBlue; }
.lpm-select-colored option.DarkSlateGrey::before { background: DarkSlateGrey; }
.lpm-select-colored option.DarkTurquoise::before { background: DarkTurquoise; }
.lpm-select-colored option.DarkViolet::before { background: DarkViolet; }
.lpm-select-colored option.DeepPink::before { background: DeepPink; }
.lpm-select-colored option.DeepSkyBlue::before { background: DeepSkyBlue; }
.lpm-select-colored option.DimGrey::before { background: DimGrey; }
.lpm-select-colored option.DodgerBlue::before { background: DodgerBlue; }
.lpm-select-colored option.FireBrick::before { background: FireBrick; }
.lpm-select-colored option.FloralWhite::before { background: FloralWhite; }
.lpm-select-colored option.ForestGreen::before { background: ForestGreen; }
.lpm-select-colored option.Fuchsia::before { background: Fuchsia; }
.lpm-select-colored option.Gainsboro::before { background: Gainsboro; }
.lpm-select-colored option.GhostWhite::before { background: GhostWhite; }
.lpm-select-colored option.Gold::before { background: Gold; }
.lpm-select-colored option.GoldenRod::before { background: GoldenRod; }
.lpm-select-colored option.Grey::before { background: Grey; }
.lpm-select-colored option.Green::before { background: Green; }
.lpm-select-colored option.GreenYellow::before { background: GreenYellow; }
.lpm-select-colored option.HoneyDew::before { background: HoneyDew; }
.lpm-select-colored option.HotPink::before { background: HotPink; }
.lpm-select-colored option.IndianRed ::before { background: IndianRed ; }
.lpm-select-colored option.Indigo ::before { background: Indigo ; }
.lpm-select-colored option.Ivory::before { background: Ivory; }
.lpm-select-colored option.Khaki::before { background: Khaki; }
.lpm-select-colored option.Lavender::before { background: Lavender; }
.lpm-select-colored option.LavenderBlush::before { background: LavenderBlush; }
.lpm-select-colored option.LawnGreen::before { background: LawnGreen; }
.lpm-select-colored option.LemonChiffon::before { background: LemonChiffon; }
.lpm-select-colored option.LightBlue::before { background: LightBlue; }
.lpm-select-colored option.LightCoral::before { background: LightCoral; }
.lpm-select-colored option.LightCyan::before { background: LightCyan; }
.lpm-select-colored option.LightGrey::before { background: LightGrey; }
.lpm-select-colored option.LightGreen::before { background: LightGreen; }
.lpm-select-colored option.LightPink::before { background: LightPink; }
.lpm-select-colored option.LightSalmon::before { background: LightSalmon; }
.lpm-select-colored option.LightSeaGreen::before { background: LightSeaGreen; }
.lpm-select-colored option.LightSkyBlue::before { background: LightSkyBlue; }
.lpm-select-colored option.LightSlateGrey::before { background: LightSlateGrey; }
.lpm-select-colored option.LightSteelBlue::before { background: LightSteelBlue; }
.lpm-select-colored option.LightYellow::before { background: LightYellow; }
.lpm-select-colored option.Lime::before { background: Lime; }
.lpm-select-colored option.LimeGreen::before { background: LimeGreen; }
.lpm-select-colored option.Linen::before { background: Linen; }
.lpm-select-colored option.Magenta::before { background: Magenta; }
.lpm-select-colored option.Maroon::before { background: Maroon; }
.lpm-select-colored option.MediumAquaMarine::before { background: MediumAquaMarine; }
.lpm-select-colored option.MediumBlue::before { background: MediumBlue; }
.lpm-select-colored option.MediumOrchid::before { background: MediumOrchid; }
.lpm-select-colored option.MediumPurple::before { background: MediumPurple; }
.lpm-select-colored option.MediumSeaGreen::before { background: MediumSeaGreen; }
.lpm-select-colored option.MediumSlateBlue::before { background: MediumSlateBlue; }
.lpm-select-colored option.MediumSpringGreen::before { background: MediumSpringGreen; }
.lpm-select-colored option.MediumTurquoise::before { background: MediumTurquoise; }
.lpm-select-colored option.MediumVioletRed::before { background: MediumVioletRed; }
.lpm-select-colored option.MidnightBlue::before { background: MidnightBlue; }
.lpm-select-colored option.MintCream::before { background: MintCream; }
.lpm-select-colored option.MistyRose::before { background: MistyRose; }
.lpm-select-colored option.Moccasin::before { background: Moccasin; }
.lpm-select-colored option.NavajoWhite::before { background: NavajoWhite; }
.lpm-select-colored option.Navy::before { background: Navy; }
.lpm-select-colored option.OldLace::before { background: OldLace; }
.lpm-select-colored option.Olive::before { background: Olive; }
.lpm-select-colored option.OliveDrab::before { background: OliveDrab; }
.lpm-select-colored option.Orange::before { background: Orange; }
.lpm-select-colored option.OrangeRed::before { background: OrangeRed; }
.lpm-select-colored option.Orchid::before { background: Orchid; }
.lpm-select-colored option.PaleGoldenRod::before { background: PaleGoldenRod; }
.lpm-select-colored option.PaleGreen::before { background: PaleGreen; }
.lpm-select-colored option.PaleTurquoise::before { background: PaleTurquoise; }
.lpm-select-colored option.PaleVioletRed::before { background: PaleVioletRed; }
.lpm-select-colored option.PapayaWhip::before { background: PapayaWhip; }
.lpm-select-colored option.PeachPuff::before { background: PeachPuff; }
.lpm-select-colored option.Peru::before { background: Peru; }
.lpm-select-colored option.Pink::before { background: Pink; }
.lpm-select-colored option.Plum::before { background: Plum; }
.lpm-select-colored option.PowderBlue::before { background: PowderBlue; }
.lpm-select-colored option.Purple::before { background: Purple; }
.lpm-select-colored option.RebeccaPurple::before { background: RebeccaPurple; }
.lpm-select-colored option.Red::before { background: Red; }
.lpm-select-colored option.RosyBrown::before { background: RosyBrown; }
.lpm-select-colored option.RoyalBlue::before { background: RoyalBlue; }
.lpm-select-colored option.SaddleBrown::before { background: SaddleBrown; }
.lpm-select-colored option.Salmon::before { background: Salmon; }
.lpm-select-colored option.SandyBrown::before { background: SandyBrown; }
.lpm-select-colored option.SeaGreen::before { background: SeaGreen; }
.lpm-select-colored option.SeaShell::before { background: SeaShell; }
.lpm-select-colored option.Sienna::before { background: Sienna; }
.lpm-select-colored option.Silver::before { background: Silver; }
.lpm-select-colored option.SkyBlue::before { background: SkyBlue; }
.lpm-select-colored option.SlateBlue::before { background: SlateBlue; }
.lpm-select-colored option.SlateGrey::before { background: SlateGrey; }
.lpm-select-colored option.Snow::before { background: Snow; }
.lpm-select-colored option.SpringGreen::before { background: SpringGreen; }
.lpm-select-colored option.SteelBlue::before { background: SteelBlue; }
.lpm-select-colored option.Tan::before { background: Tan; }
.lpm-select-colored option.Teal::before { background: Teal; }
.lpm-select-colored option.Thistle::before { background: Thistle; }
.lpm-select-colored option.Tomato::before { background: Tomato; }
.lpm-select-colored option.Turquoise::before { background: Turquoise; }
.lpm-select-colored option.Violet::before { background: Violet; }
.lpm-select-colored option.Wheat::before { background: Wheat; }
.lpm-select-colored option.White::before { background: White; }
.lpm-select-colored option.WhiteSmoke::before { background: WhiteSmoke; }
.lpm-select-colored option.Yellow::before { background: Yellow; }
.lpm-select-colored option.YellowGreen::before { background: YellowGreen; }