/* ================================================
   INLINE INVOICE DISCOUNTS - Custom Styles
   ================================================ */

/* Discount column styling */
.bill_col_discount {
    min-width: 150px;
}

.bill_col_discount .input-group-append {
    width: 60px;
}

.bill_col_discount .js_item_discount_type {
    font-size: 12px;
    padding: 0.25rem;
}

/* Hide discount column when needed */
.bill_col_discount.hidden {
    display: none !important;
}

/* Disabled button styling */
button.disabled,
a.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

/* Keep aggregated client category names inside the narrow profile card. */
.grow-client-category-badge {
    max-width: 100%;
    height: auto;
    line-height: 1.35;
    overflow-wrap: anywhere;
    text-align: left;
    white-space: normal;
    word-break: break-word;
}

/* Keep long Grow forms inside the viewport while preserving fixed actions. */
#commonModalContainer {
    max-height: calc(100vh - 60px);
}

#commonModalContainer > #commonModalForm {
    display: flex;
    width: 100%;
    max-height: calc(100vh - 60px);
    min-height: 0;
}

#commonModalContainer > #commonModalForm > .modal-content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    max-height: 100%;
    min-height: 0;
}

#commonModalBody {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

#commonModal select.client-category-picker + .select2,
#commonModal .grow-client-category-control {
    width: 100% !important;
}

#commonModal .grow-client-category-control .grow-client-category-selection {
    min-height: 38px !important;
    height: auto !important;
    padding: 5px 8px !important;
    border: 1px solid #c4cfdc !important;
    border-radius: 4px !important;
    background: #fff !important;
    box-shadow: none !important;
}

#commonModal .grow-client-category-control.select2-container--focus .grow-client-category-selection,
#commonModal .grow-client-category-control.select2-container--open .grow-client-category-selection {
    border-color: #80bdff !important;
    box-shadow: 0 0 0 1px rgba(32, 174, 227, 0.18) !important;
}

#commonModal .grow-client-category-control .select2-selection__rendered {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    white-space: normal !important;
}

#commonModal .grow-client-category-control .select2-selection__choice {
    display: inline-flex !important;
    float: none !important;
    align-items: center;
    min-height: 26px;
    margin: 0 !important;
    padding: 2px 8px !important;
    border: 1px solid #b9deed !important;
    border-radius: 4px !important;
    background: #eef8fc !important;
    color: #455a64 !important;
    line-height: 20px !important;
}

#commonModal .grow-client-category-control .select2-selection__choice__remove {
    order: -1;
    margin: 0 6px 0 0 !important;
    color: #607d8b !important;
    font-size: 15px;
    line-height: 1;
}

#commonModal .grow-client-category-control .select2-search--inline {
    float: none !important;
    flex: 1 1 110px;
    min-width: 90px;
    margin: 0 !important;
}

#commonModal .grow-client-category-control .select2-search__field {
    width: 100% !important;
    min-width: 90px;
    height: 26px !important;
    margin: 0 !important;
    padding: 1px 4px !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#commonModal .grow-client-category-control .select2-selection__clear {
    display: none !important;
}

#commonModal .grow-client-category-dropdown {
    overflow: hidden;
    border: 1px solid #c4cfdc !important;
    background: #fff !important;
    color: #455a64 !important;
    box-shadow: 0 8px 20px rgba(45, 67, 86, 0.12);
}

#commonModal .grow-client-category-dropdown .select2-results__option {
    position: relative;
    padding: 8px 36px 8px 12px;
    background: #fff;
    color: #455a64;
}

#commonModal .grow-client-category-dropdown .select2-results__option[aria-selected="true"] {
    background: #eef8fc;
}

#commonModal .grow-client-category-dropdown .select2-results__option[aria-selected="true"]::after {
    position: absolute;
    top: 8px;
    right: 12px;
    color: #20aee3;
    content: "\2713";
    font-weight: 700;
}

#commonModal .grow-client-category-dropdown .select2-results__option--highlighted[aria-selected] {
    background: #20aee3 !important;
    color: #fff !important;
}

#commonModal .grow-client-category-dropdown .select2-results__option--highlighted[aria-selected]::after {
    color: #fff;
}

@media (max-width: 575.98px) {
    #commonModalContainer {
        width: calc(100% - 20px);
        margin: 10px auto;
    }

    #commonModalContainer,
    #commonModalContainer > #commonModalForm {
        max-height: calc(100vh - 20px);
    }
}
.grow-global-address-autocomplete {
    display: block;
    min-height: 38px;
    width: 100%;
}

.grow-global-address-manual-fallback {
    display: block;
}

/* Make the currently selected language easy to identify. */
#topnav-language-icon .language .dropdown-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#topnav-language-icon .language .dropdown-item.is-current {
    font-weight: 500;
}

#topnav-language-icon .language .topnav-language-current {
    margin-left: 8px;
    color: #20aee3;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
}

#topnav-language-icon .language .dropdown-item:hover .topnav-language-current,
#topnav-language-icon .language .dropdown-item:focus .topnav-language-current {
    color: currentColor;
}

/* ================================================================
   APPLICATION UI REFINEMENT LAYER

   This intentionally uses the Grow Superadmin appearance variables so the
   polish follows the selected theme instead of introducing a second palette.
   Module styles are loaded after this file and can still refine their own
   branded components.
   ================================================================ */
