/* ==========================================================
   BASE TYPOGRAPHY
========================================================== */
html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width: 768px) {
    html {
        font-size: 15px;
    }
}

body {
    font: 14px/1.5 "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
}

/* ==========================================================
   FORM CONTROLS
========================================================== */
.form-control,
.form-select,
textarea.form-control {
    border-radius: 6px;
    border-color: #ced4da;
    min-height: 38px;
}

    .form-control:focus,
    .form-select:focus,
    .form-check-input:focus,
    textarea.form-control:focus {
        border-color: #8dbdaf !important;
        box-shadow: 0 0 0 0.18rem rgba(121, 181, 168, 0.18) !important;
        outline: none;
    }

/* buttons */
.btn:focus,
.btn:active:focus {
    outline: none;
    box-shadow: none !important;
}

.btn-primary {
    background-color: #79b5a8;
    border-color: #79b5a8;
}

    .btn-primary:hover,
    .btn-primary:focus {
        background-color: #6aa99b;
        border-color: #6aa99b;
    }

.btn-outline-primary {
    color: #4f9284;
    border-color: #79b5a8;
}

    .btn-outline-primary:hover,
    .btn-outline-primary:focus {
        background-color: #79b5a8;
        border-color: #79b5a8;
        color: #fff;
    }

.btn-warning {
    color: #3f3200;
}

/* ==========================================================
   FLOATING LABELS
========================================================== */
.form-floating > .form-control::placeholder,
.form-floating > .form-control-plaintext::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control:focus::placeholder,
.form-floating > .form-control-plaintext:focus::placeholder {
    text-align: start;
}

/* ==========================================================
   TABLES
========================================================== */
table {
    width: 100%;
    border-collapse: collapse;
}

.table {
    --bs-table-bg: #fff;
    --bs-table-striped-bg: #f8fafb;
    --bs-table-hover-bg: #f2f6f5;
    border-color: #dee3e7;
}

    .table thead th {
        background: #f8f9fa;
        color: #2a3948;
        font-weight: 600;
        border-bottom-width: 1px;
    }

/* ==========================================================
   MEDIA / UTILITIES
========================================================== */
img {
    max-width: 100%;
    height: auto;
}

a,
button {
    outline: none !important;
}

.text-muted {
    color: #6f7c89 !important;
}


/* ==========================================================
   DATATABLES - GLOBAL IRIS STYLING
========================================================== */

/* wrapper spacing */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    font-size: 0.9rem;
    color: var(--iris-text);
}

    /* search input and length dropdown */
    .dataTables_wrapper .dataTables_filter input,
    .dataTables_wrapper .dataTables_length select {
        border: 1px solid var(--iris-border);
        border-radius: 6px;
        min-height: 36px;
        padding: 0.35rem 0.65rem;
        background: #fff;
        color: var(--iris-text);
    }

        .dataTables_wrapper .dataTables_filter input:focus,
        .dataTables_wrapper .dataTables_length select:focus {
            border-color: var(--iris-accent-deep);
            box-shadow: 0 0 0 0.18rem rgba(121, 181, 168, 0.18);
            outline: none;
        }

/* table shell */
table.dataTable,
.table.dataTable {
    border-collapse: separate !important;
    border-spacing: 0;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

    /* header */
    table.dataTable thead th,
    table.dataTable thead td,
    .table.dataTable thead th,
    .table.dataTable thead td {
        background: var(--iris-topbar) !important;
        color: #fff !important;
        border-bottom: 1px solid #243240 !important;
        border-top: 0 !important;
        padding-top: 0.8rem;
        padding-bottom: 0.8rem;
        font-weight: 600;
        vertical-align: middle;
        white-space: nowrap;
    }

        /* keep first/last header edges neat inside cards */
        table.dataTable thead th:first-child,
        .table.dataTable thead th:first-child {
            border-top-left-radius: 6px;
        }

        table.dataTable thead th:last-child,
        .table.dataTable thead th:last-child {
            border-top-right-radius: 6px;
        }

    /* sorting icons */
    table.dataTable thead .sorting,
    table.dataTable thead .sorting_asc,
    table.dataTable thead .sorting_desc,
    table.dataTable thead .sorting_asc_disabled,
    table.dataTable thead .sorting_desc_disabled {
        position: relative;
        color: #fff !important;
    }

        table.dataTable thead .sorting:before,
        table.dataTable thead .sorting:after,
        table.dataTable thead .sorting_asc:before,
        table.dataTable thead .sorting_asc:after,
        table.dataTable thead .sorting_desc:before,
        table.dataTable thead .sorting_desc:after,
        table.dataTable thead .sorting_asc_disabled:before,
        table.dataTable thead .sorting_asc_disabled:after,
        table.dataTable thead .sorting_desc_disabled:before,
        table.dataTable thead .sorting_desc_disabled:after {
            color: rgba(255, 255, 255, 0.72) !important;
            opacity: 1 !important;
        }

    /* body rows */
    table.dataTable tbody td,
    .table.dataTable tbody td {
        vertical-align: middle;
        border-top: 1px solid var(--iris-border-soft);
    }

    /* hover rows */
    table.dataTable.table-hover tbody tr:hover,
    .table.dataTable.table-hover tbody tr:hover,
    table.dataTable tbody tr:hover,
    .table.dataTable tbody tr:hover {
        background-color: #f4f7f8 !important;
    }

/* pagination buttons */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    border-radius: 4px !important;
    border: 1px solid transparent !important;
    color: var(--iris-text) !important;
    background: transparent !important;
}

    .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
        border: 1px solid var(--iris-border) !important;
        background: #f5f7f9 !important;
        color: var(--iris-text) !important;
    }

    .dataTables_wrapper .dataTables_paginate .paginate_button.current,
    .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
        background: var(--iris-topbar) !important;
        border: 1px solid var(--iris-topbar) !important;
        color: #fff !important;
    }

/* bootstrap 5 pagination mode support */
.dataTables_wrapper .pagination .page-item .page-link {
    color: var(--iris-text);
    border-color: var(--iris-border);
}

.dataTables_wrapper .pagination .page-item.active .page-link {
    background: var(--iris-topbar);
    border-color: var(--iris-topbar);
    color: #fff;
}

.dataTables_wrapper .pagination .page-item .page-link:focus {
    box-shadow: none;
}

/* processing badge */
.dataTables_wrapper .dataTables_processing {
    border: 1px solid var(--iris-border);
    border-radius: 6px;
    background: #fff;
    color: var(--iris-text);
    box-shadow: var(--iris-shadow-sm);
}


.portal-title-icon {
    color: var(--iris-accent-deep);
}