/*********************************************/
/* theme.css                                */
/* RiskScape Custom Theme                   */
/*********************************************/

:root,
[data-bs-theme="default-theme"] {
  /* BS Main Colors - RiskScape Branding */
  --bs-primary: #FF8C00;
  --bs-secondary: #4A5568;

  /* Background Color for the backmost level */
  --theme-backdrop-bg: #F5F5F5;

  /* Default Background-Color and Color */
  --bs-body-bg: #F5F5F5;
  --bs-body-color: #2D3748;
  
  /* Theme Classes */
  --theme-page-main-bg: #F5F5F5;
  --theme-breadcrumb-bg: #FFFFFF;
  --theme-footer-bg: #2D3748;
  --theme-nav-bg: #FFFFFF;

  /* Override Link-Colors */
  --bs-nav-link-color: #4A5568;
  --bs-link-color: #FF8C00;
  --bs-link-hover-color: #E67E00;

  /* Font Setting */
  --theme-font: system-ui, -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --theme-font-headlines: var(--theme-font);
  --bs-body-font-family: var(--theme-font);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-h1-font-size: 2.5rem;
 
  /* Border Radius  */
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;

  /* Shadows */
  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);

  .breadcrumb {
    --bs-breadcrumb-font-size: 14px;
  }
  
  /* Main Button-Colors */
  .btn-primary {
    --bs-btn-color: var(--bs-white);
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: color-mix(in srgb, var(--bs-primary) 15%, #000);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-primary) 15%, #000);
    
    --bs-btn-active-color: var(--bs-white);
    --bs-btn-active-bg: color-mix(in srgb, var(--bs-primary) 15%, #000);
    --bs-btn-active-border-color: color-mix(in srgb, var(--bs-primary) 15%, #000);
    
    --bs-btn-disabled-color: var(--bs-white);
    --bs-btn-disabled-bg: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);    
  }

  .btn-outline-primary {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-bg: var(--bs-white);
    --bs-btn-border-color: var(--bs-primary);
    
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);

    --bs-btn-active-color: var(--bs-white);
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);

    --bs-btn-disabled-color: var(--bs-primary);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--bs-primary);
  }  

  .btn-secondary {
    --bs-btn-color: var(--bs-white);
    --bs-btn-bg: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);

    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: color-mix(in srgb, var(--bs-secondary) 15%, #000);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-secondary) 15%, #000);
    
    --bs-btn-active-color: var(--bs-white);
    --bs-btn-active-bg: color-mix(in srgb, var(--bs-secondary) 15%, #000);
    --bs-btn-active-border-color: color-mix(in srgb, var(--bs-secondary) 15%, #000);
    
    --bs-btn-disabled-color: var(--bs-white);
    --bs-btn-disabled-bg: var(--bs-secondary);
    --bs-btn-disabled-border-color: var(--bs-secondary);    
  }

  .btn-outline-secondary {
    --bs-btn-color: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-secondary);
    --bs-btn-hover-border-color: var(--bs-secondary);
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-secondary);
    --bs-btn-active-border-color: var(--bs-secondary);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--bs-secondary);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--bs-secondary);
    --bs-gradient: none;
  }

  .footer {
    --bs-link-color: var(--bs-white);
    --bs-link-hover-color: var(--bs-body-color);
  }
    
  .navbar-nav {
    --bs-nav-link-color: #4A5568; 
    --bs-nav-link-hover-color: #FF8C00;
    --bs-navbar-active-color: #FF8C00;
  }

  .table {
    --bs-table-bg: var(--bs-white);    
  }  
}

/*********************************************/
/* RiskScape Navigation Customization      */
/*********************************************/

/* Navigation Bar Styling - Force white background */
#theme-page-navigation,
#theme-page-navigation.navbar-expand-lg,
body #theme-page-navigation,
html body #theme-page-navigation {
  background-color: #F7FAFC !important;
  background: #F7FAFC !important;
  border-bottom: none !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08) !important;
  padding: 0.5rem 0 !important;
  min-height: 60px !important;
}

