/*
 * Shared table look for list tables (.bt-table): header band, rows, labelled action buttons, status dots, people, chips.
 * Used by the building page tabs (Fee Proposals, Scope of Works, Audit Reports, Report Templates, Quoted Works,
 * ESM Schedule, Notes, Files, Users) and by the same tables on their own pages (notes, files, audit reports, quoted works),
 * so it is loaded for every page in layout/header.blade.php and layout/header-vue.blade.php.
 * Colours follow layout-ui.css (accent #5b4fc7 / tint #eeecfb / text #3d3c4a / border #e3e4ea).
 * Spacing that only applies inside the building page tabs stays in building_details.css.
 */

.bt-table .bt-actions-cell {
    white-space: normal;
    min-width: 160px;
    vertical-align: middle;
}

.bt-table table.table {
    border-collapse: separate;
    border-spacing: 0;
    background-color: #fff;
}

.bt-table table.table thead th:first-child {
    border-radius: 6px 0 0 6px;
}

.bt-table table.table thead th:last-child {
    border-radius: 0 6px 6px 0;
}

.bt-table table.table thead th {
    padding: 13px 16px;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #3d3c4a !important;
    letter-spacing: 0.01em;
    text-align: left;
    vertical-align: middle;
    background-color: #f4f5f9;
    border-top: 0;
    border-bottom: 0;
}

.bt-table table.table tbody {
    background-color: #fff;
}

.bt-table table.table tbody td {
    padding: 14px 16px;
    text-align: left; /* the theme centres the last column */
    color: #3d3c4a;
    opacity: 1;
    vertical-align: middle !important;
    border-top: 0;
    border-bottom: 1px solid #eef0f6;
}

.bt-table table.table tbody tr:last-child td {
    border-bottom: 0;
}

.bt-table table.table tbody tr:hover td {
    background-color: #faf9fe;
}

/* two-line cells: main value + a small grey line under it (proposal number, end date hint) */
.bt-table .bt-main {
    display: block;
    color: #3d3c4a;
}

.bt-table .bt-sub {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    line-height: 1.3;
    color: #8a8b9c;
}

.bt-table .bt-sub--warn {
    color: #c62f4b;
    font-weight: 600;
}

/* free-text note: one line, cut with an ellipsis (full text in the title tooltip) */
.bt-table .bt-note {
    display: block;
    max-width: 360px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #5f5e70;
}

/* ---------- shared bits for the other building tab tables (Quoted Works, ESM Schedule, Notes, Files, Users) ---------- */
/* action cells in tables that still use the generic actions_column class */
.bt-table td.actions_column {
    white-space: normal;
    min-width: 160px;
}

/* main (filled) button first and delete always last, whatever order the markup has */
.bt-table .bt-actions .bt-action--primary {
    order: -1;
}

.bt-table .bt-actions .bt-action--danger {
    order: 99;
}

/* placeholder buttons (no permission): greyed, not clickable */
.bt-table .bt-action.disabled,
.bt-table .bt-action.disabled:hover,
.bt-table .bt-action.disabled i {
    color: #a6acbe;
    background-color: #f6f7fa;
    border-color: #eef0f6;
    cursor: not-allowed;
    opacity: 1;
}

/* sent (Quoted Works email) */
.bt-table .bt-action--done,
.bt-table .bt-action--done i {
    color: #0f7a66;
}

.bt-table .bt-action--done {
    background-color: #e3f8f4;
    border-color: #b6ece2;
}

/* user photos next to names */
.bt-table .avatar-xsmall {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    object-fit: cover;
    vertical-align: middle;
}

/* note tags as grey chips */
.bt-table .label.label-outline-default {
    display: inline-block;
    margin: 2px 4px 2px 0;
    padding: 3px 9px;
    font-size: 12px;
    font-weight: 500;
    color: #5f5e70;
    background-color: #f0f1f5;
    border: 0;
    border-radius: 12px;
}

/* links in cells (note titles, file names) */
.bt-table table.table tbody td > a:not(.btn) {
    color: #3d3c4a;
    font-weight: 500;
}

.bt-table table.table tbody td > a:not(.btn):hover {
    color: #5b4fc7;
    text-decoration: underline;
}

/* small tag (months in Scope of Works) */
.bt-table .bt-chip {
    display: inline-block;
    margin: 2px 4px 2px 0;
    padding: 3px 9px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    color: #5b4fc7;
    background-color: #eeecfb;
    border-radius: 12px;
}

