/* ============================================================
   Power Platform / Power Pages – Custom CSS for DPOR
   
   File: DPOR_PublicPortal_Theme.css
   Loaded AFTER bootstrap.min.css, theme.css, portalbasictheme.css
   ============================================================ */


/* ============================================================
   1. Global Styles
   ============================================================ */

/* Accessibility: increase logo size for legibility */
img.logo {
    height: 120px !important;
    width: auto !important;
    margin: 0 10px !important;
}

/* --- Accessible disabled state for primary buttons --- */
button.submit-btn[disabled],
input.submit-btn[disabled] {
    background-color: #003A70 !important; /* dark blue, high contrast */
    color: #ffffff !important;
    opacity: 1 !important; /* Power Pages dims disabled buttons, undo that */
}

/* --- Accessible disabled state for secondary buttons (Previous) --- */
button.previous-btn[disabled],
input.previous-btn[disabled] {
    background-color: #6B6B6B !important; /* dark gray, WCAG compliant */
    color: #ffffff !important;
    opacity: 1 !important;
}

/* Fix wrapping on the 'Confirm password' text under the known container ID */
#ContentContainer_MainContent_MainContent_ConfirmPasswordLabel .xrm-attribute-value {
  word-break: normal;        /* don't break inside words */
  overflow-wrap: break-word; /* allow safe breaks for long tokens */
  white-space: normal;       /* standard wrapping */
  hyphens: auto;             /* optional hyphenation */
}


/* Default: no banner */
.entity-form::before {
    content: none;
}

/* Show banner only if ANY of these required markers are present */
.entity-form:has(
  input[required],
  select[required],
  textarea[required],
  span.required,
  [aria-required="true"],
  .required,
  .required-field,
  .field-required,
  .fa-asterisk
)::before,
form:has(
  label.required
)::before {
    content: "* = Required field";
    display: block;
    color: #c0392b;
    font-weight: 400;
    font-size: 0.85em;
    margin-bottom: 8px;
}

.entity-grid .view-grid:has(tbody), .subgrid .view-grid:has(tbody) {
    min-height: 180px;
}

/*Fixes the Subgrid Menu overflowing the single row in the table*/
.entity-grid .view-grid:has(tbody), .subgrid .view-grid:has(tbody) {
    min-height: 160px;
}

/*Troubleshooting this with Home screen - if i disable the min-height in browser tools it fixes issue*/
.wrapper-body {
  min-height:auto;
  margin-bottom: 0px;
}

/*Allows the multi-step form steps to scroll at tablet resolutions*/
.progress.list-group.top{
    overflow-x: auto;
}

/*Fix for spacing on Login Form - need to combine with a col-md-12 col-lg-6 modification to the wrapping div*/
#submit-signin-local.btn{
 margin-bottom:8px;  
 margin-top: 8px;
}

/*Removes vertical spacing on spacer elements*/
.clearfix.cell{
  padding:0 12px 0px 12px;
}

/*Applies standard padding around top and bottom of labels*/
.field-label{
  padding-top: 8px;
  padding-bottom:8px;

}

/*Eliminate bottom spacing on page around form view*/
.crmEntityFormView .actions, .crmEntityFormView .tab, .crmEntityFormView fieldset{
  margin:0px;
}

/*Add slight padding to bottom of instructions*/
.instructions{
  padding-bottom: 12px;
}

/*Eliminate bottom spacing on custom action container*/
.form-custom-actions{
  margin-bottom:0px;
}

/*Fix spacing on Modal Action Container*/
.form-action-container-left{
  padding:12px;

}

/*Reduces Margin on Alert Block*/
.alert.alert-block{
    margin-bottom:0;
}

/*Makes subnavigation menu text larger*/
ul.navbar-nav li ul li a{
    font-size:18px;
}

/*Adds minor margin to refresh button icon since space not working*/
.fa-refresh, .fa-trash-can{
    margin-right: 5px;
}

/*Fixes margin at bottom of file attachment button on modal*/
.btn-for-file-input{
    margin-bottom:12px;
}


/* ============================================================
   2. Responsive breakpoints
   ------------------------------------------------------------
   Bootstrap / Power Pages breakpoints (min-width):
   - xs: < 576px   (phones)
   - sm: ≥ 576px   (large phones)
   - md: ≥ 768px   (TABLETS – most Power Pages issues)
   - lg: ≥ 992px   (small laptops)
   - xl: ≥ 1200px  (desktops)
   ============================================================ */

/* ============================================================
   Phones (< 768px)
   ============================================================ */
@media (max-width: 767px) {
    
    /*Allows container to use full screen width at lower resolutions*/
    .container, .container-sm {
        max-width: 100%;
    }

    .crmEntityFormView .cell{
      margin-bottom:0px;
    }
}

/* ============================================================
   Tablets and Smaller (< 992px)
   ============================================================ */
@media (max-width: 991px) {

    /*Forces form fields to render on full line when on tablets or smaller*/
    .crmEntityFormView table.section, .crmEntityFormView table.section>tbody, .crmEntityFormView table.section>tbody>tr, .crmEntityFormView table.section>tbody>tr>td, .crmEntityFormView table.section>tbody>tr>th, .crmEntityFormView table.section>tfoot, .crmEntityFormView table.section>tfoot>tr, .crmEntityFormView table.section>tfoot>tr>td, .crmEntityFormView table.section>tfoot>tr>th, .crmEntityFormView table.section>thead, .crmEntityFormView table.section>thead>tr, .crmEntityFormView table.section>thead>tr>td, .crmEntityFormView table.section>thead>tr>th 
    {
        display: block;
    }

    /*.crmEntityFormView{
        padding-top:12px;
    }*/

    .entity-form h3{
        margin-left: 0px;
    }

}
/* ============================================================
   Small Laptops and Larger (>= 992px)
   ============================================================ */
 @media (min-width: 992px) {
    /*Change default size of modal at laptop and larger width*/
        .modal {
        --bs-modal-width: 800px;
    }
}


/* ============================================================
   3. Targeted overrides
   ============================================================ */

/*Fixes for wrapping behaviors on system screens like Profile Page*/
body{
    height:auto !important;
    max-height:none;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/*Fix extra spacing around pagination*/
.pagination{
  margin-top:0px !important;
  padding-top:8px;
  padding-bottom:8px;
}
 /* Fixes consistency issues around action spacing*/
  .actions{
    padding:12px !important;
}

/*Attaches footer to bottom of page*/
footer, .footer-bottom, .footer{
    margin-top: auto !important;
}

tr:has(#dpor_formstepcompleted_startinginformation),
tr:has(#dpor_formstepcompleted_personalinformation),
tr:has(#dpor_formstepcompleted_criminalconviction),
tr:has(#dpor_formstepcompleted_disciplinaryaction)
 {
  display: none !important;
}

#dpor_body_richtext_100kchar_render {
  overflow-wrap: anywhere;   /* or break-word — both are safe */
  word-break: normal;
  hyphens: manual;           /* explicitly prevents auto-hyphenation */
}