/* Logo styling */
#theme-page-navigation .logo,
#theme-page-navigation .navbar-brand,
.navbar-brand {
  color: #FF8C00 !important;
  font-weight: 600 !important;
  font-size: 1.5rem !important;
  max-height: 50px !important;
  margin-right: 2rem !important;
}

#theme-page-navigation .logo img,
#theme-page-navigation .navbar-brand img {
  max-height: 50px !important;
  height: 50px !important;
  width: auto !important;
}

/* Navigation Links - Global styles */
#theme-page-navigation .navbar-nav .nav-link,
body #theme-page-navigation .navbar-nav .nav-link,
html body #theme-page-navigation .navbar-nav .nav-link {
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  transition: color 0.2s ease !important;
  white-space: nowrap !important;
}

/* Navigation Links - Desktop */
@media (min-width: 992px) {
  #theme-page-navigation .navbar-nav .nav-link,
  body #theme-page-navigation .navbar-nav .nav-link {
    color: #4A5568 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 0.5rem 0.75rem !important;
  }
  
  #theme-page-navigation .navbar-nav .nav-link:hover,
  body #theme-page-navigation .navbar-nav .nav-link:hover {
    color: #FF8C00 !important;
    background-color: transparent !important;
  }
  
  #theme-page-navigation .navbar-nav .nav-link.active,
  #theme-page-navigation .navbar-nav .active .nav-link,
  body #theme-page-navigation .navbar-nav .nav-link.active {
    color: #4A5568 !important;
    background-color: transparent !important;
    border-bottom: none !important;
  }
}

/* Dropdown menus - Desktop */
@media (min-width: 992px) {
  .dropdown-menu,
  #theme-page-navigation .dropdown-menu {
    background-color: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 0.375rem !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    padding: 0.5rem !important;
  }
  
  .dropdown-menu .dropdown-item,
  #theme-page-navigation .dropdown-menu .dropdown-item {
    color: #4A5568 !important;
    border-radius: 0.25rem !important;
    padding: 0.5rem 1rem !important;
    font-size: 14px !important;
    transition: background-color 0.2s, color 0.2s !important;
  }
  
  .dropdown-menu .dropdown-item:hover,
  .dropdown-menu .dropdown-item.active,
  #theme-page-navigation .dropdown-menu .dropdown-item:hover,
  #theme-page-navigation .dropdown-menu .dropdown-item.active {
    background-color: #FFF5E6 !important;
    color: #FF8C00 !important;
  }
}

/* Mobile Navigation */
@media (max-width: 991.98px) {
  #theme-page-navigation .offcanvas-body,
  body #theme-page-navigation .offcanvas-body {
    background-color: #FFFFFF !important;
    padding: 1rem !important;
  }
  
  #theme-page-navigation .navbar-nav .nav-item {
    border-bottom: 1px solid #E2E8F0 !important;
  }
  
  #theme-page-navigation .navbar-nav .nav-link,
  body #theme-page-navigation .navbar-nav .nav-link {
    color: #4A5568 !important;
    font-size: 16px !important;
    padding: 0.75rem 1rem !important;
  }
  
  #theme-page-navigation .navbar-nav .nav-link:hover,
  #theme-page-navigation .navbar-nav .nav-link.active,
  body #theme-page-navigation .navbar-nav .nav-link:hover,
  body #theme-page-navigation .navbar-nav .nav-link.active {
    color: #FF8C00 !important;
    background-color: #FFF5E6 !important;
  }
}

/* Logo sizing */
#theme-page-navigation .logo img,
#theme-page-navigation .navbar-brand img {
  max-height: 35px !important;
  height: 35px !important;
  width: auto !important;
}

/* Push logo left and nav items right */
#theme-page-navigation .navbar-brand {
  margin-left: 0 !important;
  padding-left: 0 !important;
  align-self: center !important;
  display: flex !important;
  align-items: center !important;
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

#theme-page-navigation .navbar-nav {
  margin-left: auto !important;
  align-items: center !important;
}

#theme-page-navigation .container {
  padding-left: 0 !important;
  padding-right: 0 !important;
  display: flex !important;
  align-items: center !important;
}

