/*@import url("https://www.fontstatic.com/f=flat-jooza");*/
/*@import url("https://fonts.googleapis.com/css2?family=Cairo:wght@400;700&display=swap");*/
/*@import url("https://fonts.googleapis.com/css2?family=Tajawal:wght@400;700&display=swap");*/
/*@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;700&display=swap");*/
/*@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@400;700&display=swap");*/
/*@import url("https://fonts.googleapis.com/css2?family=Changa:wght@400;700&display=swap");*/
/*@import url("https://www.fontstatic.com/f=dubai,dubai-light,dubai-medium,dubai-bold");*/
/*@import url("https://www.fontstatic.com/f=jazeera,jazeera-light");*/
/*@import url("https://www.fontstatic.com/f=sky-bold,sky");*/
/*@import url("https://www.fontstatic.com/f=bahij");*/
/*var(--body-font-family), 'flat-jooza'*/
/*var(--body-font-family)*/

@font-face {
    font-family: 'Noto Sans Arabic';
    src: url('../../fonts/Noto_Sans_Arabic/notosansarabic.woff2') format('woff2');
}

@font-face {
    font-family: 'Almarai';
    src: url('../../fonts/Almarai/Almarai.woff2') format('woff2');
}

body {
    /*font-family: Roboto, 'flat-jooza', sans-serif !important;*/
    /*font-family: Inter, 'Tajawal', sans-serif !important;*/
    /*font-family: Inter, 'IBM Plex Sans Arabic', sans-serif !important;*/
    font-family: Inter, 'Noto Sans Arabic', sans-serif !important;
    /*font-family: Inter, 'Changa', sans-serif !important;*/
    /*font-family: Inter, 'Cairo', sans-serif !important;*/
}

@font-face {
    font-family: 'SaudiRiyalSymbol';
    src: url('../../fonts/saudiriyalsymbol.woff2') format('woff2'),
    url('../../fonts/saudiriyalsymbol.woff') format('woff'),
    url('../../fonts/saudiriyalsymbol.otf') format('opentype');
}
.sar_icon {
    font-family: 'SaudiRiyalSymbol', sans-serif;
    font-size: inherit;
    /*margin: 20px auto;*/
    color: inherit;
    /*font-weight: bold;*/
}

.nav-sidebar .nav-link i {
    margin-right: 0.7rem !important;
}

.dt-btn-icon {
    padding: 0.3rem !important;
}

.btn-group-sm > .btn, .btn-sm {
    --btn-padding-y: 0.375rem;
    --btn-padding-x: 0.5rem;
    --btn-font-size: var(--body-font-size-sm);
    --btn-border-radius: var(--border-radius-sm);
}

.btn-card-header{
    --btn-padding-y: 0.24rem !important;
    --btn-padding-x: 0.5rem !important;
}

.table > :not(caption) > * > * {
    padding: 0.5rem var(--table-cell-padding-x) !important;
}


.label {
    align-items: center;
    border-radius: .5rem;
    display: inline-flex;
    font-size: .75rem;
    font-weight: 500;
    line-height: 1rem;
    padding: .25rem .625rem;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
}

.label-danger {
    --tw-border-opacity: 1;
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    background-color: rgb(254 242 242/var(--tw-bg-opacity));
    border-color: rgb(255, 193, 193);
    border-style: solid;
    border-width: 1px;
    color: rgb(220 38 38/var(--tw-text-opacity));
}

.label-success {
    --tw-border-opacity: 1;
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    background-color: rgb(240 253 244/var(--tw-bg-opacity));
    border-color: rgb(187 247 208/var(--tw-border-opacity));
    border-style: solid;
    border-width: 1px;
    color: rgb(22 163 74/var(--tw-text-opacity));
}

.label-warning {
    --tw-border-opacity: 1;
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    background-color: rgb(254 252 232/var(--tw-bg-opacity));
    border-color: rgb(254 240 138/var(--tw-border-opacity));
    border-style: solid;
    border-width: 1px;
    color: rgb(153, 135, 0) !important;
}