.bt-table .bt-empty {
    color: #a6acbe;
}

/* people: initials + name */
.bt-table .bt-person {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.bt-table .bt-initials {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #5b4fc7;
    background-color: #eeecfb;
    border-radius: 50%;
}

/* Active Status: pill instead of a solid bootstrap button; "To be Actioned" stays a link to the approval page */
.bt-table .btn.bt-pill {
    display: inline-flex;
    align-items: center;
    height: 26px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
    border-radius: 13px;
    box-shadow: none;
    opacity: 1;
}

.bt-table .btn.bt-pill.btn-warning { color: #9a4d00; background-color: #fff1e0; border-color: #ffd9ad; }
.bt-table .btn.bt-pill.btn-primary { color: #5b4fc7; background-color: #eeecfb; border-color: #d6d2f5; }
.bt-table .btn.bt-pill.btn-success { color: #0f7a66; background-color: #e3f8f4; border-color: #b6ece2; }
.bt-table .btn.bt-pill.btn-danger  { color: #b0263f; background-color: #fdecef; border-color: #f5c2cc; }

.bt-table .btn.bt-pill.btn-primary:not(.disabled):hover {
    color: #fff;
    background-color: #5b4fc7;
    border-color: #5b4fc7;
}

/* Status (stage): dot + words */
.bt-table .bt-stage {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
    color: #3d3c4a !important; /* the theme's .avatar--* classes add a tinted box and coloured text */
    width: auto;
    height: auto;
    padding: 0;
    background: none !important;
    border: 0;
    cursor: default;
}

.bt-table .bt-stage::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #a6acbe;
    box-shadow: 0 0 0 3px #f0f1f5;
}

.bt-table .bt-stage.avatar--orange::before { background-color: #ff8718; box-shadow: 0 0 0 3px #fff1e0; }
.bt-table .bt-stage.avatar--blue::before   { background-color: #6772e5; box-shadow: 0 0 0 3px #e9ebfc; }
.bt-table .bt-stage.avatar--green::before  { background-color: #24d2b5; box-shadow: 0 0 0 3px #e3f8f4; }
.bt-table .bt-stage.avatar--red::before    { background-color: #e5486a; box-shadow: 0 0 0 3px #fdecef; }
/* audit report statuses */
.bt-table .bt-stage.avatar--lime::before       { background-color: #84cc16; box-shadow: 0 0 0 3px #f0fadc; }
.bt-table .bt-stage.avatar--gray::before       { background-color: #8a8b9c; box-shadow: 0 0 0 3px #f0f1f5; }
.bt-table .bt-stage.avatar--dark-green::before { background-color: #0f7a66; box-shadow: 0 0 0 3px #dff3ee; }
.bt-table .bt-stage.avatar--black::before      { background-color: #3d3c4a; box-shadow: 0 0 0 3px #ececf1; }

/* header cells that are links (sort links, "Action" in Audit Reports) */
.bt-table table.table thead th a {
    color: inherit !important;
}

/* end date (a button that extends it on active proposals): readable even when disabled */
.bt-table table.table tbody td.defect_col_title > button {
    display: block;
    padding: 0;
    font-size: inherit;
    line-height: inherit;
    color: #3d3c4a;
    border: 0;
    opacity: 1;
}

/* load-more footer: no empty band under the last row when there is nothing more to load */
.bt-table table.table tfoot td {
    padding: 0;
    border: 0;
}

.bt-table .bt-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.bt-table .bt-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: auto;
    height: 30px;
    margin: 0;
    padding: 0 11px;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    color: #3d3c4a;
    background-color: #fff;
    border: 1px solid #e3e4ea;
    border-radius: 6px;
    box-shadow: none;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.bt-table .bt-action i {
    font-size: 13px;
    color: #5f5e70;
}

.bt-table .bt-action:hover {
    color: #5b4fc7;
    background-color: #eeecfb;
    border-color: #d6d2f5;
}

.bt-table .bt-action:hover i {
    color: #5b4fc7;
}

.bt-table .bt-action:focus-visible {
    outline: 2px solid #5b4fc7;
    outline-offset: 2px;
}

/* the client-facing proposal: the one filled button in the row */
.bt-table .bt-action--primary,
.bt-table .bt-action--primary i {
    color: #fff;
}

.bt-table .bt-action--primary {
    background-color: #5b4fc7;
    border-color: #5b4fc7;
}

.bt-table .bt-action--primary:hover,
.bt-table .bt-action--primary:hover i {
    color: #fff;
}

.bt-table .bt-action--primary:hover {
    background-color: #4a3fb0;
    border-color: #4a3fb0;
}

.bt-table .bt-action--danger,
.bt-table .bt-action--danger i {
    color: #c62f4b;
}

.bt-table .bt-action--danger:hover {
    color: #c62f4b;
    background-color: #fdecef;
    border-color: #f5c2cc;
}

.bt-table .bt-action--danger:hover i {
    color: #c62f4b;
}

/* actions that do not apply to this proposal (signed, inactive...) */
.bt-table .bt-action:disabled,
.bt-table .bt-action:disabled:hover {
    color: #a6acbe;
    background-color: #f6f7fa;
    border-color: #eef0f6;
    cursor: not-allowed;
    opacity: 1;
}

.bt-table .bt-action:disabled i {
    color: #a6acbe;
}

@media (prefers-reduced-motion: reduce) {
    .bt-table .bt-action {
        transition: none;
    }
}

/* ---------- Add buttons ("New fee proposal", "New note", "Upload file" ...): top right of the page, was a round "+" image ---------- */
.bt-add-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 18px 0 14px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    color: #fff;
    background-color: #5b4fc7;
    border: 1px solid #5b4fc7;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(91, 79, 199, 0.25);
    cursor: pointer;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.bt-add-btn i {
    font-size: 13px;
}

.bt-add-btn:hover {
    background-color: #4a3fb0;
    border-color: #4a3fb0;
    box-shadow: 0 4px 12px rgba(91, 79, 199, 0.30);
}

.bt-add-btn:focus-visible {
    outline: 2px solid #5b4fc7;
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .bt-add-btn {
        transition: none;
    }
}

/* ---------- secondary page button next to the add button (Portfolio "Archived Buildings") ---------- */
.bt-page-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 16px 0 14px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    color: #3d3c4a;
    background-color: #fff;
    border: 1px solid #e3e4ea;
    border-radius: 8px;
    vertical-align: middle;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.bt-page-btn i {
    font-size: 13px;
    color: #5f5e70;
}

.bt-page-btn:hover,
.bt-page-btn:hover i {
    color: #5b4fc7;
}

.bt-page-btn:hover {
    background-color: #eeecfb;
    border-color: #d6d2f5;
    text-decoration: none;
}

.bt-page-btn:focus-visible {
    outline: 2px solid #5b4fc7;
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .bt-page-btn {
        transition: none;
    }
}

/* ---------- list search box above a .bt-table (misc/list-search-box with $look = 'bt'; Portfolio) ----------
   same height, radius, border and purple focus as the page buttons; the default Vuetify look stays for Clients */
.list-search-box.list-search-box--bt {
    height: 40px;
    padding: 0 12px;
    background-color: #fff;
    border: 1px solid #e3e4ea;
    border-radius: 8px;
    box-shadow: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.list-search-box.list-search-box--bt:hover {
    border-color: #d6d2f5;
}

.list-search-box.list-search-box--bt:focus-within {
    border-color: #5b4fc7;
    box-shadow: 0 0 0 3px #eeecfb;
}

.list-search-box.list-search-box--bt i {
    margin-right: 8px;
    font-size: 18px;
    color: #8a8b9c;
}

.list-search-box.list-search-box--bt:focus-within i {
    color: #5b4fc7;
}

.list-search-box.list-search-box--bt input {
    font-size: 14px;
    color: #3d3c4a;
}

.list-search-box.list-search-box--bt input::placeholder {
    color: #a6acbe;
}

@media (prefers-reduced-motion: reduce) {
    .list-search-box.list-search-box--bt {
        transition: none;
    }
}

/* ---------- list page card (Portfolio): search box and .bt-table in one white card, like the building page tabs ---------- */
.bt-list-card {
    margin-bottom: 20px;
    padding: 20px;
    background-color: #fff;
    border: 1px solid #eef0f6;
    border-radius: 10px;
}

.bt-list-card .list-search-row {
    margin-bottom: 16px;
}

/* the table card inside: no second box, no extra padding */
.bt-list-card > .card,
.bt-list-card .bt-table.card {
    margin-bottom: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.bt-list-card .bt-table > .card-body {
    padding: 0;
}

/* the theme pads .list-table-wrapper by 20px: the table lines up with the search box and the card padding instead */
.bt-list-card .bt-table .table-responsive {
    padding: 0;
}

/* ---------- pagination (misc/bt-pagination.blade.php): "Showing 1–50 of 711" left, Previous / pages / Next right ---------- */
.bt-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.bt-pagination__info {
    font-size: 13px;
    color: #8a8b9c;
}

.bt-pagination__info strong {
    font-weight: 600;
    color: #3d3c4a;
}

.bt-pagination__pages {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.bt-pagination .bt-page {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    color: #3d3c4a;
    background-color: #fff;
    border: 1px solid #e3e4ea;
    border-radius: 6px;
    text-decoration: none;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.bt-pagination .bt-page i {
    font-size: 11px;
}

.bt-pagination a.bt-page:hover {
    color: #5b4fc7;
    background-color: #eeecfb;
    border-color: #d6d2f5;
}

.bt-pagination a.bt-page:focus-visible {
    outline: 2px solid #5b4fc7;
    outline-offset: 2px;
}

.bt-pagination .bt-page.active {
    color: #fff;
    background-color: #5b4fc7;
    border-color: #5b4fc7;
    font-weight: 600;
}

.bt-pagination .bt-page.disabled {
    color: #a6acbe;
    background-color: #f6f7fa;
    border-color: #eef0f6;
    cursor: not-allowed;
}

.bt-pagination .bt-page--gap {
    min-width: 24px;
    padding: 0 4px;
    color: #8a8b9c;
    background: none;
    border: 0;
}

/* phones: only the numbers and arrows, the Previous / Next words go */
@media (max-width: 575px) {
    .bt-pagination {
        justify-content: center;
    }

    .bt-pagination .bt-page--nav {
        font-size: 0;
    }

    .bt-pagination .bt-page--nav i {
        font-size: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bt-pagination .bt-page {
        transition: none;
    }
}

/* ---------- list page header card (Portfolio / Managed: pages/buildings/components/misc/heading.blade.php) ----------
   white card like the building page header: icon, title, breadcrumb on the left, page buttons on the right */
.row.page-titles.bt-page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 20px;
    margin: 0 0 10px !important; /* + the 10px under the (hidden) stats panel = one 20px gap above the list card */
    padding: 14px 20px !important;
    background-color: #fff;
    border: 1px solid #eef0f6;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(30, 30, 60, 0.06);
}

.row.page-titles.bt-page-header > [class*="col-"] {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    padding: 0 !important;
}

.row.page-titles.bt-page-header > #list-page-actions-container {
    margin-left: auto;
}

.bt-page-header__title {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.bt-page-header__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    font-size: 19px;
    color: #5b4fc7;
    background-color: #eeecfb;
    border-radius: 10px;
}

.bt-page-header__text {
    min-width: 0;
}

.bt-page-header__heading {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    color: #2b2a3a;
}

.bt-page-header__crumbs {
    display: flex;
    flex-wrap: wrap;
    margin: 3px 0 0;
    padding: 0;
    list-style: none;
    font-size: 13px;
    line-height: 1.4;
    color: #8a8b9c;
}

.bt-page-header__crumbs li + li::before {
    content: "\203A"; /* › */
    margin: 0 6px;
    color: #a6acbe;
}

.bt-page-header__crumbs li[aria-current="page"] {
    color: #5f5e70;
}

/* buttons: no extra bottom padding from the theme column */
.row.page-titles.bt-page-header #list-page-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.row.page-titles.bt-page-header #list-page-actions > .m-r-10 {
    margin-right: 0 !important;
}

@media (max-width: 575px) {
    .row.page-titles.bt-page-header > #list-page-actions-container {
        margin-left: 0;
    }
}

/* ---------- days left before the permanent delete (Archived Buildings): purple, orange in the last week, red in the last 3 days ---------- */
.bt-table .bt-days {
    display: inline-flex;
    align-items: center;
    height: 26px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    color: #5b4fc7;
    background-color: #eeecfb;
    border: 1px solid #d6d2f5;
    border-radius: 13px;
    white-space: nowrap;
}

.bt-table .bt-days--warn {
    color: #9a4d00;
    background-color: #fff1e0;
    border-color: #ffd9ad;
}

.bt-table .bt-days--danger {
    color: #b0263f;
    background-color: #fdecef;
    border-color: #f5c2cc;
}

/* "by Name" under a date, with small initials */
.bt-table .bt-person-sub {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.bt-table .bt-initials--small {
    flex-basis: 20px;
    width: 20px;
    height: 20px;
    font-size: 9px;
}

/* =====================================================================================================
   Popups in the shared table look: #commonModal.bt-modal (buttons with data-modal-look="bt", see events.js)
   Portfolio: New building, Edit, Delete building. Other popups keep the default look.
   ===================================================================================================== */
#commonModal.bt-modal .modal-dialog:not(.modal-lg):not(.modal-xl):not(.modal-sm) {
    max-width: 560px;
}

#commonModal.bt-modal .modal-content {
    overflow: hidden;
    border: 0;
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(30, 30, 60, 0.18);
}

#commonModal.bt-modal .modal-header {
    align-items: center;
    padding: 18px 24px;
    background-color: #fff;
    border-bottom: 1px solid #eef0f6;
}

#commonModal.bt-modal .modal-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    color: #2b2a3a;
}

#commonModal.bt-modal .modal-header .close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin: 0 -6px 0 auto;
    padding: 0;
    font-size: 12px;
    color: #8a8b9c;
    border-radius: 8px;
    opacity: 1;
    text-shadow: none;
}

#commonModal.bt-modal .modal-header .close:hover {
    color: #5b4fc7;
    background-color: #eeecfb;
}

#commonModal.bt-modal .modal-body {
    min-height: 0;
    padding: 20px 24px;
    color: #3d3c4a;
}

/* form fields */
#commonModal.bt-modal .modal-body .control-label,
#commonModal.bt-modal .modal-body .col-form-label,
#commonModal.bt-modal .bt-modal-label {
    font-size: 13px;
    font-weight: 600;
    color: #3d3c4a;
}

#commonModal.bt-modal .modal-body .form-control:not(textarea):not([type="file"]) {
    height: 40px;
}

#commonModal.bt-modal .modal-body .form-control {
    font-size: 14px;
    color: #3d3c4a;
    background-color: #fff;
    border: 1px solid #e3e4ea;
    border-radius: 8px;
    box-shadow: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

#commonModal.bt-modal .modal-body .form-control:hover {
    border-color: #d6d2f5;
}

#commonModal.bt-modal .modal-body .form-control:focus {
    border-color: #5b4fc7;
    box-shadow: 0 0 0 3px #eeecfb;
    outline: 0;
}

#commonModal.bt-modal .modal-body .select2-container--bootstrap .select2-selection {
    min-height: 40px;
    border-color: #e3e4ea;
    border-radius: 8px;
    box-shadow: none;
}

#commonModal.bt-modal .modal-body .select2-container--bootstrap.select2-container--focus .select2-selection,
#commonModal.bt-modal .modal-body .select2-container--bootstrap.select2-container--open .select2-selection {
    border-color: #5b4fc7;
    box-shadow: 0 0 0 3px #eeecfb;
}

#commonModal.bt-modal .modal-body label.error {
    margin-top: 6px;
    font-size: 12px;
    color: #c62f4b;
}