/* Navbar toggler button */
#theme-page-navigation .navbar-toggler,
body #theme-page-navigation .navbar-toggler {
  border: 1px solid #E2E8F0 !important;
  padding: 0.5rem 0.75rem !important;
}

#theme-page-navigation .navbar-toggler:focus {
  box-shadow: 0 0 0 0.2rem rgba(255, 140, 0, 0.15) !important;
}

/* Navigation container spacing */
#theme-page-navigation .container,
body #theme-page-navigation .container {
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}

/*********************************************/
/* RiskScape Content & Footer Layout       */
/*********************************************/

/* Content padding */
#theme-page-main {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}

/* Ensure body is full width without horizontal scroll */
html, body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Force footer full width - override all Bootstrap container constraints */
body #theme-page-footer,
body #theme-page-footer *,
#theme-page-footer,
#theme-page-footer * {
  box-sizing: border-box !important;
}

body #theme-page-footer {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 1rem 0 !important;
  display: block !important;
  min-height: 60px !important;
}

body #theme-page-footer > div,
body #theme-page-footer .container,
body #theme-page-footer .container-fluid,
body #theme-page-footer .container-xxl {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 1rem 0 !important;
  --bs-gutter-x: 0 !important;
}


/*********************************************/
/* RiskScape Custom Styles                 */
/* Title with vertical border and hue      */
/*********************************************/

.title-vert-border {
  padding: 2px 0 3px 20px;
  border-left-width: 7px;
  border-left-style: solid;
  border-color: #FF8C00;
  margin-bottom: 30px;
}

.title-vert-border h1,
.title-vert-border h2,
.title-vert-border h3,
.title-vert-border h4 {
  margin-bottom: 0;
  margin-top: 0;
}

.title-vert-border > span {
  display: block;
  margin-top: 4px;
  color: #555;
  font-weight: 300;
}

.title-vert-border h1 + span {
  font-size: 22px;
}

.title-vert-border h2 + span {
  font-size: 19px;
}

.title-vert-border h3 + span {
  font-size: 17px;
}

.title-vert-border h4 + span {
  font-size: 15px;
  margin-top: 3px;
}

.title-vert-border-right {
  padding: 2px 20px 3px 0;
  border-left: 0;
  border-right: 7px solid #FF8C00;
  text-align: right;
}

.hue {
  color: #FF8C00;
}

/*********************************************/
/* Match Generic4 Visual Style             */
/*********************************************/

/* Change background to white like Generic4 */
:root,
[data-bs-theme="default-theme"] {
  /* Match Generic4 orange color exactly */
  --bs-primary: #ff950c !important;
  --bs-link-color: #ff950c !important;
  --bs-link-hover-color: #ff830e !important;
  
  /* White backgrounds like Generic4 */
  --theme-backdrop-bg: #FFFFFF !important;
  --bs-body-bg: #FFFFFF !important;
  --theme-page-main-bg: #FFFFFF !important;
  --theme-nav-bg: #FFFFFF !important;
  --theme-breadcrumb-bg: #F8F9FA !important;
  
  /* Generic4-style text colors */
  --bs-body-color: #333333 !important;
  --bs-nav-link-color: #555555 !important;
}

/* Larger headings like Generic4 */
h1, .h1 {
  font-size: 2.5rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

h2, .h2 {
  font-size: 2rem !important;
  font-weight: 500 !important;
}

h3, .h3 {
  font-size: 1.75rem !important;
  font-weight: 500 !important;
}

/* Generic4-style font size utilities */
.font-size-lg {
  font-size: 300% !important;
  line-height: 1.2em !important;
}

.font-size-xlg {
  font-size: 400% !important;
  line-height: 1.2em !important;
}

/* Body text like Generic4 */
body {
  font-size: 14px !important;
  color: #333 !important;
  background-color: #fff !important;
}

/* Main content area - white background */
#theme-page-main,
body #theme-page-main {
  background-color: #FFFFFF !important;
}

/* Update button colors to match Generic4 orange */
.btn-primary {
  --bs-btn-bg: #ff950c !important;
  --bs-btn-border-color: #ff950c !important;
  --bs-btn-hover-bg: #ff830e !important;
  --bs-btn-hover-border-color: #ff830e !important;
}