:root {
    --grow-ui-accent: var(--gsa-button-bg-accessible, #08759a);
    --grow-ui-accent-strong: var(--gsa-primary-accessible, #075f7f);
    --grow-ui-border: var(--gsa-border, #d9e1e7);
    --grow-ui-border-soft: #e8edf1;
    --grow-ui-heading: var(--gsa-heading, #334155);
    --grow-ui-text: var(--gsa-text, #526066);
    --grow-ui-muted: var(--gsa-muted, #76858d);
    --grow-ui-surface: var(--gsa-card-bg, #fff);
    --grow-ui-page: var(--gsa-page-bg, #f4f7f9);
    --grow-ui-radius: 11px;
    --grow-ui-shadow: 0 8px 24px rgba(38, 50, 56, 0.075);
    --grow-ui-shadow-raised: 0 12px 30px rgba(38, 50, 56, 0.12);
}

body {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.page-wrapper {
    background-color: var(--grow-ui-page);
    background-image:
        radial-gradient(circle at 100% 0, rgba(32, 174, 227, 0.045), transparent 28rem),
        linear-gradient(180deg, rgba(255, 255, 255, 0.32), transparent 18rem);
}

/* Keep the application chrome crisp and every icon optically centered. */
.topbar {
    border-bottom: 1px solid rgba(82, 96, 102, 0.1);
    box-shadow: 0 4px 18px rgba(38, 50, 56, 0.055);
}

.topbar .top-navbar,
.topbar .top-navbar .navbar-collapse,
.topbar .top-navbar .navbar-nav,
#right-topnav-navbar > .nav-item {
    align-items: stretch;
}

#right-topnav-navbar > .nav-item {
    display: flex;
}

.topbar .top-navbar .navbar-nav > .nav-item > .nav-link {
    display: flex;
    min-width: 40px;
    height: 74px;
    align-items: center;
    justify-content: center;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1;
}

.topbar .top-navbar .navbar-nav > .nav-item > .nav-link.profile-pic {
    gap: 6px;
}

.topbar .top-navbar .navbar-nav > .nav-item > .nav-link > i,
.topbar .top-navbar .navbar-nav > .nav-item > .nav-link .grow-superadmin-fa-glyph {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1 !important;
    vertical-align: middle;
}

.topbar .top-navbar .navbar-nav > .nav-item > .nav-link:focus-visible {
    outline: 0;
    box-shadow: inset 0 -3px 0 var(--grow-ui-accent);
}

.left-sidebar {
    border-right: 1px solid rgba(82, 96, 102, 0.09);
    box-shadow: 5px 0 18px rgba(38, 50, 56, 0.035);
}

#sidebarnav > li > a {
    display: flex;
    align-items: center;
}

/* Keep submenu chevrons in their own flex column. The theme positions them
 * over the label with an absolute offset, which lets longer translations
 * (for example "Arrangementer" and "Mediebibliotek") run underneath them. */
#sidebarnav > li > a.has-arrow {
    padding-right: 8px;
}

#sidebarnav > li > a.has-arrow > .hide-menu {
    flex: 0 1 auto;
    margin-right: 8px;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#sidebarnav > li > a.has-arrow::after {
    align-self: center;
    flex: 0 0 7px;
    margin-left: auto;
    position: static;
    right: auto;
    top: auto;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}

#sidebarnav > li.active > a.has-arrow::after,
#sidebarnav > li > a.has-arrow.active::after,
#sidebarnav > li > a.has-arrow[aria-expanded="true"]::after {
    top: auto;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}

#sidebarnav > li > a > i,
#sidebarnav > li > a > .grow-superadmin-menu-icon {
    display: inline-flex;
    flex: 0 0 25px;
    align-items: center;
    justify-content: center;
    line-height: 1 !important;
}

/* Page headings and action bars share a stable vertical rhythm. */
.page-titles {
    align-items: flex-end;
}

.page-titles .text-themecolor {
    margin-bottom: 5px;
    color: var(--grow-ui-heading);
    font-weight: 600;
    letter-spacing: -0.018em;
}

.page-titles .breadcrumb {
    line-height: 1.5;
}

.parent-page-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.parent-page-actions > .btn,
.parent-page-actions > a,
.parent-page-actions > button {
    margin: 0 !important;
}

/* Cards now read as deliberate surfaces instead of unbounded white blocks. */
.card {
    border: 1px solid var(--grow-ui-border-soft);
    border-radius: var(--grow-ui-radius);
    background-clip: border-box;
    box-shadow: var(--grow-ui-shadow);
}

.card > .card-header,
.card > form > .card-header {
    min-height: 52px;
    padding: 15px 20px;
    border-bottom: 1px solid var(--grow-ui-border-soft);
    border-radius: var(--grow-ui-radius) var(--grow-ui-radius) 0 0;
    background: linear-gradient(180deg, #fff, #fcfdfe);
    color: var(--grow-ui-heading);
}

.card > .card-body,
.card > form > .card-body {
    border-radius: inherit;
    box-shadow: none;
}

.card > .card-header + .card-body,
.card > form > .card-header + .card-body {
    border-radius: 0 0 var(--grow-ui-radius) var(--grow-ui-radius);
}

/* Inputs, Select2 controls, and addons use the same dimensions and baseline. */
.form-control {
    min-height: 40px;
    padding: 8px 12px;
    border-color: var(--gsa-input-border, #d9e1e7);
    border-radius: 8px;
    color: var(--gsa-input-text, #526066);
    background-color: var(--gsa-input-bg, #fff);
    line-height: 1.45;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

textarea.form-control {
    height: auto;
    line-height: 1.55;
    resize: vertical;
}

select.form-control:not([multiple]):not([size]) {
    height: 40px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.form-control-sm,
select.form-control-sm:not([multiple]):not([size]) {
    min-height: 36px;
    height: 36px;
    padding: 6px 10px;
    font-size: 13px;
}

.form-control:focus {
    border-color: var(--grow-ui-accent);
    background-color: #fff;
    box-shadow: 0 0 0 3px rgba(32, 174, 227, 0.13);
}

.form-control::placeholder {
    color: #9aa8b0;
    opacity: 1;
}

.input-group-addon,
.input-group-text,
.input-group-prepend,
.input-group-append {
    align-items: center;
}

.input-group-addon,
.input-group-text {
    display: flex;
    min-height: 40px;
    justify-content: center;
    border-color: var(--gsa-input-border, #d9e1e7);
}

.select2-container .select2-selection--single {
    height: 40px !important;
    border-color: var(--gsa-input-border, #d9e1e7) !important;
    border-radius: 8px !important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    padding-top: 5px;
    line-height: 28px !important;
}

.select2-container .select2-selection--single .select2-selection__arrow {
    top: 1px;
    height: 38px !important;
}

.select2-container .select2-selection--multiple {
    min-height: 40px;
    border-color: var(--gsa-input-border, #d9e1e7) !important;
    border-radius: 8px !important;
}

/* Buttons are consistent hit targets; icons no longer sit above or below text. */
.btn {
    display: inline-flex;
    min-width: 32px;
    min-height: 38px;
    max-width: 100%;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 8px;
    font-weight: 600;
    line-height: 1.2;
    vertical-align: middle;
    white-space: normal;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}

.btn:hover:not(:disabled):not(.disabled) {
    opacity: 1;
    transform: translateY(-1px);
    box-shadow: 0 5px 13px rgba(38, 50, 56, 0.11);
}

.btn:active:not(:disabled):not(.disabled) {
    transform: translateY(0);
    box-shadow: none;
}

.btn-sm {
    min-width: 32px;
    min-height: 32px;
    padding: 6px 10px;
    font-size: 12px;
}

.btn-xs {
    min-height: 32px;
    padding: 4px 8px;
    font-size: 11px;
}

.btn-lg {
    min-height: 48px;
    padding: 11px 18px;
}

.btn-circle.btn-sm,
.btn-circle.btn-xs {
    width: 32px;
    min-width: 32px;
    height: 32px;
    min-height: 32px;
    padding: 0;
    border-radius: 50%;
}

.btn-add-circle {
    display: inline-flex !important;
    width: 42px;
    min-width: 42px;
    height: 42px !important;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    border-radius: 10px;
}

.btn > i,
.btn > [class*="icon-"],
.dropdown-item > i,
.nav-link > i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1 !important;
    vertical-align: middle;
}

.btn-circle > i {
    margin: 0 !important;
}

.btn:focus-visible,
.form-control:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(32, 174, 227, 0.18);
}

/*
 * The bundled themes darken some controls and fade others with opacity. That
 * makes the same action look unrelated between screens and can reduce text
 * contrast on hover. Keep semantic colors stable and use a real state color.
 * SuperAdmin's runtime palette may override these fallbacks when enabled.
 */
.btn-primary,
.btn-themecolor,
.btn-info {
    border-color: var(--grow-ui-accent);
    background: var(--grow-ui-accent);
    color: #fff;
}

.btn-primary:hover:not(:disabled):not(.disabled),
.btn-primary:focus:not(:disabled):not(.disabled),
.btn-themecolor:hover:not(:disabled):not(.disabled),
.btn-themecolor:focus:not(:disabled):not(.disabled),
.btn-info:hover:not(:disabled):not(.disabled),
.btn-info:focus:not(:disabled):not(.disabled) {
    border-color: var(--grow-ui-accent-strong);
    background: var(--grow-ui-accent-strong);
    color: #fff;
}

.btn-secondary,
.btn-default {
    border-color: var(--grow-ui-border);
    background: var(--grow-ui-surface);
    color: var(--grow-ui-text);
}

.btn-secondary:hover:not(:disabled):not(.disabled),
.btn-secondary:focus:not(:disabled):not(.disabled),
.btn-default:hover:not(:disabled):not(.disabled),
.btn-default:focus:not(:disabled):not(.disabled) {
    border-color: var(--grow-ui-accent);
    background: rgba(32, 174, 227, 0.07);
    color: var(--grow-ui-accent-strong);
}

.btn-success {
    border-color: #16815d;
    background: #16815d;
    color: #fff;
}

.btn-success:hover:not(:disabled):not(.disabled),
.btn-success:focus:not(:disabled):not(.disabled) {
    border-color: #106a4b;
    background: #106a4b;
    color: #fff;
}

.btn-danger,
.btn-red {
    border-color: #d83a52;
    background: #d83a52;
    color: #fff;
}

/* Keep neutral and destructive outline actions readable against light cards. */
.btn-outline-secondary {
    border-color: #52606d;
    background: var(--grow-ui-surface);
    color: #334155;
}

.btn-outline-secondary:hover:not(:disabled):not(.disabled),
.btn-outline-secondary:focus:not(:disabled):not(.disabled),
.btn-outline-secondary.active:not(:disabled):not(.disabled),
.btn-outline-secondary:active:not(:disabled):not(.disabled) {
    border-color: #075f7f;
    background: #e7f3f7;
    color: #075f7f;
}

.btn-page-actions.active,
.btn-page-actions[aria-pressed="true"] {
    border-color: #075f7f !important;
    background: #075f7f !important;
    color: #fff !important;
}

.btn-outline-danger {
    border-color: #b4233c;
    background: var(--grow-ui-surface);
    color: #a61b33;
}

.btn-outline-danger:hover:not(:disabled):not(.disabled),
.btn-outline-danger:focus:not(:disabled):not(.disabled),
.btn-outline-danger.active:not(:disabled):not(.disabled),
.btn-outline-danger:active:not(:disabled):not(.disabled) {
    border-color: #8d1930;
    background: #8d1930;
    color: #fff;
}

.btn-link {
    color: #075f7f;
    text-decoration: none;
}

.btn-link:hover:not(:disabled):not(.disabled),
.btn-link:focus:not(:disabled):not(.disabled) {
    color: #064b63;
    text-decoration: underline;
}

.btn-danger:hover:not(:disabled):not(.disabled),
.btn-danger:focus:not(:disabled):not(.disabled),
.btn-red:hover:not(:disabled):not(.disabled),
.btn-red:focus:not(:disabled):not(.disabled) {
    border-color: #b8263d;
    background: #b8263d;
    color: #fff;
}

.btn-warning {
    border-color: #e1aa22;
    background: #f6c343;
    color: #3f2d00;
}

.btn-warning:hover:not(:disabled):not(.disabled),
.btn-warning:focus:not(:disabled):not(.disabled) {
    border-color: #cc9410;
    background: #e6ad22;
    color: #302100;
}

.btn-outline-secondary:hover:not(:disabled):not(.disabled),
.btn-outline-secondary:focus:not(:disabled):not(.disabled) {
    border-color: #075f7f;
    background: #e7f3f7;
    color: #075f7f;
}

/* Theme defaults use very light cyan/green text on white (under 3:1). */
.btn-outline-info {
    border-color: #08759a;
    color: #08759a;
}

.btn-outline-info:hover:not(:disabled):not(.disabled),
.btn-outline-info:focus:not(:disabled):not(.disabled) {
    border-color: #075f7f;
    background: #075f7f;
    color: #fff;
}

.btn-outline-success {
    border-color: #08775e;
    color: #08775e;
}

.btn-outline-success:hover:not(:disabled):not(.disabled),
.btn-outline-success:focus:not(:disabled):not(.disabled) {
    border-color: #066048;
    background: #066048;
    color: #fff;
}

.btn-outline-warning {
    border-color: #855300 !important;
    color: #855300 !important;
}

.btn-outline-warning:hover:not(:disabled):not(.disabled),
.btn-outline-warning:focus:not(:disabled):not(.disabled) {
    border-color: #754600 !important;
    background: #754600 !important;
    color: #fff !important;
}

/* List toolbar actions remain neutral, but meet text/icon contrast at rest. */
.btn-page-actions,
.list-actions-button {
    border: 1px solid #9aa8b0 !important;
    background: var(--grow-ui-surface) !important;
    color: #334155 !important;
}

.btn-page-actions:hover,
.btn-page-actions:focus,
.list-actions-button:hover,
.list-actions-button:focus {
    border-color: #08759a !important;
    background: #e7f3f7 !important;
    color: #075f7f !important;
}

/* FullCalendar renders its own buttons and otherwise bypasses the shared
 * button states. Keep the toolbar contained and keyboard/touch friendly. */
.calendar_wrapper,
#calendar_wrapper,
#growevents-calendar,
#growevents-public-calendar {
    max-width: 100%;
    min-width: 0;
}

.fc .fc-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.fc .fc-toolbar-chunk {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    min-width: 0;
}

.fc .fc-button-group {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    max-width: 100%;
}

.fc .fc-button-group > .fc-button {
    margin: 0 !important;
}

.fc .fc-button {
    min-width: 44px;
    min-height: 44px;
    border: 1px solid #52606d;
    border-radius: 7px;
    background: #fff !important;
    color: #334155 !important;
    box-shadow: none;
}

.fc .fc-button:hover:not(:disabled),
.fc .fc-button:focus-visible {
    border-color: #075f7f !important;
    background: #e7f3f7 !important;
    color: #075f7f !important;
}

.fc .fc-button:focus-visible {
    outline: 3px solid rgba(8, 117, 154, .3);
    outline-offset: 2px;
}

.fc .fc-button.fc-button-active,
.fc .fc-button:active {
    border-color: #075f7f !important;
    background: #075f7f !important;
    color: #fff !important;
}

.calendar .fc-custom_button_add_event-button {
    border-color: #075f7f !important;
    background: #075f7f !important;
    color: #fff !important;
}

.calendar .fc-custom_button_add_event-button:hover:not(:disabled),
.calendar .fc-custom_button_add_event-button:focus-visible {
    border-color: #064b63 !important;
    background: #064b63 !important;
    color: #fff !important;
}

.calendar .fc-custom_button_add_event-button:active {
    border-color: #043c50 !important;
    background: #043c50 !important;
    color: #fff !important;
    box-shadow: none !important;
}

.btn:disabled,
.btn.disabled,
button:disabled,
[role="button"][aria-disabled="true"] {
    opacity: 0.56;
    transform: none !important;
    box-shadow: none !important;
}

/* Shared containment for all wrapper-based screens and modal fragments. */
.page-wrapper,
.page-wrapper > .container-fluid,
.container-fluid,
.row > [class*="col-"],
.card,
.card-body,
.modal-content,
form,
fieldset,
.input-group,
.input-group > .form-control {
    min-width: 0;
}

.page-wrapper img,
.page-wrapper video,
.page-wrapper iframe,
.modal img,
.modal video,
.modal iframe {
    max-width: 100%;
}

.breadcrumb,
.modal-footer,
.card-header,
.card-footer {
    flex-wrap: wrap;
}

.breadcrumb-item,
.dropdown-item,
.list-group-item,
.modal-title,
.card-title,
details > summary {
    overflow-wrap: anywhere;
}

.modal-dialog {
    max-width: calc(100vw - 20px);
}

.modal-footer {
    gap: 8px;
}

.modal-footer > .btn {
    margin: 0;
}

/* Tables remain compact, but headers, rows, and actions are easier to scan. */
.table {
    color: var(--grow-ui-text);
}

.table thead th {
    padding-top: 12px;
    padding-bottom: 12px;
    border-top: 0;
    border-bottom: 1px solid var(--grow-ui-border);
    background: #f7f9fb;
    color: #52626b;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.035em;
    text-transform: uppercase;
    vertical-align: middle;
}

.table tbody td {
    padding-top: 12px;
    padding-bottom: 12px;
    border-color: var(--grow-ui-border-soft);
    vertical-align: middle;
}

.table-hover tbody tr {
    transition: background-color 0.14s ease;
}

.table-hover tbody tr:hover {
    background-color: rgba(32, 174, 227, 0.045);
}

.table-responsive {
    border-radius: 8px;
    scrollbar-color: #b8c5cd transparent;
    scrollbar-width: thin;
}

.table-responsive::-webkit-scrollbar,
.nav-tabs::-webkit-scrollbar {
    height: 6px;
}

.table-responsive::-webkit-scrollbar-thumb,
.nav-tabs::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: #b8c5cd;
}

/* Tabs behave like a single, stable navigation control at every width. */
.nav-tabs {
    gap: 4px;
    border-bottom-color: var(--grow-ui-border-soft);
}

.nav-tabs .nav-link {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 8px 8px 0 0;
    line-height: 1.2;
    white-space: nowrap;
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {
    border-bottom-color: rgba(32, 174, 227, 0.42);
    background: rgba(32, 174, 227, 0.045);
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    border-bottom-color: var(--grow-ui-accent);
    background: rgba(32, 174, 227, 0.065);
    color: var(--grow-ui-accent-strong);
}

.badge,
.label {
    border-radius: 999px;
    font-weight: 700;
    letter-spacing: 0.015em;
}

.dropdown-menu {
    overflow: hidden;
    border: 1px solid var(--grow-ui-border-soft);
    border-radius: 10px;
    box-shadow: var(--grow-ui-shadow-raised);
}

.dropdown-item {
    min-height: 38px;
    display: flex;
    align-items: center;
}

.alert {
    border-radius: 9px;
}

/* Authentication screens use the selected identity and a proper focal card. */
.logged-out body {
    background-color: #f3f7f9;
    background-image:
        radial-gradient(circle at 14% 8%, rgba(32, 174, 227, 0.14), transparent 28rem),
        radial-gradient(circle at 88% 88%, rgba(103, 114, 229, 0.1), transparent 30rem),
        linear-gradient(145deg, #f8fbfc, #eef4f7);
}

.logged-out body #main-wrapper {
    position: relative;
    z-index: 3;
    min-height: 100vh;
    padding: 48px 20px 60px;
}

.logged-out body #main-wrapper .login-logo {
    margin-top: 0 !important;
    padding-bottom: 14px;
}

.logged-out body #main-wrapper .login-logo img {
    width: auto;
    max-width: 230px;
    max-height: 72px;
    object-fit: contain;
}

.logged-out body #main-wrapper .login-box {
    width: min(100%, 430px);
    padding: 34px 36px 30px;
    border: 1px solid rgba(82, 96, 102, 0.1);
    border-top: 4px solid var(--grow-ui-accent);
    border-radius: 15px;
    box-shadow: 0 22px 55px rgba(38, 50, 56, 0.14);
}

.logged-out .login-box .box-title {
    color: var(--grow-ui-heading);
    font-weight: 600;
    letter-spacing: -0.02em;
}

.logged-out .login-box .form-material .form-control {
    min-height: 46px;
    padding: 10px 13px;
    border: 1px solid var(--grow-ui-border);
    border-radius: 9px;
    background-color: #fff;
}

.logged-out .login-box .form-group {
    margin-bottom: 18px;
}

.logged-out .login-box .custom-control {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
}

.logged-out .login-box .btn-block {
    width: 100%;
}

.logged-out body .login-background .x-left {
    width: min(31vw, 470px);
    opacity: 0.82;
}

/* The template catalog is a real app page, not a bare Blade fragment. */
.grow-templates-catalog .grow-templates-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 220px));
    gap: 12px;
    margin-top: 22px;
}

.grow-templates-catalog .grow-templates-summary > div {
    padding: 14px 16px;
    border: 1px solid var(--grow-ui-border-soft);
    border-radius: 9px;
    background: #f8fafb;
}

.grow-templates-catalog .grow-templates-summary span,
.grow-templates-catalog .grow-templates-summary strong {
    display: block;
}

.grow-templates-catalog .grow-templates-summary span {
    margin-bottom: 4px;
    color: var(--grow-ui-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* ================================================================
   MESSAGES - CONVERSATION HIERARCHY

   The legacy chat layout has a large, unlabelled white canvas and two
   floating icon buttons. Keep the existing layout hooks, but give the
   conversation and composer a clear visual identity.
   ================================================================ */
.chat-main-box {
    background: var(--grow-ui-page);
}

.chat-main-box .chat-right-aside {
    overflow: hidden;
    background: #f8fafb;
}

.chat-main-box .messages-conversation-header {
    position: absolute;
    z-index: 4;
    top: 0;
    right: 0;
    left: 0;
    display: flex;
    min-height: 76px;
    align-items: center;
    gap: 13px;
    padding: 13px 24px;
    border-bottom: 1px solid var(--grow-ui-border-soft);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 4px 18px rgba(38, 50, 56, 0.045);
}

.messages-conversation-icon,
.messages-empty-state-icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(32, 174, 227, 0.11);
    color: var(--grow-ui-accent-strong);
}

.messages-conversation-icon {
    width: 42px;
    height: 42px;
    font-size: 19px;
}

.messages-conversation-copy {
    min-width: 0;
}

.messages-conversation-eyebrow,
.messages-empty-state-eyebrow {
    display: block;
    color: var(--grow-ui-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.messages-conversation-copy h1,
.messages-empty-state h2 {
    margin: 2px 0 0;
    color: var(--grow-ui-heading);
    font-weight: 600;
    letter-spacing: -0.02em;
}

.messages-conversation-copy h1 {
    overflow: hidden;
    font-size: 17px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.messages-conversation-copy p {
    overflow: hidden;
    margin: 1px 0 0;
    color: var(--grow-ui-muted);
    font-size: 12px;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.messages-conversation-badge {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    gap: 7px;
    margin-left: auto;
    padding: 5px 10px;
    border: 1px solid var(--grow-ui-border-soft);
    border-radius: 999px;
    background: #fbfcfd;
    color: var(--grow-ui-muted);
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.messages-conversation-badge-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #24d2b5;
    box-shadow: 0 0 0 3px rgba(36, 210, 181, 0.12);
}

.chat-main-box .chat-right-aside #feed_container {
    z-index: 1;
    top: 76px;
    bottom: 132px;
    background:
        radial-gradient(circle at 15% 0, rgba(32, 174, 227, 0.04), transparent 22rem),
        #f8fafb;
}

.chat-main-box .chat-right-aside #chat-messages-container {
    padding: 24px 28px !important;
}

.messages-empty-state {
    position: absolute;
    z-index: 2;
    top: 76px;
    right: 0;
    bottom: 132px;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background:
        radial-gradient(circle at 50% 43%, rgba(32, 174, 227, 0.08), transparent 13rem),
        #f8fafb;
    color: var(--grow-ui-text);
    text-align: center;
    pointer-events: none;
}

.messages-empty-state.is-hidden {
    display: none;
}

.messages-empty-state-icon {
    width: 58px;
    height: 58px;
    margin-bottom: 14px;
    border-radius: 17px;
    font-size: 25px;
}

.messages-empty-state h2 {
    font-size: 20px;
    line-height: 1.35;
}

.messages-empty-state p {
    margin: 4px 0 0;
    color: var(--grow-ui-muted);
    font-size: 13px;
}

.chat-main-box .card-post {
    z-index: 3;
    height: 132px;
    padding: 13px 20px 16px;
    border-top: 1px solid var(--grow-ui-border-soft);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 -7px 20px rgba(38, 50, 56, 0.045);
}

.messages-composer-heading {
    display: flex;
    min-height: 20px;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 7px;
}

.messages-composer-label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--grow-ui-heading);
    font-size: 12px;
    font-weight: 700;
}

.messages-composer-label i {
    color: var(--grow-ui-accent-strong);
    font-size: 13px;
}

.messages-composer-hint {
    color: var(--grow-ui-muted);
    font-size: 11px;
}

.chat-main-box .card-post .messaging_text_wrapper {
    position: relative;
    z-index: 1;
    height: 74px;
    margin: 0 238px 0 0;
    overflow: hidden;
    border: 1px solid var(--grow-ui-border);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 2px 7px rgba(38, 50, 56, 0.035);
}

.chat-main-box .card-post .messaging_text_wrapper #messaging_text_editor {
    min-height: 72px;
    padding: 12px 15px !important;
    border: 0 !important;
    border-radius: 12px;
    background: transparent !important;
    box-shadow: none !important;
}

.chat-main-box .card-post .messaging_text_wrapper .mce-tinymce,
.chat-main-box .card-post .messaging_text_wrapper .mce-container,
.chat-main-box .card-post .messaging_text_wrapper .mce-container-body,
.chat-main-box .card-post .messaging_text_wrapper .mce-edit-area {
    height: 72px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.chat-main-box .card-post .messaging_text_wrapper .mce-edit-area {
    padding: 0 !important;
}

.chat-main-box .card-post .messaging_text_wrapper iframe {
    height: 72px !important;
}

.chat-main-box .card-post .messaging_submit_button,
.chat-main-box .card-post .messaging_file_upload_button {
    top: 45px;
    display: inline-flex;
    width: auto;
    min-width: 0;
    height: 42px;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 13px;
    border-radius: 11px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

.chat-main-box .card-post .messaging_submit_button {
    right: 20px;
    min-width: 78px;
    border: 1px solid #ff5c6c;
    box-shadow: 0 7px 15px rgba(255, 92, 108, 0.2);
}

.chat-main-box .card-post .messaging_file_upload_button {
    right: 108px;
    min-width: 112px;
    border: 1px solid var(--grow-ui-border) !important;
    background: #fff !important;
    color: var(--grow-ui-accent-strong) !important;
    box-shadow: none;
}

.chat-main-box .card-post .messaging_file_upload_button:hover,
.chat-main-box .card-post .messaging_file_upload_button:focus {
    border-color: rgba(32, 174, 227, 0.45) !important;
    background: rgba(32, 174, 227, 0.06) !important;
    box-shadow: 0 5px 13px rgba(38, 50, 56, 0.08);
}

.chat-main-box .card-post .messaging_submit_button i,
.chat-main-box .card-post .messaging_file_upload_button i {
    margin: 0 !important;
    font-size: 16px;
}

@media (max-width: 767px) {
    .chat-main-box .messages-conversation-header {
        padding-right: 16px;
        padding-left: 16px;
    }

    .chat-main-box .card-post {
        padding-right: 14px;
        padding-left: 14px;
    }

    .chat-main-box .card-post .messaging_text_wrapper {
        margin-right: 224px;
    }

    .chat-main-box .card-post .messaging_submit_button,
    .chat-main-box .card-post .messaging_file_upload_button {
        top: 45px;
    }

    .chat-main-box .card-post .messaging_submit_button {
        right: 14px;
    }

    .chat-main-box .card-post .messaging_file_upload_button {
        right: 100px;
    }

    .messages-composer-hint,
    .messages-conversation-badge {
        display: none;
    }
}

@media (max-width: 480px) {
    .messages-conversation-icon {
        width: 38px;
        height: 38px;
        border-radius: 10px;
    }

    .messages-conversation-copy h1 {
        font-size: 15px;
    }

    .messages-empty-state {
        padding-right: 16px;
        padding-left: 16px;
    }

    .chat-main-box .card-post .messaging_submit_button,
    .chat-main-box .card-post .messaging_file_upload_button {
        width: 42px;
        min-width: 42px;
        padding: 0;
    }

    .chat-main-box .card-post .messaging_file_upload_button {
        right: 70px;
    }

    .chat-main-box .card-post .messaging_text_wrapper {
        margin-right: 126px;
    }

    .messages-action-label {
        display: none;
    }
}

@media (max-width: 767.98px) {
    .btn-add-circle {
        width: 44px !important;
        min-width: 44px;
        height: 44px !important;
        min-height: 44px;
    }

    .page-wrapper > .container-fluid {
        padding: 20px 15px 42px;
    }

    .page-titles {
        align-items: flex-start;
        margin-bottom: 18px;
    }

    .parent-page-actions {
        width: 100%;
        justify-content: flex-start;
        margin-top: 10px;
    }

    .card {
        margin-bottom: 18px;
        border-radius: 10px;
    }

    .card > .card-header,
    .card > form > .card-header {
        padding: 14px 16px;
    }

    .card > .card-body,
    .card > form > .card-body {
        padding-right: 16px;
        padding-left: 16px;
    }

    .nav-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 1px;
        -webkit-overflow-scrolling: touch;
    }

    .nav-tabs .nav-item {
        flex: 0 0 auto;
    }

    .topbar .top-navbar .navbar-nav > .nav-item > .nav-link {
        min-width: 34px;
        height: 70px;
        padding-right: 7px !important;
        padding-left: 7px !important;
    }

    .table-responsive {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .logged-out body #main-wrapper {
        padding: 34px 14px 45px;
    }

    .logged-out body #main-wrapper .login-box {
        padding: 28px 20px 24px;
        border-radius: 13px;
    }

    .logged-out body #main-wrapper .login-logo img {
        max-width: 210px;
        max-height: 64px;
    }

    .logged-out body .login-background .x-left {
        display: none;
    }

    .grow-templates-catalog .grow-templates-summary {
        grid-template-columns: 1fr;
    }
}

/* Pointer-target size for compact row actions on touch-sized viewports. */
@media (max-width: 991.98px) {
    .btn,
    .btn-sm,
    .btn-xs {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    .btn-sm {
        padding: 8px 12px !important;
    }

    .btn-add-circle {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
    }

    .btn-page-actions,
    .list-actions-button {
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        padding: 0 10px !important;
    }

    .list-table-action .btn.btn-circle,
    .table-responsive .btn-circle.btn-sm,
    .table-responsive .btn-circle.btn-xs {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        padding: 0 !important;
    }

    .list-table-action .btn.btn-sm:not(.btn-circle),
    .table-responsive .btn.btn-sm:not(.btn-circle) {
        min-height: 44px !important;
        padding: 8px 12px !important;
    }
}

@media (max-width: 575.98px) {
    .fc .fc-toolbar {
        align-items: stretch;
    }

    .fc .fc-toolbar-chunk {
        width: 100%;
        justify-content: flex-start;
    }

    .fc .fc-button-group {
        width: 100%;
    }

    .fc .fc-toolbar-chunk:nth-child(2) {
        order: -1;
        justify-content: space-between;
    }

    .fc .fc-toolbar-title {
        max-width: calc(100% - 100px);
        overflow-wrap: anywhere;
        font-size: 1.1rem;
    }
}

@media (max-width: 575.98px) {
    .page-titles > [class*="col-"],
    .page-titles .parent-page-actions {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }

    .parent-page-actions > .btn:not(.btn-circle):not(.btn-add-circle),
    .parent-page-actions > a.btn:not(.btn-circle):not(.btn-add-circle) {
        flex: 1 1 auto;
    }

    .modal-dialog {
        width: calc(100% - 16px);
        max-width: none;
        margin: 8px auto;
    }

    .modal-content {
        max-height: calc(100dvh - 16px);
    }

    .modal-body {
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .modal-footer > .btn:not(.btn-circle) {
        flex: 1 1 140px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .btn,
    .form-control,
    .table-hover tbody tr {
        transition: none;
    }
}

/* Module surfaces must not widen the authenticated shell when copy or
 * translated labels are longer than the card column. */
.attendee-admin,
.attendee-admin > *,
.attendee-template-layout > *,
.attendee-logo-layout > *,
.attendee-settings-layout > *,
.attendee-template-copy {
    min-width: 0;
    max-width: 100%;
}

.attendee-admin {
    overflow-x: clip;
}

.attendee-template-copy h5,
.attendee-template-copy p,
.attendee-template-copy small,
.attendee-card .card-header strong,
.attendee-card .card-header small {
    overflow-wrap: anywhere;
}

/* Public contract/proposal actions must remain readable over document surfaces.
 * The legacy theme's outline hover uses near-transparent cyan with white text,
 * which collapses contrast on the white document background. */
html.logged-out body.contracts .container-fluid.contract .docs-heading-wrapper .btn.btn-secondary,
html.logged-out body.contracts .container-fluid.contract .doc-footer-actions-container .btn.btn-secondary,
html.logged-out body.contracts .container-fluid.contract .docs-main-wrapper .btn.btn-secondary,
html.logged-out body.proposals .container-fluid.proposal .docs-heading-wrapper .btn.btn-secondary,
html.logged-out body.proposals .container-fluid.proposal .doc-footer-actions-container .btn.btn-secondary,
html.logged-out body.proposals .container-fluid.proposal .docs-main-wrapper .btn.btn-secondary {
    border-color: #52606d !important;
    background: #fff !important;
    color: #334155 !important;
}

html.logged-out body.contracts .container-fluid.contract .docs-heading-wrapper .btn.btn-secondary:hover,
html.logged-out body.contracts .container-fluid.contract .docs-heading-wrapper .btn.btn-secondary:focus,
html.logged-out body.contracts .container-fluid.contract .doc-footer-actions-container .btn.btn-secondary:hover,
html.logged-out body.contracts .container-fluid.contract .doc-footer-actions-container .btn.btn-secondary:focus,
html.logged-out body.contracts .container-fluid.contract .docs-main-wrapper .btn.btn-secondary:hover,
html.logged-out body.contracts .container-fluid.contract .docs-main-wrapper .btn.btn-secondary:focus,
html.logged-out body.proposals .container-fluid.proposal .docs-heading-wrapper .btn.btn-secondary:hover,
html.logged-out body.proposals .container-fluid.proposal .docs-heading-wrapper .btn.btn-secondary:focus,
html.logged-out body.proposals .container-fluid.proposal .doc-footer-actions-container .btn.btn-secondary:hover,
html.logged-out body.proposals .container-fluid.proposal .doc-footer-actions-container .btn.btn-secondary:focus,
html.logged-out body.proposals .container-fluid.proposal .docs-main-wrapper .btn.btn-secondary:hover,
html.logged-out body.proposals .container-fluid.proposal .docs-main-wrapper .btn.btn-secondary:focus {
    border-color: #075f7f !important;
    background: #075f7f !important;
    color: #fff !important;
}

html.logged-out body.contracts .container-fluid.contract .docs-heading-wrapper .btn.btn-secondary:active,
html.logged-out body.contracts .container-fluid.contract .doc-footer-actions-container .btn.btn-secondary:active,
html.logged-out body.contracts .container-fluid.contract .docs-main-wrapper .btn.btn-secondary:active,
html.logged-out body.proposals .container-fluid.proposal .docs-heading-wrapper .btn.btn-secondary:active,
html.logged-out body.proposals .container-fluid.proposal .doc-footer-actions-container .btn.btn-secondary:active,
html.logged-out body.proposals .container-fluid.proposal .docs-main-wrapper .btn.btn-secondary:active {
    border-color: #043c50 !important;
    background: #043c50 !important;
    color: #fff !important;
}

/* Modal controls need a full-size touch target and explicit keyboard/pressed
 * states; theme defaults otherwise make the close action too small and fade
 * secondary text to white on a translucent background. */
#commonModal #commonModalCloseIcon,
#commonModal #commonModalExtraCloseIcon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 50%;
    color: #334155;
    background: #fff;
}

#commonModal #commonModalCloseIcon:hover,
#commonModal #commonModalCloseIcon:focus,
#commonModal #commonModalCloseIcon:focus-visible,
#commonModal #commonModalExtraCloseIcon:hover,
#commonModal #commonModalExtraCloseIcon:focus,
#commonModal #commonModalExtraCloseIcon:focus-visible {
    border-color: #075f7f;
    color: #075f7f;
    background: #e7f3f7;
    outline: 3px solid rgba(7,95,127,.24);
    outline-offset: 2px;
}

#commonModal #commonModalCloseIcon:active,
#commonModal #commonModalExtraCloseIcon:active {
    border-color: #043c50;
    color: #fff;
    background: #043c50;
    outline: none;
}

#commonModal #commonModalCloseButton.btn-secondary {
    border-color: #52606d !important;
    background: #fff !important;
    color: #334155 !important;
}

