@charset "UTF-8";
/*-----------------------------------------------------------------------------------

    Theme Name: Caribbins
    Description: caribbeaninsurers.com  custom css styles
    Author: IT Solutions & Technology Dept (Vincent Osborne)
    Version: 1.0

-----------------------------------------------------------------------------------*/
a:hover, a:active, a:focus {
    color: #c49f4f !important;
    text-decoration: underline !important;
    cursor: pointer !important;
}

a.text-primary {
    color: #2A3073 !important;
}

.text-secondary {
    color: #c49f4f !important;
    text-decoration: none;
}

.mt-25 {
    margin-top: 13rem;
}
.mt-25-1 {
    margin-top: 13.1rem;
}
.mt-25-2 {
    margin-top: 13.2rem;
}
.mt-25-3 {
    margin-top: 13.3rem;
}
.mt-25-4 {
    margin-top: 13.4rem;
}
.mt-25-5 {
    margin-top: 13.5rem;
}
.mt-25-2 {
    margin-top: 13.2rem;
}
.mt-26 {
    margin-top: 14rem;
}
.mt-26-2 {
    margin-top: 14.2rem;
}
.mt-26-5 {
    margin-top: 14.5rem;
}
.mt-26-6 {
    margin-top: 14.7rem;
}
.mt-27 {
    margin-top: 15rem;
}

.form-select:focus {
    border-color: #c49f4f !important;
    box-shadow: 0 0 0 0.20rem rgba(196, 159, 79, 0.25) !important; /* custom bootstrap override shadow */
}
select.form-select:focus {
    border-color: #c49f4f !important;
    box-shadow: 0 0 0 0.20rem rgba(196, 159, 79, 0.25) !important; /* custom bootstrap override shadow */
}
#livePreview {
    position: sticky;
    top: 80px;
    z-index: 100;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    border-top: 1px solid #ddd;
}
.cc-amex {
    color: #0D5180 !important;
}
.cc-visa {
    color: #00549E !important;
}
.cc-jcb {
    color: #2A9C3A !important;
}
.cc-discover {
    color: #E8571C !important;
}
.cc-diners {
    color: #0074B7 !important;
}
.cc-master {
    color: #FE9900 !important;
}
.cc-unknown {
    color: #E8571C !important;
}
#redirectFrame {
    opacity: 0;
    transition: opacity 0.6s ease-in-out;
}
#redirectFrame.loaded {
    opacity: 1;
}
@keyframes fadeSlideIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

#redirectFrame {
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
}

#redirectFrame.animated {
    animation: fadeSlideIn 0.6s ease-out forwards;
}

.onlinepay {
    padding: 5px 0 !important;
    overflow: hidden !important;
    background: #fff !important;
    position: relative !important;
}
medsection {
    padding: 5px 0 !important;
    overflow: hidden !important;
    background: #fff !important;
    position: relative !important;
}
th.col-file {
    width: 20%;
}
th.col-name {
    width: 20%;
}

th.col-desc {
    width: 25%;
}

th.col-date {
    width: 15%;
}

th.col-dept {
    width: 10%;
}

th.col-type {
    width: 10%;
}

th.col-action {
    width: 8%;
}
th.col-burden {
    width: 12%;
}

td.col-name {
    width: 20%;
}

td.col-details {
    width: 70%;
}

td.col-action {
    width: 10%;
}

li.active .page-link {
    background-color: #0d6efd;
    color: white;
    border-radius: 0.25rem;
    pointer-events: none;
}
.page-link:hover {
    color: white !important;
}
.fixedHeader {
    background-color: white !important;
}
.top-social-icon a:hover {
    color: #2A3073 !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
}
.toast.expandable {
    max-width: 600px;
    white-space: normal;
    word-break: break-word;
}
 
/* custom grecaptcha css */
.grecaptcha-badge {
    width: 196px; /* only show the logo area */
    height: 60px;
    overflow: hidden;
    position: relative;
    transition: width 0.3s ease;
    bottom: 0px !important;
    z-index: 1000;
}

.recaptcha-wrapper:hover,
.recaptcha-wrapper:focus-within {
    width: 256px; /* full iframe width */
}

