/* CARDS */
.card{
    position:relative;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-direction:column;
    flex-direction:column;
    min-width:0;
    word-wrap:break-word;
    background-color:#fff;
    background-clip:border-box;
    border:1px solid rgba(0,0,0,.125);
    border-radius:.25rem;
      margin-bottom:10px !important;
}

.card>hr{
    margin-right:0;
    margin-left:0
}
.card>.list-group:first-child .list-group-item:first-child{
    border-top-left-radius:.25rem;
    border-top-right-radius:.25rem
}
.card>.list-group:last-child .list-group-item:last-child{
    border-bottom-right-radius:.25rem;
    border-bottom-left-radius:.25rem
}
.card-body{
    -ms-flex:1 1 auto;
    flex:1 1 auto;
    min-height:1px;
    padding:1.25rem
}
.card-title{
    margin-bottom:.75rem
}
.card-subtitle{
    margin-top:-.375rem;
    margin-bottom:0
}
.card-text:last-child{
    margin-bottom:0
}
.card-link:hover{
    text-decoration:none
}
.card-link+.card-link{
    margin-left:1.25rem
}
.card-header{
    padding:.75rem 1.25rem;
    margin-bottom:0;
    background-color:rgba(0,0,0,.03);
    border-bottom:1px solid rgba(0,0,0,.125)
}
.card-header:first-child{
    border-radius:calc(.25rem - 1px) calc(.25rem - 1px) 0 0
}
.card-header+.list-group .list-group-item:first-child{
    border-top:0
}
.card-footer{
    padding:.75rem 1.25rem;
    background-color:rgba(0,0,0,.03);
    border-top:1px solid rgba(0,0,0,.125)
}
.card-footer:last-child{
    border-radius:0 0 calc(.25rem - 1px) calc(.25rem - 1px)
}
.card-header-tabs{
    margin-right:-.625rem;
    margin-bottom:-.75rem;
    margin-left:-.625rem;
    border-bottom:0
}
.card-header-pills{
    margin-right:-.625rem;
    margin-left:-.625rem
}
.card-img-overlay{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    padding:1.25rem
}
.card-img,.card-img-bottom,.card-img-top{
    -ms-flex-negative:0;
    flex-shrink:0;
    width:100%
}
.card-img,.card-img-top{
    border-top-left-radius:calc(.25rem - 1px);
    border-top-right-radius:calc(.25rem - 1px)
}
.card-img,.card-img-bottom{
    border-bottom-right-radius:calc(.25rem - 1px);
    border-bottom-left-radius:calc(.25rem - 1px)
}
.card-deck .card{
    margin-bottom:15px
}
@media (min-width:576px){
    .card-deck{
        display:-ms-flexbox;
        display:flex;
        -ms-flex-flow:row wrap;
        flex-flow:row wrap;
        margin-right:-15px;
        margin-left:-15px
    }
    .card-deck .card{
        -ms-flex:1 0 0%;
        flex:1 0 0%;
        margin-right:15px;
        margin-bottom:0;
        margin-left:15px
    }
}
.card-group>.card{
    margin-bottom:15px
}
@media (min-width:576px){
    .card-group{
        display:-ms-flexbox;
        display:flex;
        -ms-flex-flow:row wrap;
        flex-flow:row wrap
    }
    .card-group>.card{
        -ms-flex:1 0 0%;
        flex:1 0 0%;
        margin-bottom:0
    }
    .card-group>.card+.card{
        margin-left:0;
        border-left:0
    }
    .card-group>.card:not(:last-child){
        border-top-right-radius:0;
        border-bottom-right-radius:0
    }
    .card-group>.card:not(:last-child) .card-header,.card-group>.card:not(:last-child) .card-img-top{
        border-top-right-radius:0
    }
    .card-group>.card:not(:last-child) .card-footer,.card-group>.card:not(:last-child) .card-img-bottom{
        border-bottom-right-radius:0
    }
    .card-group>.card:not(:first-child){
        border-top-left-radius:0;
        border-bottom-left-radius:0
    }
    .card-group>.card:not(:first-child) .card-header,.card-group>.card:not(:first-child) .card-img-top{
        border-top-left-radius:0
    }
    .card-group>.card:not(:first-child) .card-footer,.card-group>.card:not(:first-child) .card-img-bottom{
        border-bottom-left-radius:0
    }
}
.card-columns .card{
    margin-bottom:.75rem
}
@media (min-width:576px){
    .card-columns{
        -webkit-column-count:3;
        -moz-column-count:3;
        column-count:3;
        -webkit-column-gap:1.25rem;
        -moz-column-gap:1.25rem;
        column-gap:1.25rem;
        orphans:1;
        widows:1
    }
    .card-columns .card{
        display:inline-block;
        width:100%
    }
}