#commonModal #commonModalCloseButton.btn-secondary:hover,
#commonModal #commonModalCloseButton.btn-secondary:focus,
#commonModal #commonModalCloseButton.btn-secondary:focus-visible {
    border-color: #075f7f !important;
    background: #075f7f !important;
    color: #fff !important;
}

#commonModal #commonModalCloseButton.btn-secondary:active {
    border-color: #043c50 !important;
    background: #043c50 !important;
    color: #fff !important;
}

/* The signature fragment is injected into the modal body. Reset Bootstrap's
 * negative row gutters, but leave the canvas width calculation and pointer
 * events intact so drawing remains usable at narrow viewports. */
#commonModalBody > .row,
#commonModalBody > .form-group.row {
    margin-right: 0;
    margin-left: 0;
}

#commonModalBody #signature-col-wrapper,
#commonModalBody #signature-wrapper {
    min-width: 0;
    max-width: 100%;
}

#commonModalBody #signature-wrapper {
    overflow: hidden;
}

#commonModalBody #signature-pad {
    display: block;
    max-width: 100%;
}

/* Bootstrap rows carry negative gutters intended for a surrounding container.
 * The standalone webform has no matching gutter, so contain those rows inside
 * the document instead of creating a 15px mobile outlier. */
html.webform,
html.webform body,
html.webform body .wrapper,
html.webform body #webform {
    min-width: 0;
    max-width: 100%;
    overflow-x: clip;
}