.offcanvas-xl {
    width: 80vw; /* or use 100% or a fixed px value */
    max-width: 1000px;
}
.w-30 {
    width: 30% !important;
}
.w-35 {
    width: 35% !important;
}
.w-40 {
    width: 40% !important;
}
/* override of tooltip default center */
.tooltip-left .tooltip-inner {
    text-align: left !important;
}
/* override of tooltip default padding-left */
.tooltip-content ul {
    padding-left: 1rem !important;
}
.tooltip-wide .tooltip-inner {
    max-width: 300px; /* or any width you prefer */
    width: auto; /* optional: allows content to define width */
}
.tooltip-light-transparency .tooltip-inner {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #ccc; /* optional: adds subtle border */
    box-shadow: 0 2px 6px rgba(0,0,0,0.1); /* optional: soft shadow */
}
.tooltip-light .tooltip-inner {
    background-color: #ffffff !important; /* solid white */
    color: #000000 !important; /* solid black text */
    border: 1px solid #ccc; /* optional border */
    box-shadow: 0 4px 8px rgba(0,0,0,0.3); /* soft shadow */
    opacity: 1 !important; /* fully opaque */
}
.tooltip-light {
    background-color: transparent !important; /* prevent outer layer from adding color */
    opacity: 1 !important; /* ensure full opacity */
    z-index: 1080; /* keep it above other elements */
}
.tooltip-scroll .tooltip-inner {
    max-height: 380px; /* fixed height */
    overflow-y: auto; /* enable vertical scrolling */
    background-color: #fff; /* optional: white background */
    color: #000; /* optional: black text */
    padding: 0.75rem; /* optional: inner spacing */
    scrollbar-width: thin; /* Firefox */
}

.tooltip-scroll .tooltip-inner::-webkit-scrollbar {
    width: 6px;
}

.tooltip-scroll .tooltip-inner::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 3px;
}
.form-edit-icon {
    padding: 0;
    float: right;
    margin: 0;
}

.form-edit-icon li {
    font-size: 15px;
    list-style-type: none;
    float: left;
    text-align: center;
    margin: 0;
    padding: 0 7px;
}

.form-edit-icon li:last-child {
    padding-right: 0;
}

    .form-edit-icon li:last-child a {
        padding-right: 0;
    }

.form-edit-icon li a {
    line-height: 28px;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    padding: 0 3px;
}

.form-edit-icon li a:hover {
    color: rgba(255, 255, 255, 0.65);
}
.disabled {
    cursor: not-allowed !important;
    opacity: 0.6;
}

.p-1-1 {
    padding: 1.0rem;
}
.bg-color-light-blue {
    background-color: #E6EEFA !important;
}
.service-details-sidebar .widget-brochure li a:hover {
    color:white!important;
}

.about-style-03 a:hover {
    text-decoration: none !important;
}
.about-style-03 a {
    color: inherit !important;
}

/* Override for specific items */
.service-details-sidebar .widget-brochure ul li.no-hover:hover {
    background: none !important;
    transition: none !important;
    cursor: default; /* optional */
}

.table.table-bordered th {
    font-weight: normal !important;
}

.table.table-striped.mt-4 th {
    font-weight: normal !important;
}


/*!
 * Bootstrap  v5.3.3 toast background colors
 */