#commonModal.bt-modal .modal-body .form-control.error {
    border-color: #f5c2cc;
}

/* footer: Cancel (white) left of the main button (purple, red for delete) */
#commonModal.bt-modal .modal-footer {
    gap: 10px;
    padding: 14px 24px;
    background-color: #f8f8fb;
    border-top: 1px solid #eef0f6;
}

#commonModal.bt-modal .modal-footer > * {
    margin: 0;
}

#commonModal.bt-modal .modal-footer .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 18px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    border-radius: 8px;
    box-shadow: none;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

#commonModal.bt-modal #commonModalCloseButton {
    color: #3d3c4a;
    background-color: #fff !important;
    border: 1px solid #e3e4ea !important;
}

#commonModal.bt-modal #commonModalCloseButton:hover {
    color: #5b4fc7;
    background-color: #eeecfb !important;
    border-color: #d6d2f5 !important;
}

#commonModal.bt-modal #commonModalSubmitButton {
    color: #fff;
    background-color: #5b4fc7 !important;
    border: 1px solid #5b4fc7 !important;
}

#commonModal.bt-modal #commonModalSubmitButton:hover {
    background-color: #4a3fb0 !important;
    border-color: #4a3fb0 !important;
}

#commonModal.bt-modal #commonModalSubmitButton.bt-modal-submit--danger {
    background-color: #c62f4b !important;
    border-color: #c62f4b !important;
}