.label-dark {
    --tw-border-opacity: 1;
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    background-color: rgb(248 250 252/var(--tw-bg-opacity));
    border-color: rgb(193, 193, 193);
    border-style: solid;
    border-width: 1px;
    color: rgb(51 65 85/var(--tw-text-opacity));
}

.label-info {
    --tw-border-opacity: 1;
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    background-color: rgb(231, 252, 255) !important;
    border-color: rgb(156, 239, 249) !important;
    border-style: solid;
    border-width: 1px;
    color: #1f7a72;;
}

.label-primary {
    --tw-border-opacity: 1;
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    background-color: rgb(232, 244, 255) !important;
    border-color: rgb(207, 231, 255) !important;
    border-style: solid;
    border-width: 1px;
    color: rgb(9, 117, 224) !important;
}

.label-secondary {
    --tw-border-opacity: 1;
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    background-color: rgba(36, 114, 151, 0.1) !important;
    border-color: rgb(162, 208, 230) !important;
    border-style: solid;
    border-width: 1px;
    color: rgba(var(--secondary-rgb),var(--text-opacity)) !important
}

.label-pink {
    background-color: #fff1f3;
    color: #ff4d6d;
    border: 1px solid #ffc3ce;
    border-radius: 5px;
    padding: .25rem .625rem;
}

.label-purple {
    background-color: #fdf1ff;
    color: #8e44ad;
    border: 1px solid #df93ff;
    border-radius: 5px;
    padding: .25rem .625rem;
}

.table.dataTable > thead:first-child > tr:first-child > th:first-child {
    /*border: 1px solid #e5e5e5 !important;*/
}

.table.dataTable > thead:first-child > tr:first-child > th, table.dataTable thead > tr > th {
    border-top: 1px rgba(226,232,240,.7) !important;
    border-top-color: rgba(226, 232, 240, 0.7) !important;
}

table.dataTable thead > tr > th {
    --tw-bg-opacity: 1 !important;
    --tw-text-opacity: 1 !important;
    background-color: var(--body-bg) !important;
    color: rgb(71 85 105/var(--tw-text-opacity)) !important;
    font-size: 13.5px !important;
    white-space: nowrap !important;
    border: 1px solid #e5e5e5 !important;
}

tr {
    border-color: rgba(226,232,240,.7) !important;
    border-style: solid;
    border-width: 0;
}

.sidebar {
    background: #1e293b;
}

.btn-default {
    --tw-border-opacity: 1;
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity));
    border-color: rgb(203 213 225/var(--tw-border-opacity));
    color: rgb(51 65 85/var(--tw-text-opacity));
}

.btn-default:hover {
    --tw-border-opacity: 1;
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    background-color: rgb(251, 251, 251);
    border-color: rgb(203 213 225/var(--tw-border-opacity));
    color: rgb(51 65 85/var(--tw-text-opacity));
}

.form-label {
    --form-label-margin-bottom: 0.3rem;
    padding-left: 1px;
}


.navbar-search-input {
    background-color: rgba(203,213,225,.3) !important;
    --input-border-color: none !important;
}

.iti--inline-dropdown{
    width: 100%;
}