:root,
[data-bs-theme=light] {
    --bs-blue: #0d6efd;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #d63384;
    --bs-red: #dc3545;
    --bs-orange: #fd7e14;
    --bs-yellow: #ffc107;
    --bs-green: #198754;
    --bs-teal: #20c997;
    --bs-cyan: #0dcaf0;
    --bs-black: #000;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;
    --bs-primary: #0d6efd;
    --bs-secondary: #6c757d;
    --bs-success: #198754;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --bs-primary-rgb: 13, 110, 253;
    --bs-secondary-rgb: 108, 117, 125;
    --bs-success-rgb: 25, 135, 84;
    --bs-info-rgb: 13, 202, 240;
    --bs-warning-rgb: 255, 193, 7;
    --bs-danger-rgb: 220, 53, 69;
    --bs-light-rgb: 248, 249, 250;
    --bs-dark-rgb: 33, 37, 41;
    --bs-primary-text-emphasis: #052c65;
    --bs-secondary-text-emphasis: #2b2f32;
    --bs-success-text-emphasis: #0a3622;
    --bs-info-text-emphasis: #055160;
    --bs-warning-text-emphasis: #664d03;
    --bs-danger-text-emphasis: #58151c;
    --bs-light-text-emphasis: #495057;
    --bs-dark-text-emphasis: #495057;
    --bs-primary-bg-subtle: #cfe2ff;
    --bs-secondary-bg-subtle: #e2e3e5;
    --bs-success-bg-subtle: #d1e7dd;
    --bs-info-bg-subtle: #cff4fc;
    --bs-warning-bg-subtle: #fff3cd;
    --bs-danger-bg-subtle: #f8d7da;
    --bs-light-bg-subtle: #fcfcfd;
    --bs-dark-bg-subtle: #ced4da;
    --bs-primary-border-subtle: #9ec5fe;
    --bs-secondary-border-subtle: #c4c8cb;
    --bs-success-border-subtle: #a3cfbb;
    --bs-info-border-subtle: #9eeaf9;
    --bs-warning-border-subtle: #ffe69c;
    --bs-danger-border-subtle: #f1aeb5;
    --bs-light-border-subtle: #e9ecef;
    --bs-dark-border-subtle: #adb5bd;
    --bs-white-rgb: 255, 255, 255;
    --bs-black-rgb: 0, 0, 0;
    --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;
    --bs-body-color: #212529;
    --bs-body-color-rgb: 33, 37, 41;
    --bs-body-bg: #fff;
    --bs-body-bg-rgb: 255, 255, 255;
    --bs-emphasis-color: #000;
    --bs-emphasis-color-rgb: 0, 0, 0;
    --bs-secondary-color: rgba(33, 37, 41, 0.75);
    --bs-secondary-color-rgb: 33, 37, 41;
    --bs-secondary-bg: #e9ecef;
    --bs-secondary-bg-rgb: 233, 236, 239;
    --bs-tertiary-color: rgba(33, 37, 41, 0.5);
    --bs-tertiary-color-rgb: 33, 37, 41;
    --bs-tertiary-bg: #f8f9fa;
    --bs-tertiary-bg-rgb: 248, 249, 250;
    --bs-heading-color: inherit;
    --bs-link-color: #0d6efd;
    --bs-link-color-rgb: 13, 110, 253;
    --bs-link-decoration: underline;
    --bs-link-hover-color: #0a58ca;
    --bs-link-hover-color-rgb: 10, 88, 202;
    --bs-code-color: #d63384;
    --bs-highlight-color: #212529;
    --bs-highlight-bg: #fff3cd;
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #dee2e6;
    --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
    --bs-border-radius: 0.375rem;
    --bs-border-radius-sm: 0.25rem;
    --bs-border-radius-lg: 0.5rem;
    --bs-border-radius-xl: 1rem;
    --bs-border-radius-xxl: 2rem;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl);
    --bs-border-radius-pill: 50rem;
    --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
    --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
    --bs-focus-ring-width: 0.25rem;
    --bs-focus-ring-opacity: 0.25;
    --bs-focus-ring-color: rgba(13, 110, 253, 0.25);
    --bs-form-valid-color: #198754;
    --bs-form-valid-border-color: #198754;
    --bs-form-invalid-color: #dc3545;
    --bs-form-invalid-border-color: #dc3545;
}