#commonModal.bt-modal #commonModalSubmitButton.bt-modal-submit--danger:hover {
    background-color: #a8243d !important;
    border-color: #a8243d !important;
}

#commonModal.bt-modal #commonModalSubmitButton:disabled,
#commonModal.bt-modal #commonModalSubmitButton:disabled:hover {
    color: #a6acbe;
    background-color: #eef0f6 !important;
    border-color: #eef0f6 !important;
    cursor: not-allowed;
    opacity: 1;
}

#commonModal.bt-modal .modal-footer .btn:focus-visible,
#commonModal.bt-modal .modal-header .close:focus-visible {
    outline: 2px solid #5b4fc7;
    outline-offset: 2px;
}

/* ---------- Delete building popup (Modules/Building modals/archive.blade.php) ---------- */
.bt-modal-building {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    background-color: #f8f8fb;
    border: 1px solid #eef0f6;
    border-radius: 10px;
}

.bt-modal-building__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    font-size: 17px;
    color: #5b4fc7;
    background-color: #eeecfb;
    border-radius: 10px;
}

.bt-modal-building__text {
    min-width: 0;
}

.bt-modal-building__name {
    font-size: 15px;
    font-weight: 700;
    color: #2b2a3a;
}

.bt-modal-building__address {
    margin-top: 2px;
    font-size: 13px;
    color: #8a8b9c;
}