/* INFOBOX */
.infobox-02 {
    display: flex;
    flex-direction: column;
    padding: 25px 25px 25px;
    border-radius: 2px;
    text-align: left;
    background: #fff;
    -webkit-box-shadow: 0px 0px 25px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 25px rgba(0,0,0,0.1);
}

/* BUTTONS */
.btn.btn-info {
    background: #b89553 !important;
    border: solid 1px #b89553 !important;
}

/* COLORS */
.accent1{
  background-color:#3c7668;
  color:white;
  font-weight:bold;
}
.accent2{
  background-color:#e0b557;
  color:white;
  font-weight:bold;
}
.accent3{
  background-color:#737373;
  color:white;
  font-weight:bold;
}

/* NAV BAR HIDE */
#dnn_userLogin481003_registerLink{
display:none !important;
}
#leftmenuapfwcadmin > div > ul{
 list-style-position: inside;
text-indent: -1em;
}
#dropin-container {
    width: 100% !important;
    margin-left: 0% !important;
}
.text-white-custom {
    color: white; 
}
.service-info-line {
    display: block; 
     font-size: 16px;
     margin-bottom: 5px;
}
.margin-bottom{
   margin-bottom: 20px; 
}
.info-div{
  padding: 20px;
  border-radius: 10px;
}
.contact-info-line
{
     font-size: 16px;
     margin-bottom: 5px;
}
.additional-info-line 
{
     font-size: 16px;
     margin-bottom: 5px;  
}
.g-map, ng-map {
  height: 200px !important;
  width:100% !important;
}
.form-group-g-map {
 height: 450px; 
}

/* BACKEND SKIN */
.logo-wrap{
  padding-top:10px !important;
}
.be-logo{
  max-width:68%;
}
.text-white{
  color:white !important;
}
.label-larger-text {
   font-size: 16px !important; 
}
.label-green {
  background-color: #0275d8; 
  padding: 10px;
  border-radius: 15px;
  color: black;
  font-weight: bold;
}
.label-yellow {
  background-color: #f0ad4e; 
  padding: 10px;
  border-radius: 15px;
  color: black;
  font-weight: bold;
}
.guard-dashboard
{
  background-color: #3c7668;
  padding: 20px;
}
.eds_btn
{
   color: wheat; 
}
.eds_btn:hover
{
   color: white; 
}
.guard-dashboard-anchor-parent a
{
   margin-right: 15px;
}
.embed-responsive-item
{
    padding: 10px; 
}

/* Employment Application Header - BEGIN block*/
.employment-applications-header
{
  background-color: #3c7668;
  padding: 20px;
}
th.header-gold
{
  color: gold !important;
}
/* Employment Application Header - END block*/


/*Client Dashboard - BEGIN block*/
.client-dashboard
{
  padding: 25px;
}

/*Client Dashboard - END block*/
.admin-service-order-dashboard
{
  background-color: #3c7668;
  padding: 20px;
}
.piechart-div
{
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
}

/* LOGIN CARD */
.login-card{
    background-color:white;
    border-radius:10px;
    padding:40px;
    margin-top:30px;
}

/* Guard Dashboard */
.guard-dashboard-subheader-flex
{
    display: flex;
    justify-content: space-around;
}
#Jobs > div.sticky-header > ul > li.obsolete-feature.nav-with-number.active{display:none !important}


/* ADD MODULE POPUP */
.dnnModuleDialog{
    top:10 !important;
}
.dnnModuleManager .DnnModule.floating, .dnnModuleSorting .DnnModule.floating{
    top:100px !important;
}

