.ck-editor__editable,
textarea {
    min-height: 150px;
}

.datatable {
    width: 100% !important;
}

table.dataTable tbody td.select-checkbox::before,
table.dataTable tbody td.select-checkbox::after,
table.dataTable tbody th.select-checkbox::before,
table.dataTable tbody th.select-checkbox::after {
    top: 50%;
}

.dataTables_length,
.dataTables_filter,
.dt-buttons {
    margin-bottom: 0.333em;
    margin-top: .2rem;
    float: left;

}

.dataTables_filter {
    margin-right: .2rem;
    float: right;
}

.dt-buttons .btn {
    margin-left: 0.333em;
    border-radius: 0;
}

.table.datatable {
    box-sizing: border-box;
    border-collapse: collapse;
}

table.dataTable thead th {
    border: 1px solid #e4e4e4 !important;
}

.dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: 1px solid #e4e4e4;
}

table.dataTable tr td input, table.dataTable tr td select{
    border: 1px solid #ddd !important;
}

table.table-bordered.dataTable th, table.table-bordered.dataTable td {
    border-left: none !important;
}

table.table-bordered.dataTable th:first-child,
table.table-bordered.dataTable th:last-child,
 table.table-bordered.dataTable td:first-child {
    border-left: 1px solid #ddd !important;
}


.select2 {
    max-width: 100%;
    width: 100% !important;
}

.select2-selection__rendered {
    padding-bottom: 5px !important;
}

.has-error .invalid-feedback {
    display: block !important;
}

.btn-info,
.badge-info {
    color: white;
}

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc {
    background-image: none;
}

.sidebar .nav-item {
    cursor: pointer;
}

.btn-default {
    color: #23282c;
    background-color: #f0f3f5;
    border-color: #f0f3f5;
}

.btn-default.focus,
.btn-default:focus {
    box-shadow: 0 0 0 .2rem rgba(209, 213, 215, .5);
}

.btn-default:hover {
    color: #23282c;
    background-color: #d9e1e6;
    border-color: #d1dbe1;
}

.dt-buttons {
    float: left;
    margin-left: 20px;
 }

.btn-group-xs > .btn,
.btn-xs {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}


.searchable-title {
    font-weight: bold;
}
.searchable-fields {
    padding-left:5px;
}
.searchable-link {
    padding:0 5px 0 5px;
}
.searchable-link:hover   {
    cursor: pointer;
    background: #eaeaea;
}
.select2-results__option {
    padding-left: 0px;
    padding-right: 0px;
}

.form-group .required::after {
    content: " *";
    color: red;
}

.form-check.is-invalid ~ .invalid-feedback {
    display: block;
}

.c-sidebar-brand .c-sidebar-brand-full:hover {
    color: inherit;
}

.custom-select.form-control-sm {
    padding: 0.25rem 1.5rem;
}

.bg-hype {
    background-color: #10053e !important;
}

.badge-xs {
    height: 15px !important;
}