/* Link colors */
a {
  color: #ff950c !important;
}

a:hover {
  color: #ff830e !important;
}

/* Navigation link colors */
#theme-page-navigation .navbar-nav .nav-link {
  color: #555 !important;
}

#theme-page-navigation .navbar-nav .nav-link:hover,
#theme-page-navigation .navbar-nav .nav-link.active {
  color: #ff950c !important;
}

/* Update hue class to use Generic4 orange */
.hue {
  color: #ff950c !important;
}

/* Update title-vert-border to use Generic4 orange */
.title-vert-border {
  border-color: #ff950c !important;
}

.title-vert-border-right {
  border-right-color: #ff950c !important;
}

/* Generic4-style content containers */
.container {
  background-color: transparent !important;
}

/* Remove gray backgrounds */
.bg-light,
body .bg-light {
  background-color: #f8f9fa !important;
}

/* White cards and panels like Generic4 */
.card {
  background-color: #fff !important;
}

/*********************************************/
/* Generic4 Visual Style Matches           */
/*********************************************/

/* Generic4 Color Scheme - Exact Match */
:root,
[data-bs-theme="default-theme"] {
  /* Match Generic4 orange exactly */
  --bs-primary: #ff950c !important;
  --bs-link-color: #ff950c !important;
  --bs-link-hover-color: #ff830e !important;
  
  /* White backgrounds like Generic4 */
  --theme-backdrop-bg: #FFFFFF !important;
  --bs-body-bg: #FFFFFF !important;
  --theme-page-main-bg: #FFFFFF !important;
  --theme-nav-bg: #FFFFFF !important;
  --theme-breadcrumb-bg: #F8F9FA !important;
  
  /* Generic4-style text colors */
  --bs-body-color: #333333 !important;
  --bs-nav-link-color: #555555 !important;
}

/*********************************************/
/*********************************************/
/* Generic4 Typography & Sizes             */
/*********************************************/

/* Body text */
body {
  font-size: 14px !important;
  color: #333 !important;
  background-color: #fff !important;
}

/* Larger headings like Generic4 */
h1, .h1 {
  font-size: 2.5rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

h2, .h2 {
  font-size: 2rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

h3, .h3 {
  font-size: 1.75rem !important;
  font-weight: 500 !important;
}

/* Generic4 utility font sizes */
.font-size-lg {
  font-size: 300% !important;
  line-height: 1.2em !important;
}

.font-size-xlg {
  font-size: 400% !important;
  line-height: 1.2em !important;
}

/*********************************************/
/* Generic4 Backgrounds & Layout           */
/*********************************************/

/* Main content area - white background */
#theme-page-main,
body #theme-page-main {
  background-color: #FFFFFF !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Footer - centered container, not full width */
body #theme-page-footer {
  width: 100% !important;
  background-color: #2D3748 !important;
  padding: 2rem 0 !important;
  margin: 0 !important;
}

body #theme-page-footer .container {
  max-width: 1140px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
}

body #theme-page-footer > div,
body #theme-page-footer .py-4 {
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
  max-width: none !important;
}

/*********************************************/
/* Generic4 Button & Link Colors           */
/*********************************************/

/* Update buttons to Generic4 orange */
.btn-primary {
  --bs-btn-bg: #ff950c !important;
  --bs-btn-border-color: #ff950c !important;
  --bs-btn-hover-bg: #ff830e !important;
  --bs-btn-hover-border-color: #ff830e !important;
  --bs-btn-active-bg: #ff830e !important;
  --bs-btn-active-border-color: #ff830e !important;
}

/* Link colors */
a {
  color: #ff950c !important;
}

a:hover {
  color: #ff830e !important;
}

/* Navigation link colors */
#theme-page-navigation .navbar-nav .nav-link {
  color: #555 !important;
}

#theme-page-navigation .navbar-nav .nav-link:hover,
#theme-page-navigation .navbar-nav .nav-link.active {
  color: #ff950c !important;
}