html.webform body #webform .form-group.row {
    max-width: 100%;
    margin-right: 0;
    margin-left: 0;
}

html.webform body #webform .form-group.row > [class*="col-"] {
    min-width: 0;
    max-width: 100%;
}

/* Warning icon actions inherit the theme's orange #ff9041, which is too light
 * on white list surfaces. Keep the warning meaning while using a readable
 * neutral outline at rest and darker filled interaction states. */
.btn.btn-outline-default.text-warning {
    border-color: #8a5200 !important;
    background: var(--grow-ui-surface) !important;
    color: #7a4600 !important;
}

.btn.btn-outline-default.text-warning:hover,
.btn.btn-outline-default.text-warning:focus,
.btn.btn-outline-default.text-warning:focus-visible {
    border-color: #6c3d00 !important;
    background: #6c3d00 !important;
    color: #fff !important;
}

.btn.btn-outline-default.text-warning:active,
.btn.btn-outline-default.text-warning.active {
    border-color: #4a2900 !important;
    background: #4a2900 !important;
    color: #fff !important;
}

/* TinyMCE's native child buttons retain vendor 28px geometry and weak state
 * colors unless the editor surface supplies an accessible control palette. */
.mce-tinymce {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
}

.mce-tinymce .mce-toolbar-grp,
.mce-tinymce .mce-toolbar,
.mce-tinymce .mce-toolbar > .mce-container-body {
    min-width: 0;
    max-width: 100%;
}