.iti__search-input {
    --input-padding-y: 0.3rem;
    --input-padding-x: 0.655rem;
    --input-height: calc(calc(var(--input-line-height) * 1em) + calc(var(--input-padding-y) * 2) + calc(var(--border-width) * 2));
    --input-bg: var(--white);
    --input-color: var(--body-color);
    --input-plaintext-color: var(--body-color);
    --input-placeholder-color: var(--gray-600);
    --input-font-weight: 400;
    --input-font-size: var(--body-font-size);
    --input-line-height: var(--body-line-height);
    --input-border-width: var(--border-width);
    --input-border-color: var(--gray-400);
    --input-border-radius: var(--border-radius);
    --input-box-shadow: 0 0 0 0 transparent;
    --input-focus-bg: var(--white);
    --input-focus-border-color: var(--component-active-bg);
    --input-focus-box-shadow: var(--focus-ring-box-shadow);
    --input-disabled-bg: var(--gray-100);
    --input-disabled-border-color: var(--gray-400);
    display: block !important;
    width: 100% !important;
    padding: var(--input-padding-y) var(--input-padding-x) !important;
    font-size: var(--input-font-size) !important;
    font-weight: var(--input-font-weight) !important;
    line-height: var(--input-line-height) !important;
    color: var(--input-color) !important;
    background-color: var(--input-bg) !important;
    background-clip: padding-box !important;
    border: var(--input-border-width) solid var(--input-border-color) !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    border-radius: var(--input-border-radius) !important;
    box-shadow: var(--input-box-shadow) !important;
    transition: border-color var(--transition-base-timer) ease-in-out,box-shadow var(--transition-base-timer) ease-in-out !important;
}


.tooltip {
    font-size: 13px;
}


.uppy-size--md .uppy-Dashboard-dropFilesTitle {
    font-size: 20px !important;
}

.uppy-size--md .uppy-Dashboard-note {
    font-size: 14px !important;
}

.uppy-size--md .uppy-DashboardAddFiles-info {
    bottom: 80px !important;
}


@media (prefers-color-scheme: dark) {
    .iti {
        --iti-border-color: #5b5b5b;
        --iti-dialcode-color: #999999;
        --iti-dropdown-bg: #0d1117;
        --iti-arrow-color: #aaaaaa;
        --iti-hover-color: #30363d;
        --iti-path-globe-1x: url("path/to/globe_light.webp");
        --iti-path-globe-2x: url("path/to/globe_light@2x.webp");
    }
}


.dir-ltr{
    direction: ltr !important;
}

.dir-rtl {
    direction: rtl !important;
}

.ext-form-input {
    background-color: var(--gray-200);
}

.iti__tel-input{
    padding-left: 86px !important;
}

.iti__country-container{
    direction: ltr !important;
    left: 0 !important;
}

[dir="rtl"] .iti__arrow {

    margin-left: 2px;
}


.inputs input {
    width: 45px;
    height: 45px;
    font-size: large;
    border: 2px solid var(--gray-400);
}

.inputs input[type=number]::-webkit-inner-spin-button,
.inputs input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0
}


.inputs .invalid-feedback {
    display: none !important;
}


.disabled-a{
    pointer-events: none;
    color: gray;
    text-decoration: none;
}

.file-name{
    color: inherit;
}

.list-feed .rounded{
    width: fit-content !important;

}


 .table-c {
     width: 100%;
 }

.table-c th, .table-c td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
}

.table-c th {
    background-color: #f4f4f4;
    text-align: center;
}

.table-c td {
    vertical-align: top;
}

.comparison-row td {
    text-align: right;
    background-color: #f9f9f9;
    border-top: none;
}

.table-border-dashed td {
    border-top: 1px dashed #ccc;
}


.table-create-comparison {
    text-align: center;
    padding: 8px;
}

/*.table-create-comparison input, select{*/
/*    --input-padding-y: 0.3rem;*/
/*}*/

.notification-bg{
    background-color: rgb(255, 60, 50) !important;
    color: white !important;
}


.btn_group_select2 .select2-container {
    width: 70% !important;
}

.sidebar {
    width: 17rem;
}

.sidebar-component{
    width: inherit !important;
}

/* Main sidebar styling */
.sidebar-dark {
    background-color: #1e293b; /* Slate-800 from Tailwind */
    color: #f8fafc; /* Slate-50 from Tailwind */
}

