/*
 * IPcom CRM Admin resource pages.
 *
 * Presentation only.
 * No resource-specific PHP or behaviour changes.
 */

/* Resource/list table shell */

.fi-ta {
    overflow: hidden;
    border: 1px solid rgb(226 232 240);
    border-radius: 14px;
    background: rgb(255 255 255);
    box-shadow:
        0 1px 2px rgb(15 23 42 / 0.03),
        0 5px 18px rgb(15 23 42 / 0.035);
}

/* Search / filter / column toolbar */

/* Toolbar menus must escape short tables; scrolling belongs inside the menu. */
.fi-ta:has(.fi-ta-col-manager-dropdown, .fi-ta-filters-dropdown),
.fi-ta-ctn:has(.fi-ta-col-manager-dropdown, .fi-ta-filters-dropdown) {
    overflow: visible;
}

.fi-ta-col-manager-dropdown > .fi-dropdown-panel,
.fi-ta-filters-dropdown > .fi-dropdown-panel {
    max-height: min(24rem, 50dvh);
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scrollbar-gutter: stable;
}

.fi-ta-header {
    border-bottom: 1px solid rgb(226 232 240);
    background:
        linear-gradient(
            90deg,
            rgb(248 250 252) 0%,
            rgb(255 251 235) 100%
        );
}

/* Column heading layer */

.fi-ta-table thead,
.fi-ta-table thead tr {
    background: rgb(248 250 252);
}

.fi-ta-table thead th {
    border-bottom-color: rgb(203 213 225);
}

/* Easier row scanning */

.fi-ta-table tbody tr {
    transition:
        background-color 100ms ease;
}

.fi-ta-table tbody tr:hover {
    background: rgb(248 250 252 / 0.9);
}

/* Slightly clearer table headings */

.fi-ta-header-heading {
    color: rgb(15 23 42);
    font-weight: 700;
}

/* Resource page header */

.fi-page-header-main-ctn {
    gap: 1rem;
}

/* Secondary actions stay quieter than primary actions */

.fi-page-header-actions .fi-btn-color-gray {
    border-color: rgb(203 213 225);
    background: rgb(255 255 255);
}

/* Forms and sections */

/* Campaign workflow tabs */

.ipcom-campaign-tabs > .fi-tabs {
    gap: 0.5rem;
    padding: 0.75rem;
    border-bottom: 1px solid rgb(203 213 225);
    background: rgb(248 250 252);
}

.ipcom-campaign-tabs > .fi-tabs > .fi-tabs-item {
    border: 1px solid rgb(203 213 225);
    background: rgb(255 255 255);
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
}

.ipcom-campaign-tabs > .fi-tabs > .fi-tabs-item:hover {
    border-color: rgb(8 119 124 / 0.55);
    background: rgb(240 253 250);
}

.ipcom-campaign-tabs > .fi-tabs > .fi-tabs-item.fi-active {
    border-color: rgb(8 119 124);
    background: rgb(204 251 241);
    box-shadow:
        0 0 0 1px rgb(8 119 124 / 0.15),
        0 2px 5px rgb(15 23 42 / 0.08);
}

.ipcom-campaign-tabs > .fi-tabs > .fi-tabs-item.fi-active .fi-tabs-item-label {
    color: rgb(15 86 91);
    font-weight: 700;
}

.fi-section {
    border-color: rgb(226 232 240);
    box-shadow:
        0 1px 2px rgb(15 23 42 / 0.025),
        0 4px 14px rgb(15 23 42 / 0.025);
}

.fi-section-header {
    border-bottom-color: rgb(226 232 240);
}

/* Dark mode */

.dark .fi-ta {
    border-color: rgb(55 65 81);
    background: rgb(17 24 39);
}

.dark .fi-ta-header,
.dark .fi-ta-table thead,
.dark .fi-ta-table thead tr {
    background: rgb(17 24 39);
    border-color: rgb(55 65 81);
}

.dark .fi-ta-table tbody tr:hover {
    background: rgb(255 255 255 / 0.035);
}

.dark .fi-ta-header-heading {
    color: rgb(241 245 249);
}

.dark .fi-section {
    border-color: rgb(55 65 81);
}

.dark .ipcom-campaign-tabs > .fi-tabs {
    border-color: rgb(55 65 81);
    background: rgb(17 24 39);
}

.dark .ipcom-campaign-tabs > .fi-tabs > .fi-tabs-item {
    border-color: rgb(75 85 99);
    background: rgb(31 41 55);
}

.dark .ipcom-campaign-tabs > .fi-tabs > .fi-tabs-item:hover {
    border-color: rgb(45 212 191 / 0.7);
    background: rgb(19 78 74 / 0.45);
}

.dark .ipcom-campaign-tabs > .fi-tabs > .fi-tabs-item.fi-active {
    border-color: rgb(45 212 191);
    background: rgb(19 78 74 / 0.7);
}

.dark .ipcom-campaign-tabs > .fi-tabs > .fi-tabs-item.fi-active .fi-tabs-item-label {
    color: rgb(153 246 228);
}

/*
 * Unread conversation emphasis.
 * Keep the treatment subtle: the New badge remains the primary alert.
 */
.fi-ta-row.ipcom-unread-row > td,
tr.ipcom-unread-row > td {
    background-color: #eaf2fb;
}

.fi-ta-row.ipcom-unread-row:hover > td,
tr.ipcom-unread-row:hover > td {
    background-color: #dceafa;
}

.dark .fi-ta-row.ipcom-unread-row > td,
.dark tr.ipcom-unread-row > td {
    background-color: rgba(37, 99, 235, 0.16);
}

.dark .fi-ta-row.ipcom-unread-row:hover > td,
.dark tr.ipcom-unread-row:hover > td {
    background-color: rgba(37, 99, 235, 0.24);
}