/*********************************************/
/* Update Custom Classes to Generic4       */
/*********************************************/

/* Update hue class */
.hue {
  color: #ff950c !important;
}

/* Update title-vert-border */
.title-vert-border {
  border-color: #ff950c !important;
}

.title-vert-border-right {
  border-right-color: #ff950c !important;
}

/*********************************************/
/* Generic4 Cards & Panels                 */
/*********************************************/

.card {
  background-color: #fff !important;
  border: 1px solid #ddd !important;
}

/* Remove gray backgrounds */
.bg-light {
  background-color: #f8f9fa !important;
}

/*********************************************/
/* Container Gutter - Bootstrap Standard   */
/*********************************************/

.container {
  --bs-gutter-x: 30px !important;
  padding-left: calc(var(--bs-gutter-x) * 0.5) !important;
  padding-right: calc(var(--bs-gutter-x) * 0.5) !important;
}

/*********************************************/
/* Navigation Container                    */
/*********************************************/

#theme-page-navigation .container {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
  display: flex !important;
  align-items: center !important;
}

/*********************************************/
/* Generic4 General Element Styles         */
/*********************************************/

/* Images */
img.alignleft, div.alignleft {
  float: left;
  margin: 5px 20px 13px 0;
  max-width: 100%;
}

img.alignright, div.alignright {
  float: right;
  margin: 5px 0 13px 20px;
  max-width: 100%;
}

img {
  max-width: 100%;
  height: auto;
}

/* Lists */
ul li {
  font-size: 14px;
}

ul ul, ol ol {
  padding-left: 40px;
}

ul {
  list-style-type: disc;
}

/* Clearfix */
.clearer {
  clear: both;
  display: block;
}

/* DNN Form Label */
.dnnFormItem > label.dnnFormLabel {
  width: 35%;
}

.dnnForm label {
  font-weight: normal;
}

/* Bootstrap form fix */
form#Form {
  margin-bottom: 0px;
}

.dnnForm .dnnActions {
  padding-left: 0px;
}

/* Rounded image utility */
div.img-round img {
  border-radius: 50% !important;
}

/*********************************************/
/* Generic4 Spacing Utilities              */
/*********************************************/

/* Margin utilities */
.wsc-margin-top, .wsc-marg-top {
  margin-top: 50px;
}

.wsc-margin-top-sm, .wsc-marg-top-sm {
  margin-top: 25px;
}

.wsc-margin-top-lg, .wsc-marg-top-lg {
  margin-top: 75px;
}

.wsc-margin-top-no, .wsc-marg-top-no {
  margin-top: 0px !important;
}

.wsc-margin-bottom, .wsc-marg-bot {
  margin-bottom: 50px;
}

.wsc-margin-bottom-sm, .wsc-marg-bot-sm {
  margin-bottom: 25px !important;
}

.wsc-margin-bottom-lg, .wsc-marg-bot-lg {
  margin-bottom: 75px;
}

.wsc-margin-bottom-no {
  margin-bottom: 0px;
}

.wsc-margin-all-no, .wsc-marg-no {
  margin: 0px;
}

/* Padding utilities */
.wsc-padding-all, .wsc-pad {
  padding: 50px;
}

.wsc-padding-all-sm, .wsc-pad-sm {
  padding: 25px;
}

.wsc-padding-all-lg, .wsc-pad-lg {
  padding: 75px;
}

.wsc-padding-all-no, .wsc-pad-no {
  padding: 0px;
}

.wsc-padding-top, .wsc-pad-top {
  padding-top: 50px !important;
}

.wsc-padding-top-sm, .pad25, .wsc-pad-top-sm {
  padding-top: 25px;
}

.wsc-padding-top-lg, .wsc-pad-top-lg {
  padding-top: 75px;
}

.wsc-padding-top-xlg {
  padding-top: 150px;
}

.wsc-padding-top-no, .wsc-pad-top-no {
  padding-top: 0px;
}

.wsc-padding-bottom, .wsc-pad-bot {
  padding-bottom: 50px !important;
}

.wsc-padding-bottom-sm, .wsc-pad-bot-sm {
  padding-bottom: 25px;
}