/* Sidebar header */
.sidebar-section.bg-black {
    background-color: rgba(15, 23, 42, 0.5); /* Darker background for header */
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

/* Logo section */
.sidebar-logo {
    padding: 1rem;
}

/* Navigation items */
.nav-sidebar {
    padding: 0.5rem;
}

.nav-item-header {
    padding: 0.75rem 0.5rem 0.5rem 0.5rem;
}

.nav-item-header .text-uppercase {
    color: rgba(248, 250, 252, 0.6); /* Lighter text for headers */
    font-size: 0.75rem;
    font-weight: 500;
}

/* Navigation links */
.nav-sidebar .nav-link {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-radius: 0.375rem;
    /*color: #cbd5e1; !* Slate-300 *!*/
    margin-bottom: 0.25rem;
    transition: all 0.2s;
    position: relative; /* Important for positioning the dropdown arrow */
}

.nav-sidebar .nav-link:hover {
    background-color: #334155; /* Slate-700 */
    color: #ffffff;
}

.nav-sidebar .nav-link.active {
    background-color: #334155; /* Slate-700 */
    color: #ffffff;
}

/* Icons in navigation */
.nav-sidebar .nav-link i {
    margin-right: 0.75rem;
    font-size: 1.25rem;
}

/* Submenu styling */
.nav-group-sub {
    padding-left: 2.5rem;
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
}

.nav-group-sub .nav-link {
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
}

/* Active submenu */
.nav-item-expanded.nav-item-open > a {
    background-color: #334155; /* Slate-700 */
    color: #ffffff;
}

/* User section at bottom */
.sidebar-content + div {
    border-top-color: #334155; /* Slate-700 */
    padding: 1rem;
}

/* FIX: Submenu indicators - completely revised */
/*.nav-item-submenu > a::after {*/
/*    content: '';*/
/*    display: inline-block;*/
/*    width: 0.75rem;*/
/*    height: 0.75rem;*/
/*    position: absolute;*/
/*    right: 0.75rem;*/
/*    top: 50%;*/
/*    transform: translateY(-50%);*/
/*    !*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23cbd5e1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");*!*/
/*    background-size: contain;*/
/*    background-repeat: no-repeat;*/
/*    background-position: center;*/
/*    transition: transform 0.2s;*/
/*}*/

.nav-item-expanded.nav-item-open > a::after {
    transform: translateY(-50%) rotate(180deg);
    /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");*/
}

/* Highlight active submenu items */
.nav-group-sub .active {
    background-color: #1e293b; /* Slate-700 */
    color: #ffffff;
    font-weight: 500;
}

/* Section headers */
.nav-item-header .text-uppercase {
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.5);
}

/* Active menu item styling */
.nav-sidebar .nav-item-open > .nav-link,
.nav-sidebar .nav-item-active > .nav-link {
    background-color: #334155; /* Slate-700 */
    color: #ffffff;
}

/* Submenu background and spacing */
.nav-group-sub {
    background-color: #1e293b;
    border-radius: 0.375rem;
    margin-top: 0.125rem;
    margin-bottom: 0.5rem;
}

.insurer-logo {
    width: auto;
    height: 35px;
    object-fit: cover;
    border-radius: 4px;
}

/* ==================================================================================================== */
/* Product card styling - Fixed layout */
.product-card {
    border: 2px solid #e9ecef;
    transition: all 0.3s ease;
    border-radius: 12px;
    position: relative;
    background: white;
}

.product-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.product-card.selected {
    border-color: #0d6efd;
    background-color: rgba(13, 110, 253, 0.05);
}

/* Product icon styling */
.product-icon {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Action buttons positioning - Fixed */
.product-card .position-absolute {
    top: 16px;
    right: 16px;
}

.product-card .btn-group {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    background: white;
}

/* Fixed button hover states */
.product-card .btn-group .btn {
    border: 1px solid #dee2e6;
    background: white;
    color: #6c757d;
    transition: all 0.2s ease;
}

.product-card .btn-group .btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    background: white !important;
    border-color: #adb5bd;
}