.accent1B {
    background-color: gray;
    color: white;
    font-weight: bold;
}


ul, ol {
    margin-left: 0px !important;
}

.bmr{
    margin-right:5px !important;
}

/* ACTION GRID DARK MODE */

/* Table background and text colors for dark mode */
[data-bs-theme="dark"] .angrid-grid {
    background-color: #333 !important;
    color: #fff !important;
}

/* Even rows styling */
[data-bs-theme="dark"] .angrid-grid .table-striped tbody tr:nth-of-type(even),
.bstrap30 .angrid-grid .table-striped tbody tr:nth-of-type(even) {
    background-color: #444 !important; /* Darker background for even rows */
}

/* Odd rows styling */
[data-bs-theme="dark"] .angrid-grid .table-striped tbody tr:nth-of-type(odd),
.bstrap30 .angrid-grid .table-striped tbody tr:nth-of-type(odd) {
    background-color: #3a3f41 !important; /* Darker odd row background */
}

/* Table headers in dark mode */
[data-bs-theme="dark"] .angrid-grid th {
    background-color: #222 !important; /* Darker header background */
    color: #fff !important; /* White text for headers */
    border-color: #444 !important; /* Darker border for headers */
}

/* Links in table headers should be white in dark mode */
[data-bs-theme="dark"] .angrid-grid th a {
    color: #fff !important; /* White color for links in header */
}

/* Fix for odd rows background in dark mode */
[data-bs-theme="dark"] #dnnsharp .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #3a3f41 !important; /* Darker odd row background */
}

/* Button colors in both light and dark modes */
[data-bs-theme="dark"] .angrid-item-buttons .btn-default,
.bstrap30 .angrid-item-buttons .btn-default {
    background-color: #555 !important; /* Button background */
    border-color: #666 !important;
    color: #fff !important;
}

[data-bs-theme="dark"] .angrid-item-buttons .btn-default:hover,
.bstrap30 .angrid-item-buttons .btn-default:hover {
    background-color: #666 !important;
    border-color: #777 !important;
}

/* Fixing button vertical alignment */
[data-bs-theme="dark"] .angrid-item-buttons {
    display: flex !important;
    justify-content: center !important; /* Center buttons horizontally */
    align-items: center !important; /* Center buttons vertically */
    height: auto !important; /* Ensure buttons do not stretch to 100% height */
    padding: 4px !important;
    background-color: inherit !important; /* Ensure button container matches row background */
    border-top: 1px solid #444 !important; /* Darker border for button container in dark mode */
    border-bottom: none !important; /* Remove bottom border */
}

/* Ensuring button height is properly aligned when content breaks */
[data-bs-theme="dark"] .angrid-item-buttons button {
    line-height: normal !important; /* Fix button height issues */
    vertical-align: middle !important;
    height: auto !important; /* Buttons should not stretch across the entire row height */
}

/* Loading animation color in dark mode */
[data-bs-theme="dark"] .common-data-loading,
[data-bs-theme="dark"] .common-data-loading:before,
[data-bs-theme="dark"] .common-data-loading:after,
.bstrap30 .common-data-loading,
.bstrap30 .common-data-loading:before,
.bstrap30 .common-data-loading:after {
    background-color: #fff !important; /* White loading animation in dark mode */
}

/* Ensuring table rows have consistent borders in dark mode */
[data-bs-theme="dark"] #dnnsharp .table > thead > tr > th,
[data-bs-theme="dark"] #dnnsharp .table > tbody > tr > th,
[data-bs-theme="dark"] #dnnsharp .table > tfoot > tr > th,
[data-bs-theme="dark"] #dnnsharp .table > thead > tr > td,
[data-bs-theme="dark"] #dnnsharp .table > tbody > tr > td,
[data-bs-theme="dark"] #dnnsharp .table > tfoot > tr > td {
    padding: 8px !important;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #444 !important; /* Darker border in dark mode */
    border-color: #444 !important; /* Ensure the borders match in dark mode */
}