.wsc-padding-bottom-lg, .wsc-pad-bot-lg {
  padding-bottom: 75px;
}

.wsc-padding-bottom-xlg {
  padding-bottom: 150px;
}

.wsc-padding-bottom-no, .wsc-pad-bot-no {
  padding-bottom: 0px;
}

/*********************************************/
/* Generic4 Pane Styles                    */
/*********************************************/

.wsc_pane.IntroPane, 
#intro .wsc_pane.IntroPane {
  padding-top: 30px;
  padding-bottom: 30px;
}

.wsc_pane.OutroPane {
  padding-top: 20px;
  padding-bottom: 20px;
}

.IntroPane .title {
  margin-bottom: 0px;
}

/*********************************************/
/* Generic4 Helper Classes                 */
/*********************************************/

.divcenter {
  float: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  position: relative !important;
}

.white {
  color: #fff;
}

/* Text selection colors */
::-moz-selection {
  color: #fff;
  background: #aaa;
}

::selection {
  color: #fff;
  background: #aaa;
}

/*********************************************/
/* Generic4 5-Column Grid (col-15)         */
/*********************************************/

.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
  position: relative;
  min-height: 1px;
  padding-right: 10px;
  padding-left: 10px;
}

.col-xs-15 {
  width: 20%;
  float: left;
}

@media (min-width: 768px) {
  .col-sm-15 {
    width: 20%;
    float: left;
  }
}

@media (min-width: 992px) {
  .col-md-15 {
    width: 20%;
    float: left;
  }
}

@media (min-width: 1200px) {
  .col-lg-15 {
    width: 20%;
    float: left;
  }
}

/*********************************************/
/* Proper CSS Font Hierarchy               */
/* Following standard typographic scale    */
/*********************************************/

/* Base body text */
body {
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: #333 !important;
}

/* Headings */
h1, .h1 {
  font-size: 36px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  margin-bottom: 1rem !important;
}

h2, .h2 {
  font-size: 28px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin-bottom: 0.75rem !important;
}

h3, .h3 {
  font-size: 24px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin-bottom: 0.75rem !important;
}

h4, .h4 {
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  margin-bottom: 0.5rem !important;
}

h5, .h5 {
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  margin-bottom: 0.5rem !important;
}

h6, .h6 {
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  margin-bottom: 0.5rem !important;
}

/* Paragraphs and regular text */
p {
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 1rem !important;
}

/* List items */
ul li, ol li {
  font-size: 14px !important;
  line-height: 1.6 !important;
}

/* Spans inherit parent font size by default */
span {
  font-size: inherit !important;
}

/* Buttons */
.btn, button {
  font-size: 14px !important;
  font-weight: 500 !important;
}

/* Small text */
small, .small {
  font-size: 12px !important;
}

/* Dashboard specific overrides */
.dashboard-title { font-size: 36px !important; font-weight: 700 !important; }
.dashboard-subtitle { font-size: 18px !important; font-weight: 400 !important; }
.dashboard-card-value { font-size: 48px !important; font-weight: 700 !important; }
.dashboard-card-title-bold { font-size: 15px !important; font-weight: 600 !important; }
.dashboard-card-period { font-size: 10px !important; font-weight: 400 !important; }
.dashboard-card-change-text { font-size: 16px !important; font-weight: 600 !important; }
.company-filter-label { font-size: 16px !important; font-weight: 500 !important; }
.card-title { font-size: 18px !important; font-weight: 500 !important; }


/*********************************************/
/* Force Full Width Layout                 */
/* Override SCSS compiled constraints      */
/*********************************************/

/* Make main content area full width */
body.theme-variation-default main#theme-page-main,
body.theme-variation-centered main#theme-page-main,
body.theme-variation-floatwideheader main#theme-page-main {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Make footer full width */
body.theme-variation-default footer#theme-page-footer,
body.theme-variation-centered footer#theme-page-footer,
body.theme-variation-floatwideheader footer#theme-page-footer {
  max-width: 100% !important;
  width: 100% !important;
}

/* Ensure ContentPane doesn't have width constraints */
#ContentPane {
  max-width: 100% !important;
  width: 100% !important;
}