.mce-tinymce .mce-toolbar-grp {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-inline: contain;
}

.mce-tinymce .mce-btn {
    border-color: #9aa9b5 !important;
    background: #fff !important;
    color: #1f2937 !important;
}

.mce-tinymce .mce-btn button {
    background: #fff !important;
    border: 0 !important;
    color: inherit !important;
}

.mce-tinymce .mce-btn:hover,
.mce-tinymce .mce-btn:focus,
.mce-tinymce .mce-btn:focus-within {
    border-color: #075f7f !important;
    background: #e7f3f7 !important;
    color: #043c50 !important;
}

.mce-tinymce .mce-btn:hover button,
.mce-tinymce .mce-btn:focus button,
.mce-tinymce .mce-btn:focus-within button {
    background: #e7f3f7 !important;
    color: inherit !important;
}

.mce-tinymce .mce-btn:focus-visible,
.mce-tinymce .mce-btn button:focus-visible {
    outline: 3px solid rgba(7, 95, 127, .35) !important;
    outline-offset: 1px;
}

.mce-tinymce .mce-btn:active,
.mce-tinymce .mce-btn.mce-active,
.mce-tinymce .mce-btn.mce-active:hover {
    border-color: #075f7f !important;
    background: #075f7f !important;
    color: #fff !important;
}