/* Utility classes extracted from inline styles */
.badge-icon { width: 18px; }
.cursor-pointer { cursor: pointer; }
.aspect-9-16 {  position: relative; }
.absolute-fill-cover { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.obj-cover { object-fit: cover; }
.avatar-40 { width: 40px; height: 40px; }
.progress-12 { height: 12px; }
.modal-dim-bg { background-color: rgba(0, 0, 0, 0.4); }
.modal-close-pos { top: 10px; right: 32%; z-index: 10; }
.fs-2rem { font-size: 2rem; }
.z-2 { z-index: 2; }
.maxh-380 { max-height: 380px; }
.border-snap-yellow { border: 4px solid #ffe300; }
.overlay-loader { top:0; left:0; background: rgba(0,0,0,0.7); z-index:999; visibility: hidden; opacity: 0; transition: opacity 0.3s; }
.text-ccc { color:#ccc; }

/* Growth card legend dots */
.legend-dot-tiktok { background-color:#3E4653; }
.legend-dot-snapchat { background-color:#F7B801; }
.minw-140 { min-width: 140px; }
.fs-085 { font-size: .85rem; }
.fs-072 { font-size: .72rem; }
.progress-6 { height: 6px; }
.progress-10 { height: 10px; }
.h-350 { height: 350px; }
.avatar-160 { width: 160px; height: 160px; }
.text-pink { color: pink; }
.mb-10 { margin-bottom: 10px; }
.minw-120 { min-width: 120px; }
.minw-160 { min-width: 160px; }
.w-200 { width: 200px; }
.minw-180 { min-width: 180px; }
.avatar-30 { width: 30px; height: 30px; border-radius: 50%; }
.flex-0-24 { flex: 0 0 24px; }
.fs-14 { font-size: 14px; }
.w-150 { width: 150px; }
.z-1055 { z-index: 1055; }

/* Content Flags page scoped styles */
#content-flags-page .caption-overlay { padding: 0 20px; }
#content-flags-page .filter-minw-180 { min-width: 180px; }
#content-flags-page .filter-minw-220 { min-width: 220px; }
#content-flags-page .filter-minw-300 { min-width: 300px; }

#profile-info .profile-image { width: 80px; height: 80px; border-radius: 50%; border: 2px solid #fff30e;}
#profile-info .profile-cover {
    height: 600px;
    background-size: cover;
    position: relative;
    text-align: center;
    padding: 30px 0;
    margin-bottom: 15px;
    width: 100%;
 }
#profile-info .profile-cover::after {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background: rgba(0, 0, 0, 0.5);
 }
#profile-info  .profile-content {
     position: relative;
     z-index: 1;
 }
#profile-info .nav-tabs .nav-link.active {
     color: #495057;
     background-color: #fff;
     border-color: #dee2e6 #dee2e6 #fff;
 }
 #profile-info .card { border: none; }

 .carousel-caption {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 1rem;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 10%, rgba(0, 0, 0, 0) 100%);
    color: white;
    width: 100%; /* Ensures the caption uses the full width */
}

/* Ensures the carousel itself is full width if not already */
.carousel-inner,
.carousel-item {
    width: 100%;
    height: auto; /* Adjust height as needed */
}

.carousel-inner {
    border-radius: 18px !important;
    border: 6px solid #fef362 !important;

}

.story__gradient {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 30%; /* Adjust the height as needed */
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0));
    z-index: 1; /* Ensure it appears above the slide content */
}


.story__slider {
  width: 450px;
  height: 800px;
  border-radius: 6px;
  overflow: hidden;
}

/* .story__wrapper {
} */

.story__slide {
  position: relative;

}

.story__slide video,
.story__slide img#story-img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center;
}

.story__pagination {
  bottom: unset !important;
  top: 8px !important;
  display: flex;
  padding: 0 4px;
}

.story__pagination .swiper-pagination-bullet {
  flex-grow: 1;
  border-radius: 100vh;
  height: 3px;
  margin: 0 2px !important;
  background-color: rgba(247, 247, 245, 0.4);
  opacity: 1;
}

.story__pagination .swiper-pagination-bullet .swiper-pagination-progress {
  height: 100%;
  width: 0%;
  border-radius: 100vh;
  background-color: #f7f7f5;
}

.story__prev,
.story__next {
  height: 100%;
  width: 50%;
  top: 0;
  margin-top: 0;
}

.story__prev::after,
.story__next::after {
  content: none;
}

.story__prev {
  left: 0;
}