/* Angular modules use full width */
.angular-module {
  max-width: 100% !important;
  width: 100% !important;
}

/*********************************************/
/* PersonaBar Visibility Compensation      */
/*********************************************/

/* When PersonaBar is visible (admin logged in), compensate for the 80px left margin */
body.personabar-visible {
  margin-left: 0 !important;
}

body.personabar-visible #personaBar-iframe {
  position: fixed !important;
  left: 0 !important;
  top: 0 !important;
  z-index: 10000 !important;
}

body.personabar-visible main#theme-page-main,
body.personabar-visible nav#theme-page-navigation,
body.personabar-visible footer#theme-page-footer {
  margin-left: 80px !important;
  width: calc(100% - 80px) !important;
}

body.personabar-visible .angular-module {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* ======================================================= */
/* FINAL FIXES: Top Pane, Navigation & Layout             */
/* ======================================================= */

/* 1. Fix "White Space" caused by Skip Link */
a.visually-hidden-focusable {
    position: absolute !important;
    top: 0;
    left: 0;
    height: 1px; width: 1px;
    overflow: hidden;
}

/* 2. Top Pane: Light Gray, Slim, Side-by-Side Links */
#theme-page-header-pane,
body #theme-page-header-pane {
    background-color: #F8F9FA !important; /* Light Gray Background */
    margin-top: 0 !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    min-height: 0 !important;
    height: auto !important;
    border-bottom: 1px solid #E2E8F0 !important; /* Thin darker border */
}

/* Ensure items sit side-by-side */
#theme-page-header-pane .user-controls {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
}

/* 3. Top Pane Text Style: Match Nav Items (#555555) */
#theme-page-header-pane .user-controls a,
#theme-page-header-pane .user-controls span {
    color: #555555 !important; /* Match Nav Item Color */
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important; /* Match Nav Style */
    letter-spacing: 0.5px !important;
    text-decoration: none !important;
    margin-left: 15px !important; /* Space between links */
}

/* Remove margin from first link to keep it flush right */
#theme-page-header-pane .user-controls a:first-child {
    margin-left: 0 !important;
}

/* Hover effect: Brand Orange */
#theme-page-header-pane a:hover {
    color: #ff950c !important; /* Brand Orange */
}

/* 4. Navigation Bar: Dark Grey & White Links */
#theme-page-navigation,
body #theme-page-navigation {
    background-color: #1a1a1a !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4) !important;
}

#theme-page-navigation .navbar-nav .nav-link {
    color: #FFFFFF !important;
}

#theme-page-navigation .navbar-nav .nav-link:hover,
#theme-page-navigation .navbar-nav .nav-link.active {
    color: #FF8C00 !important;
    background-color: rgba(255,255,255,0.05) !important;
}

/* 5. Mobile Toggle (Hamburger) - Make White */
#theme-page-navigation .navbar-toggler {
    border-color: rgba(255,255,255,0.5) !important;
}
#theme-page-navigation .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

/* Prevent the Display Name (Omen Apstory) from breaking into two lines */
#theme-page-header-pane .user-controls a, 
#theme-page-header-pane .user-name {
    white-space: nowrap !important;
    display: inline-block !important;
}

/* ======================================================= */
/* Action Buttons:              */
/* ======================================================= */


 .dnnPrimaryAction,
     input.dnnPrimaryAction {
         color: whitesmoke !important;
     }
/*********************************************/
/* FullWidePane - Edge-to-Edge Layout      */
/*********************************************/

/* FullWidePane - No container constraints */
#FullWidePane {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Ensure modules in FullWidePane span full width */
#FullWidePane .DnnModule,
#FullWidePane > div {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Angular modules in FullWidePane */
#FullWidePane app-root,
#FullWidePane .angular-module {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
}

/* Override Bootstrap container in FullWidePane */
#FullWidePane .container,
#FullWidePane .container-fluid {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Kendo Grid full width in FullWidePane */
#FullWidePane kendo-grid,
#FullWidePane .k-grid {
  width: 100% !important;
  max-width: 100% !important;
}