.mce-tinymce .mce-btn:active button,
.mce-tinymce .mce-btn.mce-active button,
.mce-tinymce .mce-btn.mce-active:hover button {
    background: #075f7f !important;
    color: inherit !important;
}

/* Billing's line-item controls are secondary actions, but the theme's coral
 * hover state is not readable against the editor surface. */
.invoice-item-actions .btn.btn-secondary {
    border-color: #52606d !important;
    background: #fff !important;
    color: #334155 !important;
}

.invoice-item-actions .btn.btn-secondary .text-themecontrast {
    color: inherit !important;
}

.invoice-item-actions .btn.btn-secondary:hover,
.invoice-item-actions .btn.btn-secondary:focus,
.invoice-item-actions .btn.btn-secondary:focus-visible {
    border-color: #075f7f !important;
    background: #075f7f !important;
    color: #fff !important;
}

.invoice-item-actions .btn.btn-secondary:active,
.invoice-item-actions .btn.btn-secondary.active {
    border-color: #043c50 !important;
    background: #043c50 !important;
    color: #fff !important;
}

/* Destructive text links keep their meaning while meeting contrast in every
 * interaction state, including themes that fade links on hover. */
a.btn-link.text-danger,
button.btn-link.text-danger,
a.btn.btn-link.text-danger,
button.btn.btn-link.text-danger,
a.text-link.text-danger,
button.text-link.text-danger {
    background: transparent !important;
    border-color: transparent !important;
    color: #a61b33 !important;
}