.story__next {
  right: 0;
}
    #SnapStoryModal-content {
        background-color: transparent !important;
        border-color: transparent !important;
    }


    .story-profile-wrapper {
        margin: 23px 0px 0px 10px;
        float: left;
    }

    .story-profile-pic {
            width: 48px;
            padding: 3px;
            border: 2px solid yellow;
            float: left;
    }

    .story-info {
        text-align: left;
        float: left;
        color: white;
        margin: 8px;
        font-size: 13px;
    }
    .story-info span {
        font-size: 10px;
        display: block;
    }

    .story__actions {
        position: absolute;
        bottom: 10px;
        width: 100%;
        display: flex;
        justify-content: space-around;
        padding: 10px 0;

     }

    .story__actions img {
        width: 32px;

     }


         .zuck-reactions {
        position: absolute;
        bottom: 80px;
        left: 0;
        right: 0;
        display: flex;
        justify-content: center;
        gap: 10px;
        z-index: 1001;
        pointer-events: auto;
    }

    .zuck-reaction {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.9);
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        box-shadow: 0 2px 5px rgba(0,0,0,0.2);
        transition: transform 0.2s;
    }

    .zuck-reaction:hover {
        transform: scale(1.1);
    }

    .zuck-reaction img {
        width: 24px;
        height: 24px;
    }



    #zuck-modal-content .story-viewer .slides .item {
        background: rgba(0, 0, 0, 35%) !important;
    }

    #zuck-modal-content .story-viewer .head .back, #zuck-modal-content .story-viewer .head .right .close
    {
        color: #fff !important;

    }

 .active-reaction {
        transform: scale(1.4);
         border: 1px solid blue;
    }

.stories.snapgram .story > .item-link {
    text-decoration: none;
    color: #333;
}
.stories.snapgram .story > .item-link > .item-preview {
    border-radius: 50%;
    padding: 2px;
    background: radial-gradient(ellipse at 70% 70%, #eeb93f 8%, #eeb93f 42%, #eeb93f 58%);
}
.stories.snapgram .story > .item-link > .item-preview > * {
    border-radius: 50%;
    border: 3px solid #fff;
}
.stories.snapgram .story.seen {
    opacity: 0.75;
}
.stories.snapgram .story.seen > a > .item-preview {
    background: #999;
}
.stories.snapgram .story.seen > a {
    color: #999 !important;
}


.pagination .page-item .page-link {
    color: #000;
    background-color: transparent;
    border: 1px solid #dee2e6;
}

.pagination .page-item.active .page-link {
    background-color: #10053e;
    color: #fff;
    border-color: #10053e;
}

.pagination .page-item .page-link:hover {
    background-color: #f1f1f1;
    color: #000;
    border-color: #ccc;
}

.pagination {
    justify-content: center;
    margin-top: 20px;
}

.btn-loadmore {
        background: #0f053e;
    color: white;
}


.btn-hype {
    background: #0f053e;
    color: #Fff ;
}

.btn-hype:hover {
    background: #211557;
    color: #Fff ;
}


 .flag-content-modal,
  .flag-content-modal.fade {
    z-index: 99999999 !important;
    border-radius: 20px;
     background-color: rgba(12, 11, 56, 0.71);
  }

  .flag-content-modal .modal-content {
    border-radius: 15px !important;
  }
  /* Raise z-index of the modal and backdrop */
  .flag-modal-over-swiper {
    z-index: 20000 !important;
  }

  .flag-modal-over-swiper .modal-backdrop {
    z-index: 1999 !important;
  }

  /* Make sure the backdrop doesn’t close the underlying swiper modal */
  .flag-modal-over-swiper .modal-backdrop.show {
    opacity: 0.5;
    background-color: rgba(0, 0, 0, 0.7);
  }


.badge-hypo{
    background: #0f053e !important;
}

.chat-flag-comment {
    background: #10053e;
    color: #fff;
    font-size: 15px;
    border-radius: 12px;
    border-top-left-radius: 0;
}

.user-flag-comment {
    font-size: 24px;
    background: #10053e;
    padding: 13px 15px;
    border-radius: 50%;
}


.no-checkbox::before {
    display: none !important;
    visibility: none;
}


#eventsTable_wrapper .buttons-select-all,
#eventsTable_wrapper .buttons-select-none {
    display: none !important;
}

#eventsTable .select-checkbox::before {
    display: none !important;
}

.text-custom-success {
color: #00a35d !important;
}


.text-custom-danger {
    color: #bb0025 !important;
}