/* Specific button hover colors - keeping icons visible */
.product-card .btn-outline-primary:hover {
    background: #e7f3ff !important;
    border-color: #0d6efd !important;
    color: #0d6efd !important;
}

.product-card .btn-outline-info:hover {
    background: #e7f6fd !important;
    border-color: #0dcaf0 !important;
    color: #0dcaf0 !important;
}

.product-card .btn-outline-success:hover {
    background: #e8f5e8 !important;
    border-color: #198754 !important;
    color: #198754 !important;
}

.product-card .btn-outline-danger:hover {
    background: #fdeaea !important;
    border-color: #dc3545 !important;
    color: #dc3545 !important;
}

/* Loading button states */
.btn[data-loading="true"] {
    pointer-events: none;
    opacity: 0.7;
}

.btn-loading {
    display: none;
}

.btn[data-loading="true"] .btn-loading {
    display: inline-block !important;
}

.btn[data-loading="true"] .btn-text {
    display: none !important;
}

/* Quote card improvements */
.quote-card {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    margin-bottom: 12px;
    transition: all 0.3s ease;
    background: white;
}

.quote-card:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.quote-card.selected {
    border-color: #198754;
    background-color: rgba(25, 135, 84, 0.05);
}

.quote-card.best-offer {
    border-color: #0d6efd;
    background-color: rgba(13, 110, 253, 0.05);
}

/* Status badges */
.status-badge {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 4px 8px;
    border-radius: 6px;
}

/* Premium display styling */
.premium-display {
    font-size: 1.25rem;
    font-weight: 700;
    color: #198754;
}

.commission-display {
    font-size: 0.875rem;
    color: #6c757d;
}

/* Progress bar custom */
.progress-bar-custom {
    height: 6px;
    border-radius: 3px;
}

/* Fade in animation */
.fade-in {
    animation: fadeIn 0.3s ease-in;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Loading overlay */
.loading-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

/* Product summary */
.product-summary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border-radius: 12px;
    padding: 20px;
    margin-top: 20px;
}

/* Count input group */
.count-input-group {
    max-width: 120px;
}

/* Quote status colors */
.quote-status-pending {
    color: #ffc107;
}
.quote-status-received {
    color: #198754;
}
.quote-status-selected {
    color: #0d6efd;
}
.quote-status-rejected {
    color: #dc3545;
}

/* Insurer card */
.insurer-card {
    cursor: pointer;
    transition: all 0.2s ease;
    background: white;
}

.insurer-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Modal stacking improvements */
.modal.show {
    z-index: 1050;
}

.modal.show ~ .modal {
    z-index: 1060;
}

.modal-backdrop {
    z-index: 1040;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .product-card .position-absolute {
        position: static !important;
        margin-top: 15px;
        text-align: center;
    }

    .product-card .btn-group {
        width: 100%;
        justify-content: center;
    }

    .product-card .btn-group .btn {
        flex: 1;
    }
}

/* Tooltip improvements */
.btn[data-bs-toggle="tooltip"] {
    position: relative;
}

/* Fix for button group spacing */
.btn-group-sm .btn {
    padding: 0.375rem 0.5rem;
    font-size: 0.875rem;
    border-radius: 0.25rem;
}

.btn-group-sm .btn:first-child {
    border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
}

.btn-group-sm .btn:last-child {
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
}

/* Ensure proper spacing in product details */
.product-card .row.g-2 {
    margin: 0;
}

.product-card .row.g-2 > * {
    padding-right: 0.5rem;
    padding-left: 0.5rem;
}

/* Selected insurer styling */
.selected-insurer-info {
    border-top: 1px solid #e9ecef;
    padding-top: 0.75rem;
    margin-top: 0.75rem;
}