a.btn.btn-link.text-danger > i,
button.btn.btn-link.text-danger > i {
    color: inherit !important;
}

a.btn-link.text-danger:hover,
a.btn-link.text-danger:focus,
a.btn-link.text-danger:focus-visible,
button.btn-link.text-danger:hover,
button.btn-link.text-danger:focus,
button.btn-link.text-danger:focus-visible,
a.btn.btn-link.text-danger:hover,
a.btn.btn-link.text-danger:focus,
a.btn.btn-link.text-danger:focus-visible,
button.btn.btn-link.text-danger:hover,
button.btn.btn-link.text-danger:focus,
button.btn.btn-link.text-danger:focus-visible,
a.text-link.text-danger:hover,
a.text-link.text-danger:focus,
a.text-link.text-danger:focus-visible,
button.text-link.text-danger:hover,
button.text-link.text-danger:focus,
button.text-link.text-danger:focus-visible {
    background: transparent !important;
    border-color: transparent !important;
    color: #7d1328 !important;
    text-decoration: underline;
}

a.btn.btn-link.text-danger:hover > i,
a.btn.btn-link.text-danger:focus > i,
a.btn.btn-link.text-danger:focus-visible > i,
button.btn.btn-link.text-danger:hover > i,
button.btn.btn-link.text-danger:focus > i,
button.btn.btn-link.text-danger:focus-visible > i {
    color: inherit !important;
}

a.btn-link.text-danger:active,
a.btn-link.text-danger.active,
button.btn-link.text-danger:active,
button.btn-link.text-danger.active,
a.btn.btn-link.text-danger:active,
a.btn.btn-link.text-danger.active,
button.btn.btn-link.text-danger:active,
button.btn.btn-link.text-danger.active,
a.text-link.text-danger:active,
a.text-link.text-danger.active,
button.text-link.text-danger:active,
button.text-link.text-danger.active {
    background: transparent !important;
    border-color: transparent !important;
    color: #5c0e1d !important;
}

a.btn.btn-link.text-danger:active > i,
a.btn.btn-link.text-danger.active > i,
button.btn.btn-link.text-danger:active > i,
button.btn.btn-link.text-danger.active > i {
    color: inherit !important;
}