.bt-modal-note {
    display: flex;
    gap: 10px;
    margin: 16px 0 20px;
    padding: 12px 14px;
    font-size: 13px;
    line-height: 1.5;
    color: #7a4100;
    background-color: #fff6eb;
    border: 1px solid #ffe2bf;
    border-radius: 8px;
}

.bt-modal-note i {
    margin-top: 2px;
    color: #c26a00;
}

.bt-modal-field {
    margin-bottom: 0;
}

.bt-modal-label {
    display: block;
    margin-bottom: 6px;
}

.bt-modal-required {
    color: #c62f4b;
}

.bt-modal-hint {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    color: #8a8b9c;
}

/* ---------- SweetAlert confirm in the same look (Archived Buildings: Restore) ---------- */
.bt-swal.swal2-popup {
    padding: 28px 24px 24px;
    border-radius: 12px;
}

.bt-swal .swal2-title {
    font-size: 20px;
    font-weight: 700;
    color: #2b2a3a;
}

.bt-swal .swal2-html-container {
    font-size: 14px;
    line-height: 1.5;
    color: #5f5e70;
}

.bt-swal .swal2-actions {
    gap: 10px;
}

.bt-swal-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    margin: 0;
    padding: 0 18px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.bt-swal-btn--primary {
    color: #fff;
    background-color: #5b4fc7;
    border: 1px solid #5b4fc7;
}