.selected-insurer-info img {
    /*width: 24px;*/
    height: 24px;
    object-fit: contain;
    border-radius: 4px;
    /*border: 1px solid #e9ecef;*/
}


/* ================================================*/


/* Sales Commission Card Styling */
#salesCommissionCard {
    border: 1px solid #e9ecef;
    border-radius: 12px;
    transition: all 0.3s ease;
}

#salesCommissionCard:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Input validation styling */
.is-invalid {
    border-color: #dc3545;
}

.invalid-feedback {
    display: block;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 0.875em;
    color: #dc3545;
}

/* Button loading states */
.btn[disabled] {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Form text styling */
.form-text {
    font-size: 0.875rem;
    color: #6c757d;
}

/* Input group styling */
.input-group-text {
    background-color: #f8f9fa;
    border-color: #dee2e6;
    font-weight: 500;
}

/* Calculated commission readonly styling */
#calculatedCommission {
    background-color: #f8f9fa;
    font-weight: 600;
    color: #198754;
}

/* Refresh button styling */
#refreshSalesCommissionBtn {
    border-color: #6c757d;
    color: #6c757d;
    transition: all 0.2s ease;
}

#refreshSalesCommissionBtn:hover {
    background-color: #6c757d;
    border-color: #6c757d;
    color: white;
}

/* Success state for calculated commission */
.commission-success {
    background-color: rgba(25, 135, 84, 0.1);
    border-color: #198754;
}

/* Warning state for high percentage */
.commission-warning {
    background-color: rgba(255, 193, 7, 0.1);
    border-color: #ffc107;
}

.document-editor-container .document-editor-editable.ck-editor__editable {
    width: 100%;
}

.dt-btn-icon{
    border: none !important;
}

/* Engagement Status Badge Styling */
.badge-pulse {
    animation: pulse 2s infinite;
    position: relative;
}
.badge-pulse::before {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    border: 2px solid currentColor;
    border-radius: inherit;
    opacity: 0.3;
    animation: pulse-ring 2s infinite;
}
@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}
@keyframes pulse-ring {
    0% { transform: scale(1); opacity: 0.3; }
    100% { transform: scale(1.2); opacity: 0; }
}

/* Engagement status column enhancements */
.engagement-status-container {
    min-height: 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.engagement-info-text {
    font-size: 0.65rem;
    line-height: 1;
    color: #6c757d;
    text-align: center;
    margin-top: 2px;
}

.engagement-badge {
    font-weight: 600;
    font-size: 0.75rem;
    padding: 0.35rem 0.65rem;
    border-radius: 0.375rem;
    margin-bottom: 2px;
}

/* Critical status styling */
.engagement-critical {
    background-color: rgba(220, 53, 69, 0.1) !important;
    color: #dc3545 !important;
    border: 1px solid rgba(220, 53, 69, 0.3);
}

/* Stale status styling */
.engagement-stale {
    background-color: rgba(255, 193, 7, 0.1) !important;
    color: #f57c00 !important;
    border: 1px solid rgba(255, 193, 7, 0.3);
}

/* No activity status styling */
.engagement-inactive {
    background-color: rgba(13, 202, 240, 0.1) !important;
    color: #0dcaf0 !important;
    border: 1px solid rgba(13, 202, 240, 0.3);
}

/* Active status styling */
.engagement-active {
    background-color: rgba(25, 135, 84, 0.1) !important;
    color: #198754 !important;
    border: 1px solid rgba(25, 135, 84, 0.3);
}

/* Activity Edit Time Remaining Styling */
.edit-time-remaining {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
    font-size: 0.75rem;
}

.edit-time-remaining i {
    font-size: 0.875rem;
}

/* Activity card enhancements */
.activity-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
}

.activity-actions .text-muted {
    font-size: 0.75rem;
    text-align: center;
    padding: 4px 8px;
}

/* Edited indicator styling */
.text-info {
    font-weight: 500;
}

.ps-6{
    padding-left: 7rem !important;
}