html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

.wider-page-margin {
  width: 95%;            /* Use 90% of the viewport width */
  padding-left: 15px;
  padding-right: 15px;
}
table#requestPacketsTable {
    width: 100%; /* table takes full width of container */
}

.location-column {
    min-width: 350px; /* ensures column is at least this wide */
    max-width: 500px; /* optional, prevents it from getting huge */
    white-space: normal; /* allows line breaks */
}

.case-name-column {
    min-width: 400px; /* adjust as needed */
    max-width: 500px; /* optional */
    white-space: normal; /* allow text wrap */
}

.tracking-details-column {
    min-width: 350px;
    white-space: normal;
}

/* small red dot shown next to subject for unhandled emails */
.unhandled-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #dc3545; /* bootstrap danger */
    margin-right: .35rem;
    vertical-align: middle;
}

/* optional row cue */
tr.unhandled {
    background-image: linear-gradient(to right, rgba(220,53,69,.06), transparent);
}

/* chip used in details header */
.chip {
    display: inline-block;
    padding: .125rem .5rem;
    border-radius: 1rem;
    font-size: .75rem;
    line-height: 1;
    border: 1px solid transparent;
}

.chip-unhandled {
    background: #fff5f5;
    color: #b02a37;
    border-color: #f1aeb5;
}

.chip-handled {
    background: #eef7ff;
    color: #055160;
    border-color: #9eeaf9;
}

/* Make the table header stick to the top of the scroll area */
#holds-scroll thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--bs-body-bg);
}

/* Optional: soften the scrollbar on Windows */
.holds-list-wrapper {
    scrollbar-gutter: stable;
}

.holds-list-wrapper {
    max-height: calc(100vh - 190px);
}

@media (min-width: 768px) {
    .holds-list-wrapper {
        max-height: calc(100vh - 150px);
    }
}

/* Sticky table header (generic) */
.inbound-email-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--bs-body-bg);
}

/* Soften scrollbars on Windows */
.holds-list-wrapper {
    scrollbar-gutter: stable;
}

.inbound-email-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--bs-body-bg);
}

.inbound-split {
    height: calc(100vh - 170px);
}

@media (max-width: 991.98px) {
    .inbound-split {
        height: auto;
    }
}

#inboundDetailsModal .modal-dialog {
    max-width: 1100px; /* adjust as you like */
}
/* Gentle border + radius like cards */
#inboundDetailsModal .modal-content {
    border: 1px solid #dee2e6;
    border-radius: .75rem;
}
/* Make sure content doesn't touch edges */
#inboundDetailsModal .modal-body {
    padding: 1rem; /* remove p-0 from markup if you had it */
}

/* Highlight hovered row (apply background to each cell so it looks correct with Bootstrap tables) */
#trackingStepLogTable tbody tr:hover > * {
    background-color: rgba(13,110,253,.08); /* tweak to taste */
}

/* Optional: smoother feel */
#trackingStepLogTable tbody tr > * {
    transition: background-color .12s ease-in-out;
}

.container.wider-page-margin {
    max-width: 95vw; /* 95% of viewport width */
}
/* Force white text on secondary buttons (fixes <a class="btn btn-secondary"> too) */
.rs-theme .btn-secondary,
.rs-theme .btn-secondary:hover,
.rs-theme .btn-secondary:focus,
.rs-theme .btn-secondary:active,
.rs-theme .btn-secondary.active,
.rs-theme .show > .btn-secondary.dropdown-toggle,
.rs-theme .btn-secondary:disabled,
.rs-theme .btn-secondary.disabled {
    color: #fff !important;
}

    /* If you have icons/spans inside the button */
    .rs-theme .btn-secondary * {
        color: #fff !important;
    }