.text-custom-xs  {
    font-size: 11px !important;
}


 .delta-cell { display:flex; justify-content:space-between; align-items:center; gap:.5rem; }
  .delta-cell .result { font-size: .75rem; color: #6c757d; } /* small, muted */

    /* Tabs: compact, clear active */
  .tt-tabs .nav-link{
    border:1px solid var(--bs-border-color);
    color: var(--bs-body-color);
    background: var(--bs-body-bg);
    padding:.35rem .65rem;
    border-radius:.5rem;
  }
  .tt-tabs .nav-link:hover{ background: var(--bs-secondary-bg); }
  .tt-tabs .nav-link.active{
    color:#fff; background:#212529; border-color:#212529;
  }

  /* 🔧 Make ANY card inside .tt-panel completely flat */
  .tt-panel .card{
    box-shadow: none !important;
    border: 0 !important;
    background: transparent !important;
    margin: 0 !important;
  }
  .tt-panel .card > .card-body{
    padding: 0 !important;
  }
  .tt-panel .card .card-header,
  .tt-panel .card .card-footer{
    display: none !important;
  }

  .tt-panel{ margin-top:.25rem; }

.sticky-filters     /* Prevent horizontal scroll caused by Select2 */
.select2-container {
  max-width: 100% !important;
}

.sticky-filters   .card-body {
  overflow-x: hidden;
}

/* Ensure the filter form doesn't overflow */
.sticky-filters {
  overflow-x: hidden;
}

   .ttbar{ border-bottom:1px solid var(--bs-border-color); padding-bottom:.25rem; }
    .tt-select{ min-width:120px }
    .tt-segment .btn{ min-width:40px; }
    .tt-segment .btn.active{ background:var(--bs-secondary-bg); border-color:var(--bs-secondary-border-subtle); }

    .tt-switch .form-check-input{ cursor:pointer }
    .tt-switch .form-check-label{ cursor:pointer; margin-left:.35rem }

    .tt-link{ text-decoration: none; }
    .tt-link:hover{ text-decoration: underline; }

    .tt-kpis .tt-stat2 { background: var(--bs-body-bg); }
    .tt-stat2-icon{
      width: 42px; height: 42px; border-radius: .5rem;
      display: grid; place-items: center; font-size: 1rem;
    }
    .tt-stat2-value{ font-size: clamp(1.125rem, 1.2vw + .75rem, 1.5rem); line-height: 1.1; font-weight: 600; }
    .tt-stat2-label{ font-size: .8125rem; }
    .tt-stat2-date{ white-space: nowrap; }
    @media (max-width: 575.98px){
      .tt-stat2-icon{ width: 38px; height: 38px; font-size: .95rem; }
    }


      .icard { --pad: 1rem; --radius: .875rem; background:#fff; border:1px solid rgba(0,0,0,.06); border-radius: var(--radius); overflow: hidden; }
  .icard .icard-head { background: linear-gradient(180deg, #f8f9fa 0%, #fff 100%); border-bottom:1px solid rgba(0,0,0,.06); }
.icard .icard-ava { width:64px; height:64px; object-fit:cover; border-radius:999px; box-shadow: 0 4px 16px rgba(0,0,0,.08); }
.icard .icard-ava-sm { width:42px; height:42px; object-fit:cover; border-radius:999px; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.icard .icard-badge { position:absolute; right:-4px; bottom:-4px; border-radius:999px; background:#fff; padding:2px; box-shadow:0 0 0 1px rgba(0,0,0,.05); }
.icard .chip { border-radius:999px; padding:.25rem .55rem; font-size:.75rem; }
.icard .chip-muted { background:#f1f3f5; color:#495057; }
.icard .chip-dark  { background:#212529; color:#fff; }
.icard .chip-warn  { background:#ffeb3b; color:#212529; }
.icard .chip-line  { border:1px solid rgba(0,0,0,.08); background:#fff; color:#495057; }
.icard .grid-kpi { display:grid; gap:.5rem; }
@media (min-width: 992px) { .icard .grid-kpi { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (min-width: 1400px){ .icard .grid-kpi { grid-template-columns: repeat(4, minmax(0,1fr)); } }
.icard .kpi { border:1px solid rgba(0,0,0,.06); border-radius:.75rem; padding:.6rem .7rem; background:#fff; }
.icard .kpi .label { color:#6c757d; font-size:.75rem; }
.icard .kpi .value { font-weight:600; font-size:.95rem; }
.icard .plat { border:1px solid rgba(0,0,0,.06); border-radius:.75rem; padding: var(--pad); background:#fff; }
.icard .plat.tt { border-left:4px solid #000; }
.icard .plat.sc { border-left:4px solid #fffc00; }
.icard .flagbar { height:8px; border-radius:999px; overflow:hidden; background:#e9ecef; }
.icard .flagbar > div { height:100%; }
.icard .flagbar .good{ background:#198754; }
.icard .flagbar .bad { background:#dc3545; }
.icard .muted { color:#6c757d; }
.icard .icard-foot { border-top:1px solid rgba(0,0,0,.06); background:#fff; }
.icard .icard-title { font-weight:600; }
.icard .icard-sub { color:#6c757d; font-size:.875rem; }
.icard .icon { width:16px; height:16px; vertical-align:-2px; }


.verdict-card .card-header {
  background: linear-gradient(180deg, #fff, #f9fafb);
}

.verdict-card .metric-pill {
  font-size: .75rem;
  border-radius: 999px;
  padding: .2rem .6rem;
  background: #f8f9fa;
  border: 1px solid #e9ecef;
}

/* Chips & avatars */
.verdict-card .chip {
  border-radius: 999px;
  padding: .15rem .55rem;
  font-weight: 600;
  font-size: .75rem;
}

.verdict-card .chip-dark {
  background: #212529;
  color: #fff;
}

.verdict-card .chip-warn {
  background: #fff3cd;
  color: #7a5a00;
}

.verdict-card .ava {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 0 0 2px #fff, 0 1px 6px rgba(0, 0, 0, .06);
}

.verdict-card .ava-sm {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
}

.verdict-card .badge-dot {
  position: absolute;
  right: -2px;
  bottom: -2px;
}

/* Winner box */
.verdict-card .winbox {
  background: #f8f9fa;
  border: 1px solid #edf0f2;
}

/* Rank badges */
.verdict-card .rank-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: .75rem;
  line-height: 1;
  color: #fff;
}

/* Rank colors */
.verdict-card .rk-1,
.verdict-card .rk-green {
  background: #198754;
}

.verdict-card .rk-2,
.verdict-card .rk-blue {
  background: #0d6efd;
}

.verdict-card .rk-3,
.verdict-card .rk-purple {
  background: #6f42c1;
}

.verdict-card .rk-4 {
  background: #fd7e14;
}

.verdict-card .rk-5 {
  background: #20c997;
}

.verdict-card .rk-muted,
.verdict-card .rk-gray {
  background: #adb5bd;
}

/* Bars */
.verdict-card .podium .bar,
.verdict-card .mini-bar {
  height: 6px;
  border-radius: 999px;
  background: #e9ecef;
  overflow: hidden;
}

.verdict-card .podium .fill,
.verdict-card .mini-bar > div {
  height: 100%;
}

/* Bar colors */
.verdict-card .fill-1,
.verdict-card .mini-fill-1 {
  background: #198754;
}

.verdict-card .fill-2,
.verdict-card .mini-fill-2 {
  background: #0d6efd;
}

.verdict-card .fill-3,
.verdict-card .mini-fill-3 {
  background: #6f42c1;
}

.verdict-card .fill-4,
.verdict-card .mini-fill-4 {
  background: #fd7e14;
}

.verdict-card .fill-5,
.verdict-card .mini-fill-5 {
  background: #20c997;
}

.verdict-card .mini-fill-muted {
  background: #adb5bd;
}

/* List */
.verdict-card .list-mini .row-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .4rem .25rem;
}

.verdict-card .list-mini .row-item:last-child {
  border-bottom: none;
}
/* Roles page scoped styles */
#roles-page .permission-container { max-height: 120px; overflow: hidden; position: relative; }
#roles-page .permission-container.expanded { max-height: none; }
#roles-page .permission-badges { display: flex; flex-wrap: wrap; gap: 5px; }
#roles-page .toggle-permissions { position: absolute; right: 0; bottom: 0; background: #fff; padding-left: 5px; }
#roles-page .permission-container.expanded .toggle-permissions { position: relative; }
#roles-page .badge-hypo { background-color: #6c757d; color: #fff; }
#roles-page table.dataTable tbody td { vertical-align: middle; }

/* Roles toolbar spacing */
#roles-toolbar { margin-bottom: 10px; }

/* Countries toolbar spacing */
#countries-toolbar { margin-bottom: 10px; }

/* Reports page scoped styles */
#reports-page .minh-300 { min-height: 300px; }
#reports-page .rq-minw-90 { min-width: 90px; }
#reports-page .rq-minw-50 { min-width: 50px; }
#reports-page .flag-chip{ --pad-y:.2rem; --pad-x:.5rem; padding:var(--pad-y) var(--pad-x); border:1px solid var(--bs-border-color); border-radius:999px; background:#f8f9fa; display:inline-flex; align-items:center; gap:.4rem; font-size:.8125rem; line-height:1; cursor:pointer; user-select:none; transition:.15s ease-in-out; }
#reports-page .flag-chip:hover{ box-shadow:0 .25rem .5rem rgba(0,0,0,.05); }
#reports-page .flag-chip.off{ opacity:.55; filter:grayscale(20%); }
#reports-page .flag-dot{ width:10px; height:10px; border-radius:50%; display:inline-block; }
#reports-page .flag-chip .num{ font-weight:600; }
#reports-page .flag-chip .pct{ color: var(--bs-secondary-color); font-size:.75rem; }
#reports-page .class-chip{ padding:.25rem .5rem; border:1px solid var(--bs-border-color); border-radius:999px; background:#f8f9fa; display:inline-flex; align-items:center; gap:.5rem; font-size:.8125rem; line-height:1; cursor:pointer; user-select:none; transition:.15s ease-in-out; }
#reports-page .class-chip:hover{ box-shadow:0 .25rem .5rem rgba(0,0,0,.05); }
#reports-page .class-chip.off{ opacity:.55; filter:grayscale(20%); }
#reports-page .class-dot{ width:10px; height:10px; border-radius:50%; display:inline-block; }
#reports-page .class-chip .num{ font-weight:600; }
#reports-page .class-chip .pct{ color: var(--bs-secondary-color); font-size:.75rem; }
#reports-page .cat-chip{ padding:.25rem .5rem; border:1px solid var(--bs-border-color); border-radius:999px; background:#f8f9fa; display:inline-flex; align-items:center; gap:.5rem; font-size:.8125rem; line-height:1; cursor:pointer; user-select:none; transition:.15s ease-in-out; }
#reports-page .cat-chip:hover{ box-shadow:0 .25rem .5rem rgba(0,0,0,.05); }
#reports-page .cat-chip.off{ opacity:.55; filter:grayscale(20%); }
#reports-page .cat-dot{ width:10px; height:10px; border-radius:50%; display:inline-block; }
#reports-page .cat-chip .num{ font-weight:600; }
#reports-page .cat-chip .pct{ color: var(--bs-secondary-color); font-size:.75rem; }

/* Reactions breakdown chips */
#reports-page .rx-tile{ cursor:pointer; transition:.15s ease-in-out; }
#reports-page .rx-tile:hover{ box-shadow:0 .25rem .5rem rgba(0,0,0,.05); }
#reports-page .rx-tile.rx-off{ opacity:.55; filter: grayscale(25%); }
#reports-page .rx-dot{ width:10px; height:10px; border-radius:50%; display:inline-block; }

/* Growth card styles */
#reports-page .legend-dot{ width:10px; height:10px; display:inline-block; }
#reports-page .chip{ display:inline-flex; align-items:center; gap:.5rem; padding:.35rem .65rem; border:1px solid transparent; border-radius:9999px; font-size:.8rem; font-weight:600; background: var(--chip-bg, transparent); color: var(--chip-fg, currentColor); border-color: var(--chip-fg, currentColor); transition: background .15s ease, opacity .15s ease, transform .15s ease; line-height:1; }
#reports-page .chip:hover{ transform: translateY(-1px); }
#reports-page .chip.active{ opacity:1; }
#reports-page .chip.inactive{ opacity:.45; }

/* Analytics page scoped styles */
#analytics-page .analytics-toolbar .form-label { font-size:.8rem; color:#6c757d; margin-bottom:.25rem; }
#analytics-page .card-kpi { background: linear-gradient(135deg,#f8f9fb,#ffffff); border:1px solid #eee; }
#analytics-page .mover-card { border:1px solid #eceff3; border-radius:14px; transition:transform .08s ease, box-shadow .2s ease; }
#analytics-page .mover-card:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(33,37,41,.06); }
#analytics-page .avatar { width:40px; height:40px; border-radius:50%; object-fit:cover; background:#f2f4f7; }
#analytics-page .avatar-fallback { width:40px; height:40px; border-radius:50%; background:#eef2ff; display:flex; align-items:center; justify-content:center; font-weight:600; color:#4f46e5; }
#analytics-page .delta-up{ color:#16a34a; }
#analytics-page .delta-down{ color:#dc2626; }
#analytics-page .delta-zero{ color:#6b7280; }
#analytics-page .metric-chip { font-size:.72rem; padding:.2rem .45rem; border-radius:10px; background:#f1f5f9; color:#475569; }
#analytics-page .section-title { font-weight:700; font-size:1.05rem; }
#analytics-page .sticky-header { position:sticky; top:64px; z-index:101; background:#fff; border-bottom:1px solid #eef1f4; }
#analytics-page .loader-line { height:3px; background:linear-gradient(90deg,#6366f1,#22c55e,#06b6d4); background-size:200% 100%; animation: loadbar 1s linear infinite; border-radius:2px; }
@keyframes loadbar { 0%{background-position:0% 0} 100%{background-position:200% 0} }
#analytics-page .presets .btn { --bs-btn-padding-y:.15rem; --bs-btn-padding-x:.45rem; --bs-btn-font-size:.8rem; }
#analytics-page .muted { color:#94a3b8; }
#analytics-page .badge-gold>.bi { color:#f59e0b !important; }
#analytics-page .badge-silver>.bi { color:#9ca3af !important; }
#analytics-page .chip-soft { font-size:.72rem; padding:.2rem .45rem; border-radius:10px; background:#f1f5f9; color:#475569; }

/* Flag modal z-index */
.flag-content-modal { z-index: 20000; }
#reports-page .minh-400 { min-height: 400px; }
#reports-page .h-18 { height: 18px; }
#reports-page .h-10 { height: 10px; }
#reports-page .minw-220 { min-width: 220px; }
#reports-page .minw-20rem { min-width: 20rem; }
#reports-page .maxw-32rem { max-width: 32rem; }
#users-toolbar { margin-bottom: 10px; }
#users-page .minw-220, .minw-220 { min-width: 220px; }
#permissions-toolbar { margin-bottom: 10px; }
#classifications-toolbar { margin-bottom: 10px; }
#events-toolbar { margin-bottom: 10px; }
#categories-toolbar { margin-bottom: 10px; }
#influencers-toolbar { margin-bottom: 10px; }
#snapchats-toolbar { margin-bottom: 10px; }
#snapchats-page .minw-160 { min-width: 160px; }
#snapchats-page .minw-140 { min-width: 140px; }

/* Snapshots pages */
#tiktok-snapshots-page .minw-120, .minw-120 { min-width: 120px; }
#tiktok-snapshots-page .minw-160, .minw-160 { min-width: 160px; }
#tiktok-snapshots-page .minw-180, .minw-180 { min-width: 180px; }
#tiktok-snapshots-page .ava-30 { width:30px; height:30px; object-fit:cover; border-radius:50%; flex:0 0 24px; }
#tiktok-snapshots-page .fs-14 { font-size:14px; }
