/*!
 *
 * DecisionVault specific CSS
 *
 */

[x-cloak] {
    display: none !important;
}

.htmx-indicator {
    display: none;
}

.htmx-request .hxfeedback {
    display: inline;
}

.htmx-request.hxfeedback {
    display: inline;
}

/* HTMX Tab Transitions - Smooth fade effect */
#matter-tabs {
    transition: opacity 0.2s ease-in-out;
}

/* Fade out when swapping */
#matter-tabs.htmx-swapping {
    opacity: 0;
}

/* Start invisible when settling */
#matter-tabs.htmx-settling {
    opacity: 0;
}

/* Fade in after settled */
#matter-tabs.htmx-settled {
    opacity: 1;
}

.dv-constrain-message {
    max-width: 850px;
}

.dv-constrain-intake-card {
    max-width: 1250px;
}

.dv-underline {
    text-decoration: underline;
}

.dv-form-error {
    color: red;
    font-size: 80%;
}

.clickable {
    cursor: pointer;
}

.topline {
    border-top: 1px solid #eee;
    margin-top: 5px;
    padding-top: 10px;
}

.dv-logo-sign {
    height: 30px;
    width: 30px;
}

.left-table-edge {
    border-left: solid 1px #d8dbe0;
}

.left-table-edge-summary {
    border-left: solid 2px #1f1f20;
}

.summary-box {
    background-color: #1f1f20;
    color: #ffffff;
    border-top: solid 1px #1f1f20;
    border-bottom: solid 1px #1f1f20;
}

/* Ensure black top border for summary box in table header */
.table th.summary-box {
    border-top-color: #1f1f20 !important;
}

.right-table-edge {
    border-right: solid 1px #d8dbe0;
}

.counter-block {
    width: 50px;
}

.time-width {
    width: 200px;
}

.lower-label {
    font-size: 80%;
    padding-left: 10px;
}

.constrain-role-box {
    border: 1px solid #d8dbe0;
    max-width: 800px;
    border-radius: 0.25rem;
}

.geography-selector {
    border: 1px solid #dedede;
    border-radius: 0.25rem;
}

.validation-error {
    color: red;
    font-size: 80%;
    display: block;
}

.read-only-field {
    background-color: #fafafc;
}

.floating-menu {
    z-index: 100;
    position: fixed;
    right: 10px
}

.dv-floating-menu
{
    z-index: 100;
    position: fixed;
}

.dv-right-menu-content
{
    position: absolute;
    right: 0px;
}

.wide-col {
  width: 40%;
}

.constrain-card {
    max-width: 1200px;
}

@media screen and (min-width: 2560px) {

    .dv-floating-menu
    {
        max-width: 577px;
    }
}

.constrain-menu {
  max-width: 650px;
}

.button-normal {
  width: 360px;
}

.button-counted {
  width: 300px;
}

/* Financial intake toggle switches - visible unchecked state */
.financial-intake-switch .c-switch-slider {
  background-color: #ebedef;
}

/* Email template HTMX button loading states */
#btn-action .btn-loading-label { display: none; }
#btn-action.htmx-request .btn-action-label { display: none; }
#btn-action.htmx-request .btn-loading-label { display: inline; }

/* Default links */
.feed-tabs .nav-link {
    color: #636f83;
}

/* Active tab */
.feed-tabs .nav-item.active .nav-link {
    color: #39f !important;
}


.feed-tabs .nav-item hr {
    border: 1px solid #d8dbe0 !important;
}


.feed-tabs .nav-item.active hr {
    border-color: #39f !important;
}

/* Badge */
.feed-tabs .nav-item .nav-link .badge{
    background-color: #636f83; /* bg-dark */
    color: #fff;
    font-weight: normal;
}

.feed-tabs .nav-item.active .nav-link .badge{
    background-color: #39f; /* bg-info */
}

/* Responsive width utility: auto on md+ (Bootstrap 4 lacks w-md-auto) */
@media (min-width: 768px) {
    .w-md-auto {
        width: auto !important;
    }
}

/* Mobile: ensure native <select> dropdowns inside intake modals have room
   to open downward, so Android Chrome doesn't flip the OS picker far above
   the trigger. Modal body scrolls the focused field upward via this margin. */
@media (max-width: 767.98px) {
    .modal-body .custom-select {
        scroll-margin-bottom: 50vh;
    }
}

/* Matter Progress stage arrows - chevron shapes via clip-path */
.stage-arrow {
  clip-path: polygon(0% 0%, calc(100% - 14px) 0%, 100% 50%, calc(100% - 14px) 100%, 0% 100%, 14px 50%);
}
.stage-arrow:first-child {
  clip-path: polygon(0% 0%, calc(100% - 14px) 0%, 100% 50%, calc(100% - 14px) 100%, 0% 100%);
}
.stage-arrow:last-child {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 14px 50%);
}
.stage-arrow:only-child {
  clip-path: none;
}

/* Matter Progress table column widths */
.matter-stages-col-date {
  width: 150px;
}
.matter-stages-col-matter {
  width: 30%;
}
.matter-stages-col-submitted {
  width: 120px;
}


/* Matter Progress — Assigned-to filter (mockup-specification) */
.matter-stages-filter {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #5C6873;
  margin-left: auto;
}
.matter-stages-filter label {
  margin: 0;
}
.matter-stages-assigned-select {
  padding: 5px 10px;
  border: 1px solid #c8ced3;
  border-radius: 6px;
  font-size: 13px;
  color: #5C6873;
  background: #fff;
}
.matter-stages-assigned-select:disabled {
  background: #f8f9fa;
  cursor: not-allowed;
}

.peoplebox-contact-card .peoplebox-remove-x {
  visibility: hidden;
}
.peoplebox-contact-card:hover .peoplebox-remove-x,
.peoplebox-contact-card:focus-within .peoplebox-remove-x {
  visibility: visible;
}
/* Bootstrap 4 lg breakpoint: always show on screens below 992px (touch/no-hover) */
@media (max-width: 991.98px) {
  .peoplebox-contact-card .peoplebox-remove-x {
    visibility: visible;
  }
}