.bt-swal-btn--primary:hover {
    background-color: #4a3fb0;
    border-color: #4a3fb0;
}

.bt-swal-btn--secondary {
    color: #3d3c4a;
    background-color: #fff;
    border: 1px solid #e3e4ea;
}

.bt-swal-btn--secondary:hover {
    color: #5b4fc7;
    background-color: #eeecfb;
    border-color: #d6d2f5;
}

.bt-swal-btn:focus-visible {
    outline: 2px solid #5b4fc7;
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    #commonModal.bt-modal .modal-footer .btn,
    #commonModal.bt-modal .modal-body .form-control,
    .bt-swal-btn {
        transition: none;
    }
}

/* building form: the client picker block (light blue band) in the page grey */
#commonModal.bt-modal .client-selector {
    background-color: #f8f8fb;
    border-bottom: 1px solid #eef0f6;
}

/* SweetAlert sets the button text colour on the popup: keep the look inside .bt-swal; focus ring instead of the browser outline */
.bt-swal .bt-swal-btn--primary,
.bt-swal .bt-swal-btn--primary:hover {
    color: #fff !important;
}

.bt-swal .bt-swal-btn--secondary {
    color: #3d3c4a !important;
}

.bt-swal .bt-swal-btn--secondary:hover {
    color: #5b4fc7 !important;
}

.bt-swal .bt-swal-btn:focus {
    outline: 0;
    box-shadow: 0 0 0 3px #d6d2f5;
}

/* buildings deleted before the archive feature: never permanently deleted automatically */
.bt-table .bt-days--off {
    color: #5f5e70;
    background-color: #f0f1f5;
    border-color: #e3e4ea;
}