/* Light Mode Borders - Default */
#dnnsharp .table > thead > tr > th,
#dnnsharp .table > tbody > tr > th,
#dnnsharp .table > tfoot > tr > th,
#dnnsharp .table > thead > tr > td,
#dnnsharp .table > tbody > tr > td,
#dnnsharp .table > tfoot > tr > td {
    border-top: 1px solid #ddd !important; /* Light mode borders */
    border-color: #ddd !important; /* Light borders for light mode */
}

/* Fix for odd rows background in dark mode */
[data-bs-theme="dark"] #dnnsharp .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #3a3f41 !important; /* Darker odd row background */
}

/* Fix for border underneath the button container in light mode */
#dnnsharp .table td.angrid-item-buttons {
    border-bottom: none !important; /* Remove bottom border */
}

/* Ensure that the button container td does not have unwanted borders */
#dnnsharp .table td.angrid-item-buttons {
    padding-bottom: 0 !important; /* Remove any padding causing the border issue */
}

/* Fix for the border styling in dark mode */
[data-bs-theme="dark"] #dnnsharp .well {
    background-color: #444 !important; /* Dark background for the well */
    color: #fff !important; /* White text for dark mode */
    border: 1px solid #666 !important; /* Darker border in dark mode */
    min-height: 20px !important;
    padding: 19px !important;
    margin-bottom: 20px !important;
}

/* Fix for the "Records per Page" dropdown text clipping */
#dnnsharp select.input-sm {
    height: 36px !important; /* Adjust height for better dropdown visibility */
    line-height: 36px !important; /* Set line-height to match height */
    padding: 5px 10px !important; /* Add padding to make text visible */
    font-size: 0.875rem !important; /* Slightly adjust font size for better readability */
    background-color: #fff !important; /* Light background for light mode */
    border: 1px solid #ddd !important; /* Light border for light mode */
    text-overflow: ellipsis !important; /* Ensure text is not clipped */
    white-space: nowrap !important; /* Prevent text clipping */
}

[data-bs-theme="dark"] #dnnsharp select.input-sm {
    background-color: #555 !important; /* Dark background for dark mode */
    color: #fff !important; /* White text for dark mode */
    border: 1px solid #666 !important; /* Darker border for dark mode */
}

/* Additional styling to ensure dropdown text is visible and aligned properly */
.angrid-ddpagesize select option {
    padding: 5px 10px !important; /* Ensure option text is fully visible */
}

/* Adjusting pagination button and footer styles for dark mode */
[data-bs-theme="dark"] .angrid-pager {
    background-color: #333 !important; /* Dark background for footer */
    color: #fff !important; /* White text for dark mode */
    border-top: 1px solid #444 !important; /* Darker border for dark mode */
}

[data-bs-theme="dark"] .angrid-pager .pagination>li>a,
[data-bs-theme="dark"] .angrid-pager .pagination>li>span {
    background-color: #555 !important; /* Dark background for pagination links */
    color: #fff !important; /* White text for pagination */
    border: 1px solid #666 !important; /* Darker border */
}
/* Dark Mode Styling for Search Input */
[data-bs-theme="dark"] input.form-control {
    background-color: #555 !important; /* Dark background for search input */
    color: #fff !important; /* White text for dark mode */
    border: 1px solid #666 !important; /* Darker border for search input */
}

[data-bs-theme="dark"] input.form-control:focus {
    background-color: #666 !important; /* Darker background on focus */
    border-color: #777 !important; /* Focused border color */
    box-shadow: 0 0 5px rgba(255, 255, 255, 0.5) !important; /* Focus shadow for input */
}

/* Light Mode Styling for Search Input (default) */
input.form-control {
    background-color: #fff !important; /* Light background for search input */
    color: #000 !important; /* Black text for light mode */
    border: 1px solid #ddd !important; /* Light border for search input */
}

input.form-control:focus {
    background-color: #f9f9f9 !important; /* Lighter background on focus */
    border-color: #ccc !important; /* Focused border color */
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1) !important; /* Focus shadow for input */
}

.angrid-grid{margin-top:5px !important;}