@media (max-width: 991.98px) {
    /* Resize the actual native controls, including split-button children;
     * changing only the .mce-btn wrapper leaves a 28px keyboard target. */
    .mce-tinymce .mce-btn,
    .mce-tinymce .mce-btn button,
    .mce-tinymce .mce-splitbtn .mce-open {
        box-sizing: border-box;
        min-width: 44px !important;
        min-height: 44px !important;
        height: 44px !important;
    }

    .mce-tinymce .mce-btn button {
        align-items: center;
        display: inline-flex;
        justify-content: center;
        padding: 8px 10px !important;
    }

    .mce-tinymce .mce-splitbtn .mce-open {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0 !important;
    }
}

/* Native TinyMCE children also need a desktop baseline and their own hover
 * state; split-button wrapper styling alone leaves the open child unchanged. */
.mce-tinymce .mce-btn,
.mce-tinymce .mce-btn button,
.mce-tinymce .mce-splitbtn .mce-open {
    box-sizing: border-box;
    min-width: 32px !important;
    min-height: 32px !important;
    height: 32px !important;
}

.mce-tinymce .mce-btn button:hover,
.mce-tinymce .mce-btn button:focus,
.mce-tinymce .mce-btn button:focus-visible,
.mce-tinymce .mce-splitbtn .mce-open:hover,
.mce-tinymce .mce-splitbtn .mce-open:focus,
.mce-tinymce .mce-splitbtn .mce-open:focus-visible {
    background: #e7f3f7 !important;
    color: #043c50 !important;
    outline: 3px solid rgba(7, 95, 127, .35) !important;
    outline-offset: 1px;
}

.mce-tinymce .mce-btn button:active,
.mce-tinymce .mce-btn button.mce-active,
.mce-tinymce .mce-splitbtn .mce-open:active,
.mce-tinymce .mce-splitbtn .mce-open.mce-active,
.mce-tinymce .mce-splitbtn .mce-open.active,
.mce-tinymce .mce-splitbtn .mce-open[aria-pressed="true"] {
    background: #043c50 !important;
    border-color: #021f2a !important;
    color: #fff !important;
}

.mce-tinymce .mce-splitbtn .mce-open:active,
.mce-tinymce .mce-splitbtn .mce-open.mce-active,
.mce-tinymce .mce-splitbtn .mce-open.active,
.mce-tinymce .mce-splitbtn .mce-open[aria-pressed="true"] {
    background: #043c50 !important;
    border-color: #021f2a !important;
    color: #fff !important;
}

.mce-tinymce .mce-splitbtn.mce-active .mce-open:hover,
.mce-tinymce .mce-splitbtn.mce-active .mce-open:focus,
.mce-tinymce .mce-splitbtn.mce-active .mce-open:focus-visible {
    background: #043c50 !important;
    border-color: #043c50 !important;
    color: #fff !important;
}

/* TinyMCE can leave a split menu wrapper in its active visual state while
 * the native open button remains a separate control. Keep its hover state
 * visibly distinct even when the wrapper is already active. */
.mce-tinymce .mce-splitbtn .mce-open:hover,
.mce-tinymce .mce-splitbtn .mce-open:focus,
.mce-tinymce .mce-splitbtn .mce-open:focus-visible {
    background: #075f7f !important;
    border-color: #043c50 !important;
    color: #fff !important;
}

.mce-tinymce .mce-splitbtn .mce-open:active,
.mce-tinymce .mce-splitbtn .mce-open.mce-active,
.mce-tinymce .mce-splitbtn .mce-open.active,
.mce-tinymce .mce-splitbtn .mce-open[aria-pressed="true"] {
    background: #043c50 !important;
    border-color: #021f2a !important;
    color: #fff !important;
}

/* Dropdown navigation tabs otherwise retain the same appearance after the
 * crawler applies the active state. */
.nav-link.tabs-menu-item.active,
.dropdown-toggle.tabs-menu-item[aria-expanded="true"],
.nav-link.tabs-menu-item:active {
    background: #e7f3f7 !important;
    border-bottom-color: #075f7f !important;
    color: #075f7f !important;
}

@media (max-width: 991.98px) {
    .nav-link.tabs-menu-item {
        min-height: 44px !important;
        display: inline-flex;
        align-items: center;
    }
}

/* The shared partial is also used by contacts and users, where the theme's
 * compact rule wins over the touch-target media query. */
#load-more-button {
    align-items: center;
    display: inline-flex;
    min-height: 44px !important;
}

/* Keep the destructive active text readable when later theme rules set a
 * light red foreground over the dark outline background. */
.btn.btn-outline-danger.active:not(:disabled):not(.disabled),
.btn.btn-outline-danger:active:not(:disabled):not(.disabled) {
    border-color: #8d1930 !important;
    background: #8d1930 !important;
    color: #fff !important;
}

/* The billing theme scopes line-item actions more specifically than the
 * shared palette. Match that scope so coral hover rules cannot win. */
.invoice .invoice-wrapper .invoice-item-actions .btn.btn-secondary,
.estimate .invoice-wrapper .invoice-item-actions .btn.btn-secondary {
    border-color: #52606d !important;
    background: #fff !important;
    color: #334155 !important;
}

.invoice .invoice-wrapper .invoice-item-actions .btn.btn-secondary:hover,
.invoice .invoice-wrapper .invoice-item-actions .btn.btn-secondary:focus,
.invoice .invoice-wrapper .invoice-item-actions .btn.btn-secondary:focus-visible,
.estimate .invoice-wrapper .invoice-item-actions .btn.btn-secondary:hover,
.estimate .invoice-wrapper .invoice-item-actions .btn.btn-secondary:focus,
.estimate .invoice-wrapper .invoice-item-actions .btn.btn-secondary:focus-visible {
    border-color: #075f7f !important;
    background: #075f7f !important;
    color: #fff !important;
}

.invoice .invoice-wrapper .invoice-item-actions .btn.btn-secondary:active,
.invoice .invoice-wrapper .invoice-item-actions .btn.btn-secondary.active,
.estimate .invoice-wrapper .invoice-item-actions .btn.btn-secondary:active,
.estimate .invoice-wrapper .invoice-item-actions .btn.btn-secondary.active {
    border-color: #043c50 !important;
    background: #043c50 !important;
    color: #fff !important;
}

.invoice .invoice-wrapper .invoice-item-actions .btn.btn-secondary > i,
.estimate .invoice-wrapper .invoice-item-actions .btn.btn-secondary > i {
    color: inherit !important;
}

/* Compact ticket/history actions still need a usable desktop pointer target;
 * the touch rule below raises these to 44px where space permits. */
.btn.btn-xs {
    min-height: 32px !important;
}

@media (max-width: 991.98px) {
    .btn.btn-xs,
    .invoice .invoice-wrapper .invoice-item-actions .btn,
    .estimate .invoice-wrapper .invoice-item-actions .btn,
    .invoice #bill-file-attachments-upload-button,
    .estimate #bill-file-attachments-upload-button {
        min-width: 44px !important;
        min-height: 44px !important;
        height: 44px !important;
    }

    .mce-tinymce .mce-btn,
    .mce-tinymce .mce-btn button,
    .mce-tinymce .mce-splitbtn .mce-open {
        min-width: 44px !important;
        min-height: 44px !important;
        height: 44px !important;
    }
}