.text-bg-primary {
    color: #fff !important;
    background-color: RGBA(var(--bs-primary-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-secondary {
    color: #fff !important;
    background-color: RGBA(var(--bs-secondary-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-success {
    color: #fff !important;
    background-color: RGBA(var(--bs-success-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-info {
    color: #000 !important;
    background-color: RGBA(var(--bs-info-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-warning {
    color: #000 !important;
    background-color: RGBA(var(--bs-warning-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-danger {
    color: #fff !important;
    background-color: RGBA(var(--bs-danger-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-light {
    color: #000 !important;
    background-color: RGBA(var(--bs-light-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-dark {
    color: #fff !important;
    background-color: RGBA(var(--bs-dark-rgb), var(--bs-bg-opacity, 1)) !important;
}

/* Set a consistent width for all rating labels */
.rating-label {
    width: 155px; /* adjust based on longest text */
    text-align: center; /* center the text */
}
/* Bootstrap offcanvas default is around 1045 */
#helpOffcanvas-01 {
    z-index: 100000 !important; /* higher than navbar */
}

.section-heading3 p {
    width: 100% !important;
    font-size: 16px !important;
}
.section-heading3 h3 {
    width: 100% !important;
    font-weight: 600 !important;
    font-size: 1.75rem !important;
}
ol.steps {
    list-style-type: none;
    padding-left: 1em;
}

.copy-element.right-zero {
    right: 0;
}

/* Position modal at bottom center */
.redirect-modal-bottom {
    position: fixed;
    bottom: 50%; /* adjust spacing from bottom */
    left: 40%;
    transform: translateX(-50%);
    margin: 0; /* remove Bootstrap's vertical centering margin */
}

/* Remove Bootstrap's slide-down animation */
.modal.fade .modal-dialog {
    transition: none !important;
    transform: translate(0, 0) !important;
}
.resp-vtabs .resp-tabs-list li.override-padding {
    padding: 15px !important;
}
.primary-hover:hover {
    color: #2A3073 !important;
}
.page-title-section-compact {
    padding: 80px !important;
}

.card-style10 .image-box .date span {
    padding: 0 10px;
    color: #fff;
    border-right: 1px solid rgba(255, 255, 255, 0.3);
}
.card-style10 .image-box .date span:last-child {
    border-right: 0;
}

.pagination {
    gap: 8px !important; /* set default spacing */
}

.pagination a {
    margin-right: 0px !important; /* override from theme default */
}

.fade-in {
    opacity: 0;
    animation: fadeIn 0.6s forwards ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
/* Checkmark animation */
.checkmark-container {
    width: 80px;
    height: 80px;
    margin: 0 auto;
}

.summary-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.checkmark {
    width: 80px;
    height: 80px;
    stroke-width: 4;
    stroke: #28a745;
    stroke-miterlimit: 10;
    box-shadow: inset 0px 0px 0px #28a745;
    border-radius: 50%;
}

.checkmark-circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    animation: strokeCircle 0.6s ease-in-out forwards;
}

.checkmark-check {
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: strokeCheck 0.4s 0.6s ease-in-out forwards;
}

@keyframes strokeCircle {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes strokeCheck {
    to {
        stroke-dashoffset: 0;
    }
}
.progress {
    background-color: #e9ecef;
    border-radius: 5px;
    overflow: hidden;
}

.progress-bar {
    height: 10px;
}

.map-container {
    position: relative;
    width: 100%;
    padding-bottom: 25%; /* controls height ratio */
}
    .map-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: 0;
    }

html {
    scroll-behavior: smooth;
}
#event-registration-form {
    scroll-margin-top: 120px;
}

/* Overriden classes for Personal Lines login widget */
/* Box styling */
.override-footer-color li {
    border: 1px solid #2A3073;
    border-radius: 6px; /* Rounded corners */
    padding: 12px 16px; /* Space inside the box */
    margin-bottom: 12px; /* Space between boxes */
    cursor: pointer; /* Pointer on hover */
    transition: background-color .2s ease;
}

    /* Make the entire box clickable */
    .override-footer-color li a {
        display: block; /* Makes <a> fill the box */
        text-decoration: none; /* Remove underline */
        color: #2A3073 !important;
    }

    .override-footer-color li a::after {
        color: #2A3073 !important;
        padding-right: 8px; /* adjust as needed */
    }

    /* Hover effect for the box */
    .override-footer-color li:hover {
        background-color: #f5f5f5; /* Light hover background */
    }

    /* Hover effect for the text + arrow */
    .override-footer-color li a:hover {
        color: #c49f4f !important;
    }

    .override-footer-color li a:hover::after {
        color: #c49f4f !important;
        }

.footer-list-style1.override-footer-color li:last-child {
    border-bottom: 1px solid #2A3073 !important;
    margin-bottom: 12px !important;
    padding-bottom: 12px !important;
}

.widget-image {
    position: relative;
    width: 148px;
    height: 148px;
    overflow: hidden;
    border-radius: 50%;
    margin: 0 auto;
    border: 3px solid #c49f4f;
}

/* CSS for claims report page  */
.select-row {
    cursor: pointer;
    transition: background-color .25s ease, border-color .25s ease, transform .2s ease;
}

    .select-row:hover {
        background-color: #f8f9fa;
        border-color: #0d6efd;
    }

.option-radio:checked + .icon-circle i {
    opacity: 1;
    transform: scale(1.2);
    color: #0d6efd;
}

.icon-circle i {
    font-size: 1.4rem;
    opacity: 0.3;
    transition: opacity .25s ease, transform .2s ease, color .25s ease;
}

.option-radio:checked ~ .flex-grow-1 {
    font-weight: 600;
}

.option-radio:checked ~ .badge {
    background-color: #0d6efd !important;
}

.option-radio:checked ~ * {
    transition: all .25s ease;
}

.option-radio:checked ~ .select-row {
    transform: scale(1.02);
}

/* card version */

/* Base card styling */
.option-card {
    cursor: pointer;
    border: 1px solid #dee2e6 !important;
    border-radius: 12px;
    transition: border-color .25s ease, box-shadow .25s ease, transform .2s ease, background-color .25s ease;
}

    /* Hover state */
    /* Unified hover color for border, icons, and text
    .option-card:hover {
        border-color: #c49f4f !important;
        background-color: #f8f9fa;
        box-shadow: 0 0 12px rgba(196, 159, 79, 0.25);
    }  */

    .option-card:hover {
        border-color: #c49f4f !important;
        background-color: #f8f9fa !important;
        box-shadow: 0 0 12px rgba(196, 159, 79, 0.25);
    }

    /* Selected state */
    .option-card.selected {
        border-color: #2A3073 !important;
        background-color: #e7f1ff !important;
        box-shadow: 0 0 12px rgba(196, 159, 79, 0.25) !important;
        transform: scale(1.02);
    }


/* Circle icon */
.circle-icon i {
    font-size: 1.3rem;
    color: #adb5bd !important;
    transition: color .25s ease, transform .25s ease;
}

.option-card.selected .circle-icon i {
    color: #2A3073 !important;
    transform: scale(1.2);
}

/* Arrow icon (Font Awesome) */
.arrow-icon i {
    font-size: 1.3rem;
    color: #adb5bd !important;
    transition: color .25s ease, transform .25s ease;
}

/* Arrow highlight on selection */
.option-card.selected .arrow-icon i {
    color: #2A3073 !important;
    transform: translateX(4px);
}

/* Icons + text hover color 
.option-card:hover .circle-icon i,
.option-card:hover h6,
.option-card:hover .arrow-icon i {
    color: #c49f4f !important;
} */

/* End CSS for claims report page  */

.upload-wrapper {
    margin-top: 20px;
}

/* Dropzone Box start */
#myDropzone {
    border: 2px dashed #4a90e2;
    border-radius: 12px;
    padding: 40px;
    background: #f8fbff;
    transition: 0.25s ease;
}

    #myDropzone.dz-drag-hover {
        border-color: #4CAF50 !important;
        background: rgba(76, 175, 80, 0.1);
        transition: 0.2s ease;
    }

    #myDropzone:hover {
        background: #f0f7ff;
        border-color: #2f78d4;
    }

.dz-message {
    text-align: center;
    color: #4a4a4a;
}

    .dz-message .dz-text span {
        font-size: 0.9rem;
        color: #777;
    }

/* Table Thumbnails */
.file-thumb {
    width: 60px;
    height: 60px;
    border-radius: 6px;
    object-fit: cover;
}
.file-thumb {
    opacity: 0;
    transition: opacity .25s ease-in-out;
}
    .file-thumb.loaded {
        opacity: 1;
    }

/* Mobile Cards */
.file-card {
    display: flex;
    align-items: center;
    background: #fff;
    padding: 12px;
    margin-bottom: 10px;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}

    .file-card img {
        width: 60px;
        height: 60px;
        border-radius: 6px;
        object-fit: cover;
        margin-right: 12px;
    }

    .file-card .meta {
        flex-grow: 1;
    }

    .file-card .delete-btn,
    .table .delete-btn {
        background: #e74c3c;
        border: none;
        color: white;
        padding: 6px 12px;
        border-radius: 6px;
        cursor: pointer;
    }

        .file-card .delete-btn:hover,
        .table .delete-btn:hover {
            background: #c0392b;
        }

/* File upload service  */
.wizard-tabs {
    width: 100%;
    margin-bottom: 20px;
}

.wizard-tab {
    flex: 1;
    padding: 15px 20px;
    text-align: center;
    font-weight: 600;
    background: #e9ecef;
    color: #6c757d;
    border-right: 1px solid #d1d1d1;
    cursor: default;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .wizard-tab:last-child {
        border-right: none;
    }

    /* Active tab (blue) */
    .wizard-tab.active {
        background: #2A3073;
        color: white;
    }

    /* Completed tab (green) */
    .wizard-tab.completed {
        background: #198754;
        color: white;
    }

/* Finish tab (default inactive state) */
.finish-tab {
    background: #e9ecef;
    color: #6c757d;
    border-radius: 0 6px 6px 0;
}

.wizard-tab:hover {
    background: #d5d9dd;
    color: #000;
    transition: background 0.2s ease, color 0.2s ease;
}

.wizard-tab.active:hover {
    background: #0b5ed7;
}

.wizard-tab.completed:hover {
    background: #157347;
}

.wizard-tab {
    transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease;
}

    .wizard-tab.active {
        transform: translateY(-2px);
    }

    .wizard-tab.completed {
        transform: translateY(-2px);
    }

    .wizard-tab i {
        transition: color 0.25s ease;
    }

    .wizard-tab.active i {
        color: #fff;
    }

    .wizard-tab.completed i {
        color: #fff;
    }

    .wizard-tab:hover i {
        color: inherit;
    }

@media (max-width: 768px) {
    .wizard-tabs {
        flex-direction: column;
    }

    .wizard-tab {
        border-right: none;
        border-bottom: 1px solid #d1d1d1;
        border-radius: 6px;
        margin-bottom: 8px;
    }

        .wizard-tab:last-child {
            border-bottom: none;
        }
}

.wizard-tab.disabled {
    background: #f1f1f1;
    color: #b0b0b0;
    cursor: not-allowed;
    pointer-events: none;
    opacity: 0.6;
}

#wizardProgress {
    transition: width 0.6s ease-in-out, background-color 0.4s ease;
}

@keyframes progressPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(13,110,253,0.5);
    }

    70% {
        box-shadow: 0 0 10px 10px rgba(13,110,253,0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(13,110,253,0);
    }
}

#wizardProgress.pulse {
    animation: progressPulse 0.6s ease-out;
}

.panel {
    opacity: 0;
    transform: translateX(20px);
    transition: opacity 0.35s ease, transform 0.35s ease;
}

    .panel.active-panel {
        opacity: 1;
        transform: translateX(0);
    }

    .panel.reverse {
        transform: translateX(-20px);
    }

#backToStep1:hover, #backToStep2:hover, #paymentBtn:hover, #downloadBtn:hover {
    border: solid !important;
    border-width: 0.75px !important;
}

#step4-panel {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

    #step4-panel.visible {
        opacity: 1;
        transform: translateY(0);
    }
/* End file upload service  */

/* Slide-up animation */
.custom-toast {
    animation: slideUp 0.35s ease-out;
    border-radius: 10px;
    overflow: hidden;
}

@keyframes slideUp {
    from {
        transform: translateY(20px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Progress bar */
.toast-progress {
    height: 4px;
    background: rgba(255,255,255,0.8);
    width: 100%;
    animation-name: shrink;
    animation-timing-function: linear;
}

@keyframes shrink {
    from {
        width: 100%;
    }

    to {
        width: 0%;
    }
}

/* Stack spacing */
#toastContainer .toast {
    margin-top: 10px;
}

#uploadSummaryPanel {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

    #uploadSummaryPanel.visible {
        opacity: 1;
        transform: translateY(0);
    }

.upload-wrapper span.upload-description {
    padding: 2px 0 0;
    font-size: 11px;
    line-height: 15px;
    font-style: italic;
    margin: 0;
}

/* Dropzone Box end */

.legend {
    float: left;
    width: 100%;
    padding: 0;
    margin-bottom: .5rem;
    font-size: calc(1.275rem + .3vw);
    line-height: inherit;
}

.toast-timer {
    height: 3px;
    background: rgba(255,255,255,0.7);
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    animation: toast-timer-animation linear forwards;
}

@keyframes toast-timer-animation {
    from {
        width: 100%;
    }

    to {
        width: 0%;
    }
}
/* lightgallery video styles */
.gallery-item {
    position: relative;
    display: block;
}

.video-play-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 3rem;
    color: rgba(255, 255, 255, 0.8);
    pointer-events: none; /* Allows clicks to pass through to the <a> tag */
}

.gallery-item:hover .video-play-overlay {
    color: #fff;
}

/* Center the caption content and the icon */
/* Force flex layout so icon and text sit side-by-side */
.lg-sub-html {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 10px 0 !important;
}

/* Ensure the icon is visible and matches toolstrip colors */
.lg-caption-download {
    display: inline-block !important;
    color: #999 !important; /* Muted grey like other tools */
    font-size: 18px !important;
    text-decoration: none !important;
    transition: color 0.2s, transform 0.2s !important;
}

    .lg-caption-download:hover {
        color: #ffffff !important; /* White on hover */
        transform: scale(1.1) !important;
    }
#video-gallery {
    transition: opacity 0.3s ease;
}

/* Optional: Smooth transition for the loading state */

.gallery-loading {
    opacity: 0.6;
    transition: opacity 0.2s ease;
    pointer-events: none; /* Prevents clicks while loading */
}

/* The animation class */
.fade-in-up {
    animation: fadeInUp 0.4s ease forwards;
    opacity: 0;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Forces the main caption and any sub-text to be pure white */
.lg-sub-html h4,
.lg-sub-html p,
.lg-sub-html {
    color: #ffffff !important;
}

    /* Optional: Make the caption text slightly bolder for better readability */
    .lg-sub-html h4 {
        font-weight: 600;
        margin-bottom: 5px;
    }
/* End lightgallery video styles */

/* Start lightgallery filter controls styles */
.filter-highlight {
    background-color: #f8f9fa; /* Very light grey */
    border: 1px solid #e9ecef;
    padding: 25px;
    border-radius: 10px;
    margin-bottom: 15px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}

/* Optional: Add a subtle left border in your brand color (e.g., #2A3073) */
.filter-highlight {
    border-left: 5px solid #2A3073;
}
/* End lightgallery filter controls styles */


button:disabled,
button[disabled] {
    pointer-events: none !important;
    cursor: not-allowed !important;
    opacity: 0.65; /* optional, matches Bootstrap */
    box-shadow: none !important;
}

.invoice-accordion-faq .accordion .accordion-button {
    font-size: 16px !important; /* your new size */
    padding: 10px 18px !important;
}

.invoice-accordion-faq .accordion .card-body {
    font-size: 14px !important; /* your new size */
}

/* Override padding on Services: Accordion card-body class */
.accordion.services-padding .card-body {
    padding: 0px 25px;
}

/* Modern CMS Search Results CSS */
.cms-search-results {
    position: fixed;
    top: 78px;
    left: 0;
    right: 0;
    background: #fff;
    border-top: 1px solid #e5e5e5;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    z-index: 9999;
    padding: 0px 30px;
    /* animation mechanics */
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    transition: max-height 0.35s ease, opacity 0.25s ease, visibility 0.25s ease;
}

    .cms-search-results.open {
        max-height: 70vh;
        opacity: 1;
        visibility: visible;
    }

.cms-search-heading {
    font-size: 20px;
    margin-bottom: 15px;
    font-weight: 600;
}

.cms-search-item {
    padding: 15px 0;
    border-bottom: 1px solid #eee;
}

    .cms-search-item:last-child {
        border-bottom: none;
    }

.cms-search-title {
    font-size: 14px;
    font-weight: 400;
    color: #333;
}

.cms-search-snippet {
    font-size: 14px;
    color: #666;
    margin: 0px 0 0px;
}

.cms-search-link {
    color: #c49f4f;
    font-weight: 600;
    cursor: pointer;
}

.cms-search-no-results {
    font-size: 16px;
    color: #999;
    padding: 20px 0;
}

.cms-search-close {
    position: absolute;
    top: 10px;
    right: 20px;
    background: transparent;
    border: none;
    font-size: 28px;
    color: #666;
    cursor: pointer;
}

    .cms-search-close:hover {
        color: #000;
    }

/* Fade-in animation for each search result item */
@keyframes cmsFadeIn {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.cms-search-item {
    opacity: 0;
    animation: cmsFadeIn 0.35s ease forwards;
}

.valid-check {
    color: #198754 !important; /* Bootstrap success green */
    font-weight: 600;
}

.valid-check {
    color: #198754 !important; /* Bootstrap success green */
    font-weight: 600;
    opacity: 0;
    transition: opacity 0.25s ease-in;
}

    .valid-check.show {
        opacity: 1;
    }

/* Slide animation */
.block-slide-up {
    animation: blockSlideUp 250ms ease-out;
}

.block-slide-down {
    animation: blockSlideDown 250ms ease-out;
}

@keyframes blockSlideUp {
    from {
        transform: translateY(10px);
        opacity: 0.6;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes blockSlideDown {
    from {
        transform: translateY(-10px);
        opacity: 0.6;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Blink border highlight */
.block-blink {
    animation: blockBlink 2s ease-out;
}

@keyframes blockBlink {
    0% {
        border-color: #0d6efd;
        box-shadow: 0 0 6px #0d6efd;
    }

    50% {
        border-color: #6ea8fe;
        box-shadow: 0 0 3px #6ea8fe;
    }

    100% {
        border-color: #dee2e6;
        box-shadow: none;
    }
}

.block-new {
    animation: blockNew 300ms ease-out;
}

@keyframes blockNew {
    from {
        transform: translateY(15px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Blink highlight (reuse your existing blink style) */
.block-blink {
    animation: blockBlink 2s ease-out;
}

@keyframes blockBlink {
    0% {
        border-color: #0d6efd;
        box-shadow: 0 0 6px #0d6efd;
    }

    50% {
        border-color: #6ea8fe;
        box-shadow: 0 0 3px #6ea8fe;
    }

    100% {
        border-color: #dee2e6;
        box-shadow: none;
    }
}

.block-remove {
    animation: blockRemove 300ms ease-out forwards;
}

@keyframes blockRemove {
    0% {
        opacity: 1;
        height: var(--block-height);
        margin-bottom: 0.5rem;
    }

    100% {
        opacity: 0;
        height: 0;
        margin-bottom: 0;
        padding-top: 0;
        padding-bottom: 0;
    }
}

.block-collapsed .block-content {
    display: none;
}

.block-collapsed {
    opacity: 0.85;
}

/* Top search loading spinner */
.top-search-loading {
    display: none; /* hidden by default */
    margin-left: 10px;
}

.top-search-spinner {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.input-search-status {
    display: none;
    background: transparent;
    border: none;
    color: #fff;
    font-style: italic;
    align-items: center;
    gap: 8px;
}
    .input-search-status.show {
        display: flex;
    }

.input-search-spinner {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/*
.cms-search-item.active {
    background: rgba(255,255,255,0.08);
    border-left: 3px solid #c49f4f;
    padding-left: calc(1rem - 3px);
}
*/


#cms-search-results {
    overflow-y: auto;
}

.cms-search-items {
    margin-top: 6px;
    font-size: 0.9rem;
    opacity: 0.85;
}

.table-preview {
    padding: 16px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #e3e3e3;
    margin-bottom: 16px;
}

.result-header {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.result-icon {
    font-size: 22px;
    margin-right: 10px;
}

.result-title {
    font-weight: 600;
    font-size: 16px;
}

.result-subtitle {
    margin-left: auto;
    font-size: 13px;
    color: #777;
}

.preview-rows {
    margin-bottom: 12px;
}

.preview-row {
    display: flex;
    padding: 6px 0;
    border-bottom: 1px solid #f0f0f0;
    opacity: 0;
    transform: translateY(6px);
    animation: fadeInUp 0.35s forwards;
}

    .preview-row:nth-child(2) {
        animation-delay: 0.05s;
    }

    .preview-row:nth-child(3) {
        animation-delay: 0.1s;
    }

.preview-key {
    font-weight: 600;
    width: 160px;
    color: #333;
}

.preview-value {
    flex: 1;
    color: #555;
}

.expand-table-btn {
    background: #f7f9fc;
    border: 1px solid #d0d7e2;
    padding: 8px 12px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.2s;
}

    .expand-table-btn:hover {
        background: #eef2f7;
    }

/* Slide-down panel */
.full-table-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
    border-top: 1px solid #e3e3e3;
    margin-top: 12px;
    padding-top: 0;
}

/* Fade-in animation */
@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Full table container inside slide-down panel */
.cms-full-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 12px;
    font-size: 14px;
    color: #333;
}

.cms-full-table-panel {
    padding-top: 12px;
}

    /* Header row */
    .cms-full-table thead th {
        background: #f7f9fc;
        font-weight: 600;
        padding: 10px 12px;
        border-bottom: 1px solid #e2e2e2;
        text-align: left;
        color: #222;
    }

    /* Body rows */
    .cms-full-table tbody td {
        padding: 10px 12px;
        border-bottom: 1px solid #f0f0f0;
        vertical-align: top;
    }

    /* Zebra striping for readability */
    .cms-full-table tbody tr:nth-child(even) td {
        background: #fafbfc;
    }

    /* Hover highlight */
    .cms-full-table tbody tr:hover td {
        background: #eef2f7;
    }

    /* Smooth fade-in when panel expands */
    .cms-full-table tbody tr {
        opacity: 0;
        transform: translateY(4px);
        animation: cmsTableFadeIn 0.25s forwards;
    }

        .cms-full-table tbody tr:nth-child(1) {
            animation-delay: 0.03s;
        }

        .cms-full-table tbody tr:nth-child(2) {
            animation-delay: 0.06s;
        }

        .cms-full-table tbody tr:nth-child(3) {
            animation-delay: 0.09s;
        }

        .cms-full-table tbody tr:nth-child(4) {
            animation-delay: 0.12s;
        }
/* (You can continue this pattern if needed) */

/* Fade-in animation */
@keyframes cmsTableFadeIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

mark {
    background-color: #fff3cd; /* Bootstrap warning-light */
    padding: 0 2px;
    border-radius: 2px;
}
/* End Modern CMS Search Results CSS */


/* CSS classes for page loading animations */
/* ===============================
   Skeleton Loader + Shimmer
   =============================== */
.legal-skeleton {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 20px 0;
}

.skeleton-line {
    height: 18px;
    background: #e0e0e0;
    border-radius: 4px;
    position: relative;
    overflow: hidden;
}

    .skeleton-line::after {
        content: "";
        position: absolute;
        top: 0;
        left: -100%;
        height: 100%;
        width: 100%;
        background: linear-gradient( 90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0) 100% );
        animation: shimmer 1.6s infinite;
    }

@keyframes shimmer {
    100% {
        left: 100%;
    }
}

.w-50 {width: 50%;}
.w-60 {width: 60%;}
.w-75 {width: 75%;}
.w-80 {width: 80%;}
.w-90 {width: 90%;}

/* ===============================
   Fade Animations
   =============================== */

#legal-content.fade-out {
    opacity: 0;
    transition: opacity 0.25s ease-out;
}

#legal-content.fade-in {
    opacity: 1;
    transition: opacity 0.35s ease-in;
}

/* ===============================
   Top Progress Bar
   =============================== */

#top-progress-bar {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 0%;
    background: #007bff;
    z-index: 9999;
    transition: width 0.25s ease-out;
}

/* ===============================
   Global Spinner
   =============================== */

.global-spinner {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99999;
    background: rgba(255,255,255,0.85);
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 0 20px rgba(0,0,0,0.15);
}

    .global-spinner.hidden {
        display: none;
    }

.spinner-circle {
    width: 48px;
    height: 48px;
    border: 5px solid #ccc;
    border-top-color: #007bff;
    border-radius: 50%;
    animation: spin 0.9s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.accordion-button-padding-small .accordion-button {
    padding: 10px 5px;
    border-left:none;
    border:none;
}

    .accordion-button-padding-small .accordion-button.collapsed {
        border-bottom: none;
    }

.accordion-button-padding-small .card-body {
    padding: 1px 0px;
    border: none;
}

/* END CSS classes for legal page loading animations */

.toc-list-block {
    border-left: 3px solid #007bff;
    padding-left: 10px;
    margin-bottom: 15px;
}

.toc-list-items input {
    border-left: 3px solid #007bff;
}