/* ACTION FORM DARK MODE */
/* Dark Mode Styling for Form Labels */
[data-bs-theme="dark"] label.control-label {
    color: #fff !important; /* White text color for labels in dark mode */
}

/* Light Mode Styling for Form Labels */
label.control-label {
    color: #000 !important; /* Black text for labels in light mode */
}

/* Dark Mode Styling for Radio Containers and Radio Buttons */
[data-bs-theme="dark"] .radiocontainer label {
    color: #fff !important; /* White text for radio labels in dark mode */
}

[data-bs-theme="dark"] .radiocontainer .radio input[type="radio"] {
    background-color: #444 !important; /* Dark background for radio buttons */
    border: 1px solid #666 !important; /* Darker border for radio buttons */
}

[data-bs-theme="dark"] .radiocontainer .radio input[type="radio"]:checked {
    background-color: #428bca !important; /* Blue background when checked */
    border: 1px solid #428bca !important; /* Blue border for checked radio */
}

[data-bs-theme="dark"] .radiocontainer .radio span {
    color: #fff !important; /* White text for radio options */
}

/* Light Mode Styling for Radio Buttons */
.radiocontainer .radio input[type="radio"] {
    background-color: #fff !important; /* Light background for radio buttons */
    border: 1px solid #ddd !important; /* Light border for radio buttons */
}

.radiocontainer .radio input[type="radio"]:checked {
    background-color: #428bca !important; /* Blue background when checked */
    border: 1px solid #428bca !important; /* Blue border for checked radio */
}

.radiocontainer .radio span {
    color: #000 !important; /* Black text for radio options in light mode */
}

/* Dark Mode Styling for Checkboxes */
[data-bs-theme="dark"] .checkbox input[type="checkbox"] {
    background-color: #444 !important; /* Dark background for checkboxes */
    border: 1px solid #666 !important; /* Darker border for checkboxes */
}

[data-bs-theme="dark"] .checkbox input[type="checkbox"]:checked {
    background-color: #428bca !important; /* Blue background when checked */
    border: 1px solid #428bca !important; /* Blue border for checked checkbox */
}

[data-bs-theme="dark"] .checkbox span {
    color: #fff !important; /* White text for checkbox options */
}

/* Light Mode Styling for Checkboxes */
.checkbox input[type="checkbox"] {
    background-color: #fff !important; /* Light background for checkboxes */
    border: 1px solid #ddd !important; /* Light border for checkboxes */
}

.checkbox input[type="checkbox"]:checked {
    background-color: #428bca !important; /* Blue background when checked */
    border: 1px solid #428bca !important; /* Blue border for checked checkbox */
}

.checkbox span {
    color: #000 !important; /* Black text for checkbox options in light mode */
}

/* Dark Mode Styling for Textareas */
[data-bs-theme="dark"] textarea.form-control {
    background-color: #555 !important; /* Dark background for textarea */
    color: #fff !important; /* White text for textarea */
    border: 1px solid #666 !important; /* Darker border for textarea */
}

[data-bs-theme="dark"] textarea.form-control:focus {
    background-color: #666 !important; /* Darker background on focus */
    border-color: #777 !important; /* Focused border color */
    box-shadow: 0 0 5px rgba(255, 255, 255, 0.5) !important; /* Focus shadow for textarea */
}

/* Light Mode Styling for Textareas */
textarea.form-control {
    background-color: #fff !important; /* Light background for textarea */
    color: #000 !important; /* Black text for textarea */
    border: 1px solid #ddd !important; /* Light border for textarea */
}

textarea.form-control:focus {
    background-color: #f9f9f9 !important; /* Lighter background on focus */
    border-color: #ccc !important; /* Focused border color */
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1) !important; /* Focus shadow for textarea */
}

/* Dark Mode Styling for Select Dropdown */
[data-bs-theme="dark"] select.form-control {
    background-color: #555 !important; /* Dark background for select dropdown */
    color: #fff !important; /* White text for select dropdown */
    border: 1px solid #666 !important; /* Darker border for select dropdown */
}

[data-bs-theme="dark"] select.form-control:focus {
    background-color: #666 !important; /* Darker background on focus */
    border-color: #777 !important; /* Focused border color */
    box-shadow: 0 0 5px rgba(255, 255, 255, 0.5) !important; /* Focus shadow for select */
}

/* Light Mode Styling for Select Dropdown */
select.form-control {
    background-color: #fff !important; /* Light background for select dropdown */
    color: #000 !important; /* Black text for select dropdown */
    border: 1px solid #ddd !important; /* Light border for select dropdown */
}

select.form-control:focus {
    background-color: #f9f9f9 !important; /* Lighter background on focus */
    border-color: #ccc !important; /* Focused border color */
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1) !important; /* Focus shadow for select */
}

/* Fixing Clipped Text in the Select Dropdown */
select.form-control {
    text-overflow: ellipsis !important; /* Ensure text is not clipped */
    padding: 5px 10px !important; /* Add padding to make text visible */
    font-size: 0.875rem !important; /* Slightly adjust font size for better readability */
    white-space: nowrap !important; /* Prevent text clipping */
}

/* Radio and Checkbox input when in dark mode */
[data-bs-theme="dark"] .radio input[type="radio"],
[data-bs-theme="dark"] .checkbox input[type="checkbox"] {
    accent-color: #428bca !important; /* Set accent color for dark mode inputs */
}

/* Dark Mode Styling for Form Labels (without background color) */
[data-bs-theme="dark"] .control-label {
    color: #fff !important; /* White text for labels in dark mode */
}

/* Light Mode Styling for Form Labels */
.control-label {
    color: #000 !important; /* Black text for labels in light mode */
}

/* Optional: Lighten labels on focus or hover */
[data-bs-theme="dark"] .control-label:focus,
[data-bs-theme="dark"] .control-label:hover {
    color: #e0e0e0 !important; /* Lighter text color on hover/focus in dark mode */
}

.control-label:focus,
.control-label:hover {
    color: #007bff !important; /* Lighter text color on hover/focus in light mode */
}

/* Fix for Radio and Checkbox input in Dark Mode */
[data-bs-theme="dark"] .radio input[type="radio"],
[data-bs-theme="dark"] .checkbox input[type="checkbox"] {
    accent-color: #428bca !important; /* Set accent color for dark mode inputs */
}
/* Dark Mode Styling for Headings (h1, h2, h4) */
[data-bs-theme="dark"] h1.section-title,
[data-bs-theme="dark"] h2.section-title,
[data-bs-theme="dark"] h4.section-title {
    color: #fff !important; /* White text for headings in dark mode */
    background-color: transparent !important; /* Transparent background for headings in dark mode */
    border-bottom: 2px solid #777 !important; /* Darker border for underlined headings */
}

/* Light Mode Styling for Headings (h1, h2, h4) */
h1.section-title,
h2.section-title,
h4.section-title {
    color: #000 !important; /* Black text for headings in light mode */
    background-color: transparent !important; /* Transparent background for headings in light mode */
    border-bottom: 2px solid #ddd !important; /* Lighter border for underlined headings */
}

/* Optional: Adding hover/focus effect to headings */
[data-bs-theme="dark"] h1.section-title:hover,
[data-bs-theme="dark"] h2.section-title:hover,
[data-bs-theme="dark"] h4.section-title:hover,
h1.section-title:hover,
h2.section-title:hover,
h4.section-title:hover {
    color: #e0e0e0 !important; /* Lighter color on hover in both modes */
}

/* Dark Mode Underlined Headings (h1, h2, h4) */
[data-bs-theme="dark"] h1.section-title.underlined,
[data-bs-theme="dark"] h2.section-title.underlined,
[data-bs-theme="dark"] h4.section-title.underlined {
    border-bottom: 2px solid #bbb !important; /* Underline with a subtle light gray border in dark mode */
}

/* Light Mode Underlined Headings (h1, h2, h4) */
h1.section-title.underlined,
h2.section-title.underlined,
h4.section-title.underlined {
    border-bottom: 2px solid #ccc !important; /* Underline with a subtle light gray border in light mode */
}


/* Used on Service Order Details Page - Location grid buttons */
.sca-margin-left-little {
    margin-left: 10px !important;
}