@import url("../javascript/libraries/google-fonts-open-sans@2026-07-31/files/fonts.css");


/* Bootstrap utility compatibility used by existing CRM templates.
 * These are the small utilities previously supplied incidentally by MDB. */
.font-monospace { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important; }
.fs-5 { font-size: 1.25rem !important; }
.fs-6 { font-size: 1rem !important; }
.fw-bold { font-weight: 700 !important; }
.fw-normal { font-weight: 400 !important; }
.lh-base { line-height: 1.6 !important; }
.gap-2 { gap: .5rem !important; }
.gap-4 { gap: 1.5rem !important; }
.me-1 { margin-right: .25rem !important; }
.me-2 { margin-right: .5rem !important; }
.me-3 { margin-right: 1rem !important; }
.me-4 { margin-right: 1.5rem !important; }
.ms-1 { margin-left: .25rem !important; }
.ms-2 { margin-left: .5rem !important; }
.ms-3 { margin-left: 1rem !important; }
.pe-0 { padding-right: 0 !important; }
.pe-2 { padding-right: .5rem !important; }
.pe-3 { padding-right: 1rem !important; }
.pe-4 { padding-right: 1.5rem !important; }
.ps-0 { padding-left: 0 !important; }
.ps-1 { padding-left: .25rem !important; }
.ps-2 { padding-left: .5rem !important; }
.ps-3 { padding-left: 1rem !important; }
.ps-4 { padding-left: 1.5rem !important; }
.rounded-1 { border-radius: .2rem !important; }
.rounded-2 { border-radius: .25rem !important; }
.rounded-3 { border-radius: .3rem !important; }
.shadow-0 { box-shadow: none !important; }
.shadow-1-strong { box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .21) !important; }
.shadow-4 { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .07), 0 4px 6px -2px rgba(0, 0, 0, .05) !important; }
.text-black { color: #000000 !important; }
.text-end { text-align: right !important; }
.top-0 { top: 0 !important; }

.row.g-3,
.row.gx-3 {
    margin-right: -.5rem;
    margin-left: -.5rem;
}

.row.g-3 > *,
.row.gx-3 > * {
    padding-right: .5rem;
    padding-left: .5rem;
}

.row.g-3 {
    margin-top: -1rem;
}

.row.g-3 > * {
    margin-top: 1rem;
}

.row.gx-2 {
    margin-right: -.25rem;
    margin-left: -.25rem;
}

.row.gx-2 > * {
    padding-right: .25rem;
    padding-left: .25rem;
}

.form-select {
    display: block;
    width: 100%;
    padding: .375rem 2.25rem .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6;
    color: #4f4f4f;
    background-color: #fff;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%234f4f4f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 16px 12px;
    border: 1px solid #bdbdbd;
    border-radius: .25rem;
    appearance: none;
}

.form-select:focus {
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(18, 102, 241, .25);
}

.form-select[multiple],
.form-select[size]:not([size="1"]) {
    padding-right: .75rem;
    background-image: none;
}

.form-select:disabled {
    background-color: #eee;
}

.accordion-button {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 1.15rem 1.5rem;
    border: 0;
    border-radius: 0;
    color: #4f4f4f;
    background-color: #fff;
    font-size: 1rem;
    text-align: left;
    overflow-anchor: none;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out, border-radius .15s ease;
}

.accordion-button::after {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    margin-left: auto;
    content: "";
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%234f4f4f'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 01.708 0L8 10.293l5.646-5.647a.5.5 0 01.708.708l-6 6a.5.5 0 01-.708 0l-6-6a.5.5 0 010-.708z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: transform .2s ease-in-out;
}

.accordion-button:not(.collapsed) {
    color: #27aae1;
    background-color: #fff;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
}

.accordion-button:not(.collapsed)::after {
    transform: rotate(-180deg);
}

.accordion-button:hover { z-index: 2; }
.accordion-button:focus { z-index: 3; box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125); }
.accordion-item { background-color: #fff; border: 1px solid rgba(0, 0, 0, .125); }
.accordion-item:first-of-type { border-top-left-radius: .5rem; border-top-right-radius: .5rem; }
.accordion-item:first-of-type .accordion-button { border-top-left-radius: calc(.5rem - 1px); border-top-right-radius: calc(.5rem - 1px); }
.accordion-item:not(:first-of-type) { border-top: 0; }
.accordion-item:last-of-type { border-bottom-right-radius: .5rem; border-bottom-left-radius: .5rem; }
.accordion-item:last-of-type .accordion-button.collapsed { border-bottom-right-radius: calc(.5rem - 1px); border-bottom-left-radius: calc(.5rem - 1px); }
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
    color: #545454;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6, p {
    margin-top: 0;
}

fieldset {
    margin-bottom: 20px;
}

legend {
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 15px;
    padding-bottom: 10px;
}

img {
    max-width:100%;
}

.cursor-pointer{
    cursor:pointer;    
}

#content{
    min-height: calc(100dvh - 141px);
    view-transition-name: crm-content;
}

#header {
    view-transition-name: crm-header;
}

#column-left {
    view-transition-name: crm-sidebar;
}

@view-transition {
    navigation: auto;
}

::view-transition-old(root),
::view-transition-new(root) {
    animation: none;
    mix-blend-mode: normal;
}

::view-transition-group(crm-header),
::view-transition-group(crm-sidebar),
::view-transition-old(crm-header),
::view-transition-new(crm-header),
::view-transition-old(crm-sidebar),
::view-transition-new(crm-sidebar) {
    animation: none;
    mix-blend-mode: normal;
}

::view-transition-group(crm-content) {
    animation-duration: 260ms;
    animation-timing-function: ease;
}

::view-transition-image-pair(crm-content) {
    isolation: isolate;
}

::view-transition-old(crm-content) {
    animation: crm-content-fade-out 120ms ease both;
}

::view-transition-new(crm-content) {
    animation: crm-content-fade-in 140ms ease 120ms both;
}

@keyframes crm-content-fade-out {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes crm-content-fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    #content,
    #header,
    #column-left {
        view-transition-name: none;
    }

    ::view-transition-old(root),
    ::view-transition-new(root),
    ::view-transition-old(crm-content),
    ::view-transition-new(crm-content),
    ::view-transition-old(crm-header),
    ::view-transition-new(crm-header),
    ::view-transition-old(crm-sidebar),
    ::view-transition-new(crm-sidebar) {
        animation: none;
    }
}

.alert{
    padding:1rem;    
}

.mih-100{
    min-height:100%!Important;    
}

.elfinder .elfinder-navbar {
    width: 240px!Important;   
}

#dT > thead > tr > th{
    min-width: 75px;
}

#dT > thead > tr > th.col_image,
#dT > thead > tr > th.col_category,
#dT > thead > tr > th.col_name,
#dT > thead > tr > th.col_model,
#dT > thead > tr > th.col_price,
/*#dT > thead > tr > th.col_quantity,*/
/*#dT > thead > tr > th.col_status,*/
#dT > thead > tr > th.col_action{
    min-width: 150px;
}

#pqe-list-form button#filter,
#pqe-list-form button#clear-filter{
    min-height:auto;
    height:calc(1.4em + 1.077rem + 2px);
}

.table th, .table td {
    padding: 0.6154rem;
}

.table tbody {
    font-weight: 500;
}

.table-bordered>:not(caption)>*>* {
    border-width: 0;
    border: 1px solid #dee2e6;
}

.table {
    font-size:0.8125rem;
    line-height: 1.35;
    border-left:1px solid #dee2e6;
    border-right:1px solid #dee2e6;
}

.form-check-input[type=radio]:checked{
    position:relative;
}

.form-check-input[type=checkbox] {
    top: 3px;
}

.input-group > .col-form-label.form-control{
    white-space: nowrap;
}

.input-group > select.form-control{
    height: calc(2.2rem + 5px);
}

.input-group > .form-control:not(.h-auto){
    min-height: 42px;
}

.input-group > .form-control.h-auto{
    min-height: auto;
    height: auto!Important;
}

.input-group > textarea.form-control{
    height:auto;
}

.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, .show > .btn-outline-secondary.dropdown-toggle{
    background-color: #2dbcbb;
    border-color: #2dbcbb;
}

[class*=btn-outline-] {
    border-width: .0625rem;
}

.card-header{
    border-bottom:none;   
    padding: .5rem 1rem;
}

.card-header a:not(.btn){
    color:#333;    
}

.card-body{
    padding: 1rem;
}

.form-control{
    font-size: 0.8125rem;
    line-height: 2.1;
}

.form-control.is-invalid, .was-validated .form-control:invalid{
    margin-bottom:0;
}

.form-group .invalid-tooltip{
    width: 100%;
    position: relative;
    top:0;
}

.date,
.time{
    min-width:115px!Important;
}

.datetime{
    min-width:175px!Important;
}

.btn-group, .btn-group-vertical,
.btn-group:hover, .btn-group-vertical:hover{
    box-shadow:none;    
}

.fs-7 {
    font-size: 15px!Important
}

.fs-8 {
    font-size: 14px!Important
}

#spinner{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff9;
    z-index: 10000;
    display: none;
    align-items: center;
    justify-content: center;
    flex-flow: column;
}

#spinner .spinner-border{
    color:#0b91d2;
}

#spinner.active{
    display:flex;
}

#spinner .spinner {
   width: 56px;
   height: 56px;
   border-radius: 50%;
   background: radial-gradient(farthest-side,#ff5e3a 94%,#0000) top/9px 9px no-repeat,
          conic-gradient(#0000 30%,#ff5e3a);
   -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 9px),#000 0);
   animation: spinner-1 0.8s infinite linear;
}

@keyframes spinner-1 {
   100% {
      transform: rotate(360deg);
   }
}

.info-window-subtitle {
    font-weight: 400;
    font-size: 13px;
}

.table-responsive{
    -webkit-cursor:grab;
    cursor:grab;
    margin-bottom:20px;
}

.table-responsive.drag-scroll{
    -webkit-cursor:grabbing;
    cursor:grabbing;
    margin-bottom:20px;
}

.table-responsive::-webkit-scrollbar {
    height: 5px;
}

.gap-5{
    gap:5px;
}

.gap-10{
    gap:10px;
}

.gap-15{
    gap:15px;
}

.row-gap-5{
    row-gap:5px;
}

.row-gap-10{
    row-gap:10px;
}

.row-gap-15{
    row-gap:15px;
}

.column-gap-5{
    column-gap:5px;
}

.column-gap-10{
    column-gap:10px;
}

.column-gap-15{
    column-gap:15px;
}

#container:not(.cd-app-shell) {
    min-height: 100%;
    width: 100%;
    position: relative;
    background: #f1f3f4;
    overflow: hidden;
}

.bg-main{
    background: #f1f3f4;
}

.container-fluid {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

#header {
    z-index: 1000;
    margin: 0;
}

#header:not(.cd-topbar) {
    min-height: 0;
    padding: 0;
    height: 68px;
}

#header .navbar-brand {
    transition: 0.3s all;
    width: 235px;
    text-align: center;
}

#header .navbar-brand img {
    padding: 6px 0;
    max-width: 100%;
    height: 55px;
    width: auto;
}

#header .navbar-nav .nav-link:hover {
    background: #EEEEEE;
}

#header .navbar-nav .nav-link {
    padding-left: 20px;
    padding-right: 20px;
}

#header .navbar-nav > li > a {
    padding-left: 21px;
    padding-right: 21px;
    line-height: 45px;
    cursor: pointer;
    color: #4f4f4f;
    border-left: 0px solid #E1E1E1;
    padding: 0px;
}

#header .navbar-nav > li.dropdown > a {
    padding-left: 6px;
    padding-right: 6px;
    border-radius: 6px;
}

#header .navbar-nav > li.nav-item{
    display: flex;
    align-items: center;
    justify-content: center;
}

#header .navbar-nav > li.nav-item > .nav-link img{ 
    margin:0;
}

#header .navbar-nav > li.nav-item > .nav-link img#user-profile{
    margin-top: 6px;
    margin-bottom: 6px;
}

#header .main-navbar-nav{
    align-items: center;
    justify-content: center;
}

#header.cd-topbar {
    width: 100%;
    min-height: var(--cd-topbar-height);
    margin: 0;
    font-family: "Manrope", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#header.cd-topbar .cd-brand {
    flex: 0 1 auto;
}

#header.cd-topbar a,
#header.cd-topbar a:hover {
    text-decoration: none;
}

#header.cd-topbar .cd-topbar-actions {
    min-width: 0;
}

#header.cd-topbar .cd-theme-menu.dropdown-menu {
    position: absolute;
    top: 100%;
    margin-top: 10px;
    animation: none;
}

#header.cd-topbar .cd-theme-menu .cd-theme-option {
    white-space: normal;
}

#header.cd-topbar .cd-theme-option[aria-current="true"] {
    color: var(--cd-text);
    cursor: default;
    background: linear-gradient(90deg, rgba(20, 115, 230, 0.17), rgba(45, 189, 187, 0.09));
}

#header.cd-topbar .cd-theme-option[aria-current="true"] .cd-theme-check {
    opacity: 1;
}

#header.cd-topbar .header-profile-item {
    min-height: 44px;
    gap: 9px;
    padding: 3px 12px 3px 4px;
}

#header.cd-topbar #user-profile {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    border-radius: 50%;
    object-fit: cover;
}

#header.cd-topbar #button-desktop-menu {
    display: inline-flex;
}

#header.cd-topbar #button-menu {
    display: none;
}

#header.cd-topbar #supreme-user-switch-wrapper > .dropdown-menu {
    min-width: 240px;
}

@media (max-width: 767px) {
    #header.cd-topbar #button-desktop-menu {
        display: none;
    }

    #header.cd-topbar #button-menu {
        display: inline-flex;
    }
}

.supreme-user-switch-option {
    display:block; 
    cursor:pointer;
}

#button-menu:not(.cd-menu-toggle),
#button-desktop-menu:not(.cd-menu-toggle) {
    font-size: 24px;
    padding: 4px 12px;
    cursor: pointer;
    color: #27aae1;
}

#column-left:not(.cd-sidebar) {
    width: 235px;
    height: 100%;
    overflow: auto;
    background-color: #fff;
    position: absolute;
    top: 0px;
    left: -235px;
    padding-top: var(--cd-topbar-height, 78px);
    z-index:2;
}

#column-left:not(.cd-sidebar)::-webkit-scrollbar {
    width: 4px;
    background-color: var(--gray);
}

#column-left:not(.cd-sidebar)::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: var(--gray);
}

#column-left:not(.cd-sidebar), #content, #footer {
    transition: left 0.3s ease, margin-left 0.3s ease;
}

#column-left:not(.cd-sidebar) + #content, #column-left:not(.cd-sidebar) + #content + #footer {
    position: relative;
    left: 0px;
}

#column-left:not(.cd-sidebar).active {
    left: 0px;
}

#column-left:not(.cd-sidebar).active + #content, #column-left:not(.cd-sidebar).active + #content + #footer {
    left: 235px;
}

#column-left:not(.cd-sidebar) #menu > li span{
    white-space:nowrap;
}

/* Navigation */
#navigation {
    text-transform: uppercase;
    padding: 15px 15px 15px 15px;
    display: block;
    font-size: 14px;
    font-weight:600;
    border-bottom: 1px solid #dee2e6;
}

/* Menu */
#column-left:not(.cd-sidebar) #menu, #column-left:not(.cd-sidebar) #menu ul, #column-left:not(.cd-sidebar) #menu li {
    padding: 0;
    margin: 0;
    list-style: none;
}

#column-left:not(.cd-sidebar) #menu {
    margin-bottom: 25px;
}

#column-left:not(.cd-sidebar) #menu li a {
    text-decoration: none;
    display: block;
    padding: 12px;
    cursor: pointer;
    border-bottom: 0px solid #515151;
    font-size: 14px;
}

#column-left:not(.cd-sidebar) #menu li a.parent:after {
    position: absolute;
    right: 12px;
    font-family: 'Font Awesome 5 Free';
    font-weight: 600;
    content: "\f107";
}

#column-left:not(.cd-sidebar) #menu li a.collapsed:after {
    content: "\f105";
}

/* 1st lvl */
#column-left:not(.cd-sidebar) #menu > li {
    position: relative;
    border-bottom: 1px solid #dee2e6;
}

#column-left:not(.cd-sidebar) #menu > li > a {
    font-size: 14px;
    color: #212529;
    padding-left: 12px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#column-left:not(.cd-sidebar) #menu > li > a:hover {
    background-color: rgba(0,0,0,0.075);
}

#column-left:not(.cd-sidebar) #menu > li > a > i {
    font-size: 18px;
    width: 20px;
    margin-right: 12px;
    padding-right: 12px;
    color: #27aae1;
    position: relative;
    top: 1px;
}

#column-left:not(.cd-sidebar) #menu > li.active > a {
    color: #fff;
    background-color: #27aae1;
}

#column-left:not(.cd-sidebar) #menu > li.active > a i{
    color: #fff;
}

#column-left:not(.cd-sidebar) #menu > li > ul {
    background-color: #f2f2f2;
}

/* 2nd lvl */
#column-left:not(.cd-sidebar) #menu li li a {
    color: #212529;
}

#column-left:not(.cd-sidebar) #menu li li:not(.no-left-arrow) a:before {
    font-family: 'Font Awesome 5 Free';
    content: "\f054";
    font-weight: 900;
    font-size: 12px;
    margin-left: 10px;
    margin-right: 10px;
    transition: margin ease 0.5s;
}

#column-left:not(.cd-sidebar) #menu li li a:hover:before {
    margin-right: 20px;
}

#column-left:not(.cd-sidebar) #menu li li a:hover {
    background-color: rgba(0,0,0,0.075);
}

#column-left:not(.cd-sidebar) #menu li li.active > a {
    color: #000;
    background-color: rgba(0,0,0,0.075);
}


#column-left:not(.cd-sidebar) #menu li li a i {
    font-size: 18px;
    width: 20px;
    margin-right: 9px;
    color: #2dbcbb;
    position: relative;
    top: 1px;
}

#column-left:not(.cd-sidebar) #menu li ul a {
    padding-left: 20px;
}

#column-left:not(.cd-sidebar) #menu li li ul a {
    padding-left: 40px;
}

#column-left:not(.cd-sidebar) #menu li li li ul a {
    padding-left: 60px;
}

#column-left:not(.cd-sidebar) #menu li li li li ul a {
    padding-left: 80px;
}

/* footer */
#footer {
    min-height: 26px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 16px;
    color: var(--cd-muted, #6c757d);
    font-size: 10.5px;
    line-height: 1.2;
    text-align: right;
}

#footer a {
    color: inherit !important;
    font-weight: 600;
    text-decoration: none !important;
}

#footer a:hover {
    color: var(--cd-text, #343a40) !important;
}

@media (max-width: 767px) {
    #footer {
        justify-content: center;
        padding-right: 16px;
        padding-left: 16px;
        text-align: center;
    }
}

/**/

#language > .nav-item > a{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    row-gap: 3px;
    line-height:1;
}

.nav-tabs {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow-x: scroll;
    overflow-y: hidden;
    flex-wrap: nowrap;
    background-color: #f8f9fa;
    padding: 8px;
    gap: 8px;
    border-radius: .5rem !important;
}

.nav-tabs .nav-link:hover {
    background-color: #fff9;
}

.nav-tabs::-webkit-scrollbar {
    display: block;
    height: 5px;
}

.nav-tabs::-webkit-scrollbar-thumb {
    background: #ccc;
}

.nav-tabs::-webkit-scrollbar-track {
    background: transparent;
}

.nav-tabs.nav-tabs-light li.nav-item a.active {
    background-color: #d0f0fb;
    color: #084154;
}

/**/

.nav-tabs li.nav-item{
    margin-bottom:0;
}

.nav-tabs .nav-link{
    white-space: nowrap;
    background: var(--light);
    border-radius: .25rem;
    padding: 12px 24px 10px;
    color: #4f4f4f;
    letter-spacing: .2px;
}

.nav-tabs .nav-link.active {
    font-weight: bold;
    background-color: #27aae1;
    color: var(--light);
    border-radius: .25rem;
}

.col-form-label {
    text-align:right;
    font-weight: bold;
}

.form-group.row + .form-group.row {
    padding-top: 1rem;
    border-top: 1px solid #ededed;
}

.form-control:hover {
    border: 1px solid #b9b9b9;
    border-top-color: #a0a0a0;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}

div.required .col-form-label:not(span):before, td.required:before {
    content: '* ';
    color: #F00;
    font-weight: bold;
}

.image {
    width: 12rem;
 }

.table thead td span[data-toggle="tooltip"]:after, label.control-label span:after {
    font-family: 'Font Awesome 5 Free';
    font-weight: 600;
    content: "\f059";
    color: #1E91CF;
    margin-left: 4px;
}

input[type="radio"], .radio input[type="radio"], .radio-inline input[type="radio"], input[type="checkbox"], .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] {
    position: relative;
    width: 16px \0;
    height: 16px \0;
    -webkit-appearance: none;
    background: white;
    border: 1px solid transparent \0;
    border-radius: 1px;
}

input[type="radio"]:focus, .radio input[type="radio"]:focus, .radio-inline input[type="radio"]:focus, input[type="checkbox"]:focus, .checkbox input[type="checkbox"]:focus, .checkbox-inline input[type="checkbox"]:focus {
    border-color: #4d90fe;
    outline: 0;
}

input[type="radio"]:active, .radio input[type="radio"]:active, .radio-inline input[type="radio"]:active, input[type="checkbox"]:active, .checkbox input[type="checkbox"]:active, .checkbox-inline input[type="checkbox"]:active {
    background-color: #ebebeb;
    border-color: #c6c6c6;
}

input[type="radio"]:checked, .radio input[type="radio"]:checked, .radio-inline input[type="radio"]:checked, input[type="checkbox"]:checked, .checkbox input[type="checkbox"]:checked, .checkbox-inline input[type="checkbox"]:checked {
    background: #fff;
}

input[type="radio"], .radio input[type="radio"], .radio-inline input[type="radio"] {
    width: 18px \0;
    height: 18px \0;
    border-radius: 1em;
}

input[type="radio"]:checked::after, .radio input[type="radio"]:checked::after, .radio-inline input[type="radio"]:checked::after {
    position: relative;
    top: 3px;
    left: 3px;
    display: block;
    width: 7px;
    height: 7px;
    content: '';
    background: #666;
    border-radius: 1em;
}

input[type=checkbox]:checked,
.form-check-input[type=checkbox]:checked {
    background-image: none;
    background-color: #27aae1;
}

input[type=checkbox]:before,
.form-check-input[type=checkbox]:before{
    content: "";
    position: absolute;
    box-shadow: 0 0 0 13px transparent;
    border-radius: 50%;
    width: .875rem;
    height: .875rem;
    background-color: transparent;
    opacity: 0;
    pointer-events: none;
    transform: scale(0);
}

input[type=checkbox]:checked:before,
.form-check-input[type=checkbox]:checked:before{
    opacity: .16;
}


input[type=checkbox]:checked:after,
.form-check-input[type=checkbox]:checked:after{
    content: "";
    position: absolute;
    display: block;
    transform: rotate(45deg) /*!rtl:ignore*/;
    width: .375rem;
    height: .8125rem;
    border: .125rem solid #fff;
    border-top: 0;
    border-left: 0 /*!rtl:ignore*/;
    margin-left: .35rem;
    margin-top: 0 !important;
    background-color: transparent;
}

.table thead td {
    font-weight: bold;
}

.table thead > tr > td, .table tbody > tr > td {
    vertical-align: middle;
}

.table a.asc:after {
    font-family: 'Font Awesome 5 Free';
    font-weight: 600;
    content: " \f106";
}

.table a.desc:after {
    font-family: 'Font Awesome 5 Free';
    font-weight: 600;
    content: " \f107";
}

.card {
    border-radius: 6px;
}

.card-header > span > i,
.card-header > i {
    margin-right: 6px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    color:#27aae1;
}

.jqvmap-label {
    z-index: 999;
}

/* Filemanager */

#filemanager .file-item{
    position:relative;
}

#filemanager .cont-image-item .thumbnail{
    position: relative;
    display: inline-block;
    width: 100%;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.2308rem;
}

#filemanager .cont-image-item .thumbnail::after{
    content:'';
    display:block;
    padding-bottom:100%;
}

#filemanager .cont-image-item .thumbnail img{
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 100%;
    border: none;
    max-height: 100%;
}

#filemanager .cont-file-item-label{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    font-size: 12px;
    line-height: 1.2;
    word-break: break-all;
}

#filemanager .cont-file-item-label input{
    min-width: 14px;
    position: absolute;
    top: 4px;
    right: 4px;
}

#filemanager .fa-folder.fa-5x {
    font-size: 7.897em;
}

.list-check {
    list-style: none;
}

.list-check li::before {
    font-family: 'Font Awesome 5 Solid';
    content: "\f00c";
    margin-left: -30px;
    width: 29px;
    display: inline-block;
    color: #7ebd38;
}

.list-check.list-color-blue li::before {
    color: #02afe9;
}

.is-invalid ~ .invalid-tooltip, 
.input-group + .invalid-tooltip, 
.btn-group + .invalid-tooltip, 
.form-check + .invalid-tooltip {
    position: static !important;
}

.input-group-large{
    width:25%;
    display:flex;
}

.input-group-large .input-group-text{
    width: 100%;
    white-space: normal;
    text-align: left;
}

.img-relative{
    display:block;
}
.ascunde-optiuni {
    display: none !Important;
}

.btn, .btn.active, .btn.active:focus, .btn.focus, .btn:active, .btn:active:focus, .btn:focus, .btn:hover{
    box-shadow: none;
}

.btn i,
.nav-link img{
    margin-right:3px;
}

/*.btn-group .btn i {*/
/*    margin-right: 0;*/
/*}*/

.lang-flag{
    min-width:20px;
}

.mobile-label{
    display:none;
}

.cont-header-view-type{
    padding: 0 12px;
    flex: 1;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size:16px;
    font-weight:600;
}

.card.image{
    width: 200px;
    height: 300px;
    align-items: center;
}

.img-thumbnail-cont-full{
    padding: 5px;
    overflow: hidden;
}

.card.image img{
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    min-width: 200px;
    min-height: 200px;
    background: #f8f9fa;
}

.card.image .card-body{
    width:100%;
    background-color:#fff;
    border-top:1px solid rgba(0, 0, 0, 0.125);
}

.img-thumbnail-cont{
    width:150px;
    height:150px;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.2308rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.img-thumbnail-cont img{
    max-width: 150px;
    max-height: 150px;
    width: auto;
    height: auto;
    padding:5px;
}


.img-thumbnail-cont-full{
    width:200px;
    height:200px;
    border-radius: 0.2308rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.img-thumbnail-cont-full img{
    max-width: 200px;
    max-height: 200px;
    width: 100%;
    height: 100%;
}

/**Extra**/
::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

::-webkit-scrollbar-track {
    background: #fff;
    border-left: 1px solid #ddd;
}

::-webkit-scrollbar-thumb {
    background: var(--color1);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color1);
}


#filter-fixed,
.filter-fixed {
    position: fixed;
    right: 0;
    left: auto;
    top: 78px;
    bottom: 0;
    z-index: 1038;
    height: auto;
    max-height: calc(100dvh - var(--cd-filter-fixed-top, 78px));
    margin: 0;
    padding: 0;
}

#content:has(#filter-fixed:not(.d-none)),
#content:has(.filter-fixed:not(.d-none)) {
    position: relative;
    z-index: auto;
}

#filter-fixed > .card,
.filter-fixed > .card {
    height: 100%;
    max-height: 100%;
}

#filter-fixed > .card > .card-header,
.filter-fixed > .card > .card-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#filter-fixed > .card > .card-body,
.filter-fixed > .card > .card-body {
    overflow: hidden;
    overflow-y: scroll;
}

.close-filter{
    cursor:pointer;
}

.close-filter i{
    font-size:24px;
}

.disabled-label{
    background:#ced4da;
}

.card [class*="card-header-"]:not(.card-header-icon):not(.card-header-text):not(.card-header-image) {
    border-radius: 3px;
    margin-top: -20px;
    padding: 15px;
}
.card .card-header-teren {
    background-color: #80cbc4 !important;
    z-index: 1 !important;
}
.card [class*="card-header-"] {
    margin: 0 15px;
    padding: 0;
    position: relative;
}

.btn:not(:disabled):not(.disabled) {
    cursor: pointer;
}

.card .card-body + .card-footer, .card .card-footer {
    padding: 10px 0 0;
    margin: 0 15px 10px;
    margin-right: 15px;
    border-radius: 0;
    justify-content: space-between;
    align-items: center;
}

.card .card-footer {
    display: flex;
    align-items: center;
    background-color: transparent;
    border: 0;
}

.btn-available {
    border: 1px solid #06a37c !important;
    background: #06a37c;
    color: #fff!Important;
}

#main-add-spinner {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: none;
    align-items: center;
    justify-content: center;
}

#main-add-spinner.active {
    display: flex;
}

i.fas.fa-info{
    display: inline-block;
    text-align: center;
    font-size: 14px;
    border: 2px solid #000;
    min-width: 26px;
    min-height: 26px;
    width:26px;
    height:26px;
    vertical-align: middle;
}

i.fas.fa-info::before{
    position: relative;
    top: 4px;   
}

.tooltip.bs-tooltip-bottom{
    margin-top: 30px;
}

.tooltip.show{
    opacity:1;
}

.tooltip{
    pointer-events:none;
}

.bs-tooltip-top .arrow::before, .bs-tooltip-auto[x-placement^="top"] .arrow::before{
    border-top-color:#ddd;
}

.bs-tooltip-bottom .arrow::before, .bs-tooltip-auto[x-placement^="bottom"] .arrow::before{
    border-bottom-color:#ddd;
}

.bs-tooltip-right .arrow::before, .bs-tooltip-auto[x-placement^="right"] .arrow::before{
    border-right-color:#ddd;
}

.bs-tooltip-left .arrow::before, .bs-tooltip-auto[x-placement^="left"] .arrow::before{
    border-left-color:#ddd;
}

.tooltip-inner{
    background: #fff;
    color: #000;
    font-size: 14px;
    text-align: left;
    padding:6px 8px;
    border:1px solid #ddd;
    max-width:240px;
}

.tooltip-inner .tt-title{
    padding-bottom:8px;
    margin-bottom:8px;
    border-bottom:1px solid #ddd;
    text-transform:uppercase;
    font-weight:600;
}

.input-group-text {
    padding-top: .23rem;
    padding-bottom: .23rem;
}

.dashboard-info-card .card-body i{
    font-size: 45px;
    opacity: 0.3;
    transition: color 1s ease, opacity 1s ease;
}

.dashboard-info-card:hover .card-body i{
    color: #27aae1;
    opacity: 1;
}

.dashboard-info-card .card-body h2{
    font-size: 38px;
    margin: 0;
    font-weight: 600;
}

/****/

.page-header {
    vertical-align: middle;
    margin: 1rem 0 1rem 0;
    padding: 0;
}

.page-header-h1-cont{
    flex: 0 0 65%;
}

.page-header h1 {
    font-weight: 600;
    font-size: 24px;
    color: var(--gray);
    display: inline-block;
    margin-bottom: 0px;
    padding: 6px 0;
    flex: 0 0 30%;
}

.page-header > .container-fluid{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
    flex-wrap: wrap;
}

.page-header > .container-fluid:has(> :only-child) {
    justify-content: flex-end;
}

.page-header .float-right{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: .5rem;
    flex: 0 0 35%;
}

.page-header > .container-fluid > .breadcrumb{
    width:100%;
}

.pagination-cont{
    background-color: #f1f3f4;
    padding: .5rem 1rem;
    border-radius: 6px;
    color: #4f4f4f;
    letter-spacing: .2px;
    font-weight: 500;
}

.pagination {
    margin: 0;
    flex-wrap: wrap;
}

.pagination-cont .row{
    align-items: center;
}

.pagination-cont .page-link{
    margin: 0 .5rem;
    background: var(--light);
    color: #4f4f4f;
    letter-spacing: .2px;
    font-weight: 500;
}

.pagination-cont .page-link:hover{
    background-color: #27aae1;
    color: #fff;
}

.pagination-cont .page-item.active .page-link{
    font-weight:bold;
}

.cke_toolbox{
    justify-content: flex-start;
    display: flex;
    flex-wrap: wrap;
}

.cke_toolbar_break {
    flex: 0 0 100%;
}

/*Task*/

.main-cont-results-page-top,
.secondary-cont-results-page-top{
    width:100%;
    margin-bottom: 1rem;
    display:flex;
    align-items:center;
    justify-content: space-between;
}

.inner-search-cont-results-page-top{
    display:flex;
    align-items:center;
    justify-content: center;
}

.secondary-inner-cont-results-page-top-totals{
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}

#seo-report-competitors-tab-content .nav .badge{
    box-shadow:none!Important;    
}

.secondary-inner-cont-results-page-top-totals .badge,
#seo-report-competitors-tab-content .nav .badge{
    padding: 8px 12px;
    font-weight:500;
}

#competitorInsightsModal .secondary-inner-cont-results-page-top-totals .badge{
    padding: 8px 12px;
    font-weight: 500;
    flex: 0 0 calc(33% - 5px);
}

.secondary-inner-cont-results-page-top-totals .badge span, 
#seo-report-competitors-tab-content .nav .badge span{
    margin-bottom:6px;
    font-weight: bold;
}

.secondary-inner-cont-results-page-top-downloads{
    display:flex;
    align-items:flex-end;
    justify-content: center;
    flex-direction: row;
}

.day-month-results-picker-seo-cont{
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 350px;
}

.main-cont-search-in-keywords-seo-cont{
    display: flex;
    flex-direction: column;
    align-items:flex-end;
    justify-content: center;
    min-width:410px;
}

.selectize-control.multi .selectize-input{
    min-height: 37.42px;    
}

.selectize-control.multi .selectize-input > div {
    font-size: 13px!Important;
    padding: 3px 12px!Important;
    border-radius: 6px!Important;
    border-color: transparent!Important;
    background: #f1f3f4!Important;
    min-height: 29px;
}

.selectize-control.multi .selectize-input > div.badge-warning{
    background-color: #ffebc2!Important;
    color: #453008!Important;
}

.selectize-control.multi .selectize-input > div.badge-light{
    background-color: #f5f5f5!Important;
    color: #404040!Important;
}

.selectize-dropdown [data-selectable]{
    padding: 10px 20px;
}

.selectize-item-tag {
    display: inline-flex!Important;
    align-items: center!Important;
    padding: 3px 6px!Important;
    background: #e8e8e8!Important;
    border-radius: 3px!Important;
    margin-right: 4px!Important;
}

.selectize-remove-tag {
    cursor: pointer;
    margin-left: 6px;
    color: #c00;
    font-weight: bold;
    font-size: 24px;
    margin-top: -1px;
}

.badge {
    font-size: .8rem;
}

.table.task-subtask-table {
    border-left:1px solid transparent;
    border-right:1px solid transparent;
}

.table.task-subtask-table tbody tr:last-child{
    border-bottom-color: transparent;    
}

.task-subtask-text-view{
    min-height: 43.2px;    
    word-break: break-all;
}

.task-subtask-edit-input{
    resize: none!Important;
    font-size: 16px;
    padding: 0!Important;
    border: none!Important;
    box-shadow: none!Important;
    min-height: 21.59px!Important;
    background-color: #eeeeee!Important; /*#f1f3f4*/
    font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    line-height: 1.35!Important;
}

.task-subtask-edit-input,
.task-card-subtask-input,
.task-card textarea,
#subtask-input,
.task-subtask-text-pre {
    tab-size: 2;
    -moz-tab-size: 2;
}

.task-card-subtask-input,
#subtask-input{
    min-height:36px;    
}

.task-urgent-subtask-toggle-wrap {
    min-height: 36px;
    cursor: pointer;
    background: #fff;
}

.task-urgent-subtask-checkbox {
    cursor: pointer;
}

.task-urgent-subtask-toggle-wrap i {
    pointer-events: none;
}

.dropdown-ellipsis-icon {
    font-size:24px;
    /*background: transparent;*/
    padding: 0.2375rem 1.5rem 0.155rem;
}

.dropdown-ellipsis-icon::after {
    display: none;
}

.subtask-drag-handle{ 
    cursor: grab;
    user-select: none;
    padding-left: .7rem;
    padding-right: .7rem;
}

.task-card-drag-handle{ 
    cursor: grab;
    user-select: none;
}

.subtask-sort-ghost,
.task-card-sort-ghost{ 
    opacity: .8;
}

.task-subtask-table tr,
.sortable-drag{
    box-shadow: none !important;
}

.flatpickr-day.task-day-green {
    background: #c7f5d9;
    color: #0b4121;
}

.flatpickr-day.task-day-red {
    background: #fdd8de;
    color: #790619;
}

.flatpickr-day.task-day-yellow {
    background: #ffebc2;
    color: #453008;
}

.flatpickr-day.task-day-grey {
    background: #4f4f4f;
    color: #fff;
}

/****/

.task-timer-value{
    font-size: 16px;
}

.task-timer-toggle{
    box-shadow: none ! Important;
    border: none;
    background: transparent;
    font-size: 18px;
    width: 30px;
    height: 30px;
    text-align: center;
}

.task-timer.is-hidden, 
.task-timer-toggle.is-hidden { 
    display:none !important; 
}

.selectize-control{
    width:100%;
}

.task-card-header{
    font-weight: 500;
    color: #1a1919
}

.task-main-info-title{
    line-height: 1.2;
    font-size: 14px;
}

.pickr{
    width: auto!Important;
    float: left;
}

.pickr .pcr-button{
   width: 4rem!Important;
   height: 4rem!Important;
}

.form-control-color{
    width: auto;
    height: auto;
}

.task-main-user-meta{
    background-color: #fff;
    color: #000;
    border-radius: 6px;
    padding: 2px 8px;
}

.task-report-subtask-name{
    outline:none!Important;
}

.task-report-subtask-name[contenteditable="true"]{
    white-space: pre-wrap;
    tab-size: 4;
}

.task-report-subtask-name[contenteditable="true"]:focus{
    background:#eee;
}


.task-report-task-name[contenteditable="true"]{
    white-space: pre-wrap;
    tab-size: 4;
    outline: none;
    width:100%;
}

.task-report-task-name[contenteditable="true"]:focus{
    background:#fff;
}


.dashboard-info-scroll-table {
    max-height: 350px;
    overflow-y: auto;
}

/**Seo report Cron status**/
#main-report-cron-search-progress-container {
    width: 600px;
    max-width: 100%;
    margin: auto;
    position: relative;
}

.main-report-cron-progress {
    height: 24px;
    background-color: #e9ecef;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
}

#main-report-cron-search-progress-bar {
    height: 100%;
    background-color: #28a745;
    transition: width 0.3s ease, background-color 0.3s ease;
}

#main-report-cron-search-progress-bar.main-report-cron-search-progress-paused {
    background-color: #ffc107;
}

#main-report-cron-search-progress-label {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-weight: bold;
    color: #000;
    text-shadow:
        -1px -1px 0 #fff,
         1px -1px 0 #fff,
        -1px  1px 0 #fff,
         1px  1px 0 #fff;
    pointer-events: none;
    font-size: 18px;
}

.main-report-cron-active-indicator {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.main-report-cron-active-indicator i {
    font-size: 26px;
}



/**Project list**/
@keyframes pulseRowBg {
    0% { background-color: transparent; }
    20% { background-color: rgba(255, 230, 0, .35); }
    50% { background-color: transparent; }
    70% { background-color: rgba(255, 230, 0, .35); }
    100% { background-color: transparent; }
}

.client-pulse-row,
.client-report-pulse-row,
.audit-pulse-row,
.heatmap-pulse-row,
.seo-report-pulse-row,
.project-pulse-row,
.task-subtask-urgent-pulse-row {
    animation: pulseRowBg 1.2s ease-in-out 3;
}

/**Seo report list**/
.seo-report-action-total{
    height: 100%;
    min-width: 60px;
    border-top-left-radius: .2rem;
    border-bottom-left-radius: .2rem;
    text-align: center;
}

.seo-report-action-group {
    display: inline-flex;
    width: auto;
}

.seo-report-action-group .btn {
    transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.seo-report-action-group-success .seo-report-action-total {
    background: #00b74a;
    border-color: #00b74a;
    color: #fff;
    opacity:1!Important;
}

.seo-report-action-group-error .seo-report-action-total {
    background: #dc3545;
    border-color: #dc3545;
    color: #fff;
    opacity:1!Important;
}

.seo-report-action-group.btn-group > .btn:not(:first-child) {
    margin-left: 0;
}

/**Seo report form**/
#main-report-check-spinner{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0009;
    z-index: 10000;
    display: none;
    align-items: center;
    justify-content: center;
    flex-flow: column;
}

#main-report-check-search-progress-container {
    width: 600px;
    max-width: 90%;
    position: relative;
}

.main-report-check-progress {
    height: 24px;
    background-color: #e9ecef;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
}

#main-report-check-search-progress-bar {
    height: 100%;
    background-color: #28a745;
    transition: width 0.3s ease;
}

#main-report-check-search-progress-label {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-weight: bold;
    color: #000;
    text-shadow:
        -1px -1px 0 #fff,
         1px -1px 0 #fff,
        -1px  1px 0 #fff,
         1px  1px 0 #fff;
    pointer-events: none;
    font-size: 18px;
} 

#main-report-check-progress-count {
    font-size: 14px;
}

#main-report-check-progress-keywords {
    width: 100%;
    overflow: auto;
    text-align: left;
}

.main-report-check-progress-keyword {
    padding: 8px 10px;
    margin-bottom: 7px;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    background: #fff;
    font-size: 13px;
}

.main-report-check-progress-keyword.is-done {
    opacity: .85;
}

.main-report-check-progress-keyword-header {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 6px;
}

.main-report-check-progress-page {
    min-width: 46px;
    text-align: center;
    font-weight: bold;
}

.main-report-check-progress-keyword-text {
    font-weight: 600;
}

.main-report-check-progress-keyword-location {
    font-size: 12px;
    color: #777;
}

.main-report-check-progress-mini {
    height: 7px;
    background-color: #e9ecef;
    border-radius: 7px;
    overflow: hidden;
}

.main-report-check-progress-mini-bar {
    height: 100%;
    width: 0%;
    background-color: #28a745;
    transition: width .25s ease;
}

#main-report-check-spinner.active {
    display: flex;
    justify-content: center;
}

.main-report-check-card {
    width: 760px;
    max-width: 96%;
    background: #fff;
    border-radius: 10px;
}

.main-report-check-card .card-body {
    padding: 18px;
}

.main-report-check-progress-keyword.is-placeholder {
    pointer-events: none;
}

.main-report-check-placeholder {
    display: block;
    height: 12px;
    border-radius: 8px;
    background: linear-gradient(90deg, #f1f3f5 25%, #e9ecef 50%, #f1f3f5 75%);
    background-size: 200% 100%;
    animation: main-report-check-placeholder-loading 1.2s infinite linear;
}

.main-report-check-placeholder-page {
    width: 46px;
    height: 22px;
}

.main-report-check-placeholder-keyword {
    width: 180px;
}

.main-report-check-placeholder-location {
    width: 220px;
}

.main-report-check-placeholder-bar {
    height: 7px;
    width: 100%;
}

@keyframes main-report-check-placeholder-loading {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

/**/

.check-keyowrds-sugestions-dropdown{ 
    position: absolute;
    width: 100%;
    top: 100%;
    z-index: 1000;
    max-height: 250px;
    overflow-x: hidden;
    overflow-y: scroll;
    border: 1px solid #000;
}

.check-keyowrds-sugestions-dropdown .list-group-item{
    border-bottom-color: transparent!Important;
}

.sticky-header th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #f8f9fa; /* same as thead-light */
}

#tab-results .sticky-header th {
    top: -1px;
}

.page-heading-group,
.page-header h1.page-heading-group{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#taskMainUserTabsOrderList .list-group-item{
    margin-bottom: 1px;
}

.task-subtask-group-heading.task-subtask-group-current-day td {
    background-color: #e6f7f7;
}

.project-frequency-hours-wrap,
.additional-project-frequency-hours-wrap {
    display: flex;
    flex: 0 0 auto;
    min-width: 120px;
}

.project-frequency-hours-wrap input,
.additional-project-frequency-hours-wrap input {
    min-width: 120px;
    width: 120px;
}

/*Snapshop seo report*/

#resultsInfoModal.results-info-modal-snapshot{
    padding-right:0px!Important;
}

#resultsInfoModal.results-info-modal-snapshot .modal-header{
    display: none!Important;
}

#resultsInfoModal.results-info-modal-snapshot .results-info-modal-snapshot-page-nav{
    display: flex;
    align-items: center;
    justify-content: center;
}

#resultsInfoModal.results-info-modal-snapshot .results-info-modal-snapshot-page-nav .nav-tabs{
    flex: 1;
}

#resultsInfoModal.results-info-modal-snapshot .results-info-modal-snapshot-page-nav .results-info-modal-snapshot-close{
    width: 45px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: #000;
    line-height: 22px;
    cursor: pointer;
}

#resultsInfoModal.results-info-modal-snapshot .results-info-snapshot-container .nav-tabs .nav-link{
    padding: 8px 24px 6px;
}

#resultsInfoModal.results-info-modal-snapshot .modal-dialog {
    width: 100vw;
    margin: 0;
    height: 100vh;
    max-width: 100%;
}

#resultsInfoModal.results-info-modal-snapshot .modal-content {
    height: 100vh;
    border-radius: 0px;
    overflow: hidden;
}

#resultsInfoModal.results-info-modal-snapshot .modal-body {
    padding: 0px!Important;
}

#resultsInfoModal.results-info-modal-snapshot .results-info-snapshot-container, 
#resultsInfoModal.results-info-modal-snapshot .tab-content,
#resultsInfoModal.results-info-modal-snapshot .tab-pane.active {
    height: 100%;
}

/**/

.client-report-mini-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 260px;
    background: #fff;
    padding: 0px 4px;
}

.client-report-mini-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 20px;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
    border-bottom: 1px solid #e0e0e0;
}

.client-report-mini-row:last-child {
    border-bottom: 0;
}

.client-report-mini-name,
.client-report-mini-meta {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.client-report-mini-name {
    font-weight: 500;
    color: #212529;
}

.client-report-mini-meta {
    color: #4f4f4f;
    font-size: 12px;
}

.client-report-mini-status {
    text-align: center;
}

.client-report-attached-reports {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
    justify-content: center;
}

.client-report-attached-report-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 60px;
    min-height: 60px;
    color: #6c757d;
}

.client-report-attached-report-card .badge {
    min-width: 24px;
}

.client-report-details-row > td {
    padding: 12px!Important;
    background: #f8f9fa;
    border-top: 0;
}

.client-report-details-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.client-report-details-module {
    min-width: 0;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: #fff;
    overflow: hidden;
}

.client-report-details-module-title {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
    font-weight: 600;
}

.client-report-details-module-content {
    padding: 8px;
}

.client-report-details-module .client-report-mini-list {
    min-width: 0;
    padding: 0;
}

.client-report-mini-empty {
    padding: 5px;
    color: #6c757d;
    font-size: 12px;
    text-align: center;
}

@media (max-width: 1399px) {
    .client-report-details-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .client-report-details-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/**/

.pcr-button{
    float: left;
}

/**/

.task-day-timeline-track {
    position: relative;
    height: 58px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #f8f9fa;
    overflow: hidden;
}

.task-day-timeline-grid {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 20px;
    right: 20px;
    z-index: 1;
}

.task-day-timeline-hour-marker {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1px;
    background: rgba(0, 0, 0, 0.08);
}

.task-day-timeline-bars {
    position: absolute;
    left: 20px;
    right: 20px;
    top: 10px;
    height: 38px;
    z-index: 2;
}

.task-day-timeline-bar {
    position: absolute;
    top: 0;
    bottom: 0;
    min-width: 3px;
    border-radius: 0px;
    color: #fff;
    font-size: 11px;
    line-height: 38px;
    padding: 0 8px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-right: 1px solid #f8f9fa;
    border-left: 1px solid #f8f9fa;
    background: #27aae1;
    cursor: context-menu;
}

.task-day-timeline-bars .task-day-timeline-bar:first-child{
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}

.task-day-timeline-bars .task-day-timeline-bar:last-child{
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}

.task-day-timeline-hours {
    position: relative;
    height: 24px;
    margin: 6px 20px 0 20px;
}

.task-day-timeline-hour-label {
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    font-size: 11px;
    color: #4f4f4f;
    white-space: nowrap;
}

/**/

#tab-content-pages table tbody tr{
    height: 60px;
    overflow: hidden;
}

.modal-dialog.modal-xl {
    width: clamp(800px, 95vw, 1140px);
    max-width: calc(100vw - 1rem);
}

/**/

.input-group > .seo-location-autocomplete-wrap {
    position: relative;
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
}

.input-group > .seo-location-autocomplete-wrap > .form-control {
    width: 100%;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-group > .seo-location-autocomplete-wrap:not(:last-child) > .form-control {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group > .seo-location-autocomplete-wrap > .dropdown-menu {
    top: 100% !important;
    left: 0 !important;
    right: auto !important;
    width: 100%;
}

/**/

.seo-inline-keyword-translate-flag {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 13px !important;
    min-width: 13px !important;
    max-width: 13px !important;
    height: 13px !important;
    min-height: 13px !important;
    max-height: 13px !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 13px !important;
    flex: 0 0 13px !important;
    box-shadow: none !important;
}

.seo-inline-keyword-translate-flag i {
    font-size: 11px !important;
    line-height: 13px !important;
}

.seo-keyword-port-checkbox,
.seo-possible-keyword-translate-checkbox {
    flex: 0 0 auto !important;
    min-width: auto !important;
}

/**/

.task-live-update-toast {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1065;
    width: 320px;
    max-width: calc(100vw - 40px);
    display: none;
}

.task-live-update-toast.active {
    display: block;
}

.task-subtask-state-icon {
    font-style: normal;
}

.task-emoji-icon {
    display: inline-block;
    font-style: normal;
    line-height: 1;
}

.task-emoji-lock::before {
    content: "\01F512";
}

.task-emoji-running::before {
    content: "\01F534";
}

/**/

.copy-toast {
    position: fixed;
    left: 50%;
    bottom: 25px;
    z-index: 99999;
    min-width: 240px;
    max-width: calc(100% - 30px);
    padding: 12px 18px;
    background: #fff;
    color: #212529;
    border-radius: 30px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
    font-size: 14px;
    text-align: center;
    transform: translate(-50%, 20px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.copy-toast.show {
    opacity: 1;
    transform: translate(-50%, 0);
}

.copy-toast i {
    margin-right: 6px;
}

.copy-toast.copy-toast-success i {
    color: #28a745;
}

.copy-toast.copy-toast-error i {
    color: #dc3545;
}

.copy-toast.copy-toast-warning i {
    color: #ffc107;
}

/**/

.client-update-document,
.client-update-page {
    min-height: 100%;
    background: var(--ds-bg, #04101d);
}

.client-update-page {
    position: relative;
    min-height: 100vh;
    margin: 0;
    overflow-x: hidden;
    color: var(--ds-text, #f5faff);
    background:
        radial-gradient(circle at 12% 10%, rgba(130, 88, 200, .15), transparent 31rem),
        radial-gradient(circle at 88% 16%, rgba(44, 132, 200, .14), transparent 34rem),
        radial-gradient(circle at 72% 92%, rgba(45, 189, 187, .08), transparent 30rem),
        var(--ds-bg, #04101d);
    font-family: var(--ds-font-body, "Manrope", ui-sans-serif, system-ui, sans-serif);
}

.client-update-page::before,
.client-update-page::after {
    content: "";
    position: fixed;
    z-index: 0;
    border: 1px solid rgba(91, 151, 205, .12);
    border-radius: 50%;
    pointer-events: none;
}

.client-update-page::before {
    top: -210px;
    right: -160px;
    width: 520px;
    height: 520px;
    box-shadow: 0 0 0 58px rgba(74, 113, 200, .025), 0 0 0 118px rgba(45, 189, 187, .018);
}

.client-update-page::after {
    left: -170px;
    bottom: -260px;
    width: 560px;
    height: 560px;
    box-shadow: 0 0 0 74px rgba(130, 88, 200, .022);
}

.client-update-wrapper {
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 100vh;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: flex-start;
    padding: 44px 22px 72px;
}

.client-update-logo-cont {
    width: 100%;
    max-width: 980px;
    margin-bottom: 26px;
    text-align: center;
}

.client-update-logo {
    display: block;
    width: auto;
    max-width: 190px;
    height: 38px;
    margin-left: auto;
    margin-right: auto;
}

.client-update-logo-light {
    display: none;
}

html[data-theme="light"] .client-update-logo-dark {
    display: none;
}

html[data-theme="light"] .client-update-logo-light {
    display: block;
}

.client-update-card {
    position: relative;
    width: 100%;
    max-width: 980px;
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: var(--ds-radius-card, 36px 36px 36px 14px);
    color: var(--ds-text, #f5faff);
    background: var(--ds-surface-card, linear-gradient(145deg, rgba(10, 29, 48, .96), rgba(6, 21, 37, .94)));
    box-shadow: var(--ds-shadow, 0 30px 90px rgba(0, 18, 44, .42));
    backdrop-filter: blur(18px);
}

.client-update-card::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -90px;
    width: 290px;
    height: 290px;
    border: 1px solid rgba(92, 168, 222, .10);
    border-radius: 50%;
    pointer-events: none;
}

.client-update-card > * {
    position: relative;
    z-index: 1;
}

.client-update-card-header {
    padding: 28px 30px 24px;
    border-bottom: 1px solid var(--ds-border-soft, rgba(143, 193, 230, .10));
}

.client-update-card-header h3,
.client-update-message h3 {
    margin: 0;
    font-family: var(--ds-font-heading, "Sora", "Manrope", sans-serif);
    font-size: clamp(1.35rem, 2vw, 1.8rem);
    font-weight: 700;
    letter-spacing: -.025em;
}

.client-update-card-header h3 {
    color: var(--ds-text, #f5faff);
}

.client-update-message .text-success {
    color: var(--ds-success, #6ad8ad) !important;
}

.client-update-message .text-danger {
    color: var(--ds-danger, #ff7189) !important;
}

.client-update-card-header .text-muted,
.client-update-card .text-muted {
    color: var(--ds-muted, #90a9bf) !important;
}

.client-update-card-header .text-muted {
    margin-top: 7px;
    font-size: .9rem;
    line-height: 1.6;
}

.client-update-card-body {
    padding: 30px;
}

.client-update-message {
    max-width: 680px;
    margin: 20px auto 70px;
    padding: 42px 34px;
    text-align: center;
}

.client-update-card fieldset {
    margin: 0 0 22px;
    padding: 22px;
    border: 1px solid var(--ds-border-soft, rgba(143, 193, 230, .10));
    border-radius: var(--ds-radius-lg, 20px);
    background: var(--ds-surface-panel, linear-gradient(145deg, rgba(9, 27, 42, .95), rgba(5, 20, 33, .94)));
    box-shadow: var(--ds-shadow-card, 0 22px 52px rgba(0, 8, 19, .20));
}

.client-update-card fieldset:last-of-type {
    margin-bottom: 26px;
}

.client-update-card legend {
    width: auto;
    max-width: 100%;
    margin: 0 0 18px;
    padding: 0 12px 0 0;
    color: var(--ds-text, #f5faff);
    font-family: var(--ds-font-heading, "Sora", "Manrope", sans-serif);
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -.015em;
}

.client-update-card-body .form-group {
    margin-bottom: 16px;
}

.client-update-card-body .form-group:last-child {
    margin-bottom: 0;
}

.client-update-card-body .form-group.row + .form-group.row {
    padding-top: 0;
    border-top: 0;
}

.client-update-card .col-form-label {
    padding-top: 0;
    padding-bottom: 7px;
    color: var(--ds-text-body, #c5d7e5);
    font-size: .79rem;
    font-weight: 800;
    letter-spacing: .015em;
}

.client-update-card .form-control {
    min-height: 48px;
    height: 48px;
    padding: 10px 14px;
    border: 1px solid var(--ds-border-strong, rgba(143, 193, 230, .17));
    border-radius: var(--ds-radius-control, 15px 15px 15px 7px);
    color: var(--ds-text, #f5faff);
    background: var(--ds-surface-control, linear-gradient(145deg, rgba(2, 13, 23, .62), rgba(7, 24, 38, .52)));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
    font-family: var(--ds-font-body, "Manrope", sans-serif);
    font-size: .88rem;
    line-height: 1.35;
    transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.client-update-card select.form-control {
    padding-right: 34px;
}

.client-update-card .form-control:hover {
    border-color: rgba(77, 169, 255, .34);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}

.client-update-card .form-control:focus {
    border-color: var(--ds-accent, #4da9ff);
    outline: 0;
    background: var(--ds-surface-control, linear-gradient(145deg, rgba(2, 13, 23, .72), rgba(7, 24, 38, .62)));
    box-shadow: 0 0 0 4px var(--ds-focus-ring, rgba(77, 169, 255, .13)), inset 0 1px 0 rgba(255, 255, 255, .05);
}

.client-update-card .form-control::placeholder {
    color: var(--ds-text-subtle, #668197);
}

.client-update-card .table-responsive {
    overflow: hidden;
    border: 1px solid var(--ds-border-soft, rgba(143, 193, 230, .10));
    border-radius: 16px 16px 16px 7px;
}

.client-update-card .table {
    margin-bottom: 0;
    color: var(--ds-text-body, #c5d7e5);
    background: transparent;
}

.client-update-card .table th,
.client-update-card .table td {
    border-color: var(--ds-border-soft, rgba(143, 193, 230, .10));
    vertical-align: middle;
}

.client-update-card .table thead th {
    border-bottom-width: 1px;
    color: var(--ds-text, #f5faff);
    background: var(--ds-surface-soft, rgba(255, 255, 255, .03));
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .025em;
}

.client-update-card .table td {
    background: transparent;
}

.client-update-card .table .form-control {
    min-width: 160px;
}

.client-update-card .badge {
    padding: 6px 9px;
    border-radius: 7px;
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .13);
    font-weight: 700;
}

.client-update-card .btn-group-toggle {
    gap: 7px;
}

.client-update-card .btn-group-toggle .btn {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 8px 18px;
    border: 1px solid var(--ds-border-strong, rgba(143, 193, 230, .17));
    border-radius: 999px !important;
    color: var(--ds-text-body, #c5d7e5);
    background: var(--ds-surface-button, rgba(17, 47, 73, .9));
    box-shadow: none;
    text-align: center;
    font-weight: 700;
}

.client-update-card .btn-group-toggle .btn:hover {
    border-color: rgba(77, 169, 255, .4);
    color: var(--ds-text, #f5faff);
}

.client-update-card .btn-group-toggle .btn.active,
.client-update-card .btn-outline-secondary:not(:disabled):not(.disabled):active,
.client-update-card .btn-outline-secondary:not(:disabled):not(.disabled).active {
    border-color: transparent;
    color: #fff;
    background: var(--ds-surface-primary, linear-gradient(104deg, #8258c8, #2c84c8 70%, #2dbdbb 116%));
    box-shadow: 0 10px 24px rgba(44, 132, 200, .18);
}

.client-update-card input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-right: 8px;
    border: 1px solid var(--ds-border-strong, rgba(143, 193, 230, .24));
    border-radius: 5px;
    vertical-align: -4px;
    background: var(--ds-surface-control-solid, #071826);
}

.client-update-card input[type="checkbox"]:checked {
    border-color: var(--ds-accent, #4da9ff);
    background-color: var(--ds-accent, #4da9ff);
}

.client-update-card a {
    color: var(--ds-primary-bright, #4da9ff);
    font-weight: 700;
}

.client-update-card a:hover {
    color: var(--ds-teal, #2dbdbb);
}

.client-update-card .btn-primary,
.client-update-page .modal .btn-primary,
.client-update-page .modal .btn-success {
    min-height: 50px;
    border: 1px solid transparent;
    border-radius: 999px;
    color: #f7fbff;
    background: var(--ds-surface-primary, linear-gradient(104deg, #8258c8 0%, #496fc9 38%, #2c84c8 70%, #2dbdbb 116%));
    box-shadow: 0 16px 38px rgba(70, 94, 191, .24), 0 8px 24px rgba(44, 132, 200, .16), inset 0 1px 0 rgba(255, 255, 255, .22);
    font-family: var(--ds-font-body, "Manrope", sans-serif);
    font-weight: 800;
}

.client-update-card .btn-primary:hover,
.client-update-page .modal .btn-primary:hover,
.client-update-page .modal .btn-success:hover {
    border-color: transparent;
    color: #fff;
    filter: brightness(1.06);
    transform: translateY(-1px);
}

.client-update-card .alert,
.client-update-card .invalid-tooltip {
    border: 1px solid rgba(255, 113, 137, .2);
    border-radius: 12px 12px 12px 6px;
    color: #ffdce2;
    background: rgba(121, 28, 48, .26);
}

.client-update-card .invalid-tooltip {
    margin-top: 6px;
    padding: 7px 10px;
    font-size: .75rem;
}

.client-update-page .modal-content {
    overflow: hidden;
    border: 1px solid var(--ds-border-strong, rgba(143, 193, 230, .17));
    border-radius: 24px 24px 24px 10px;
    color: var(--ds-text, #f5faff);
    background: var(--ds-surface-card-solid, #0a1d30);
    box-shadow: var(--ds-shadow, 0 30px 90px rgba(0, 18, 44, .42));
}

.client-update-page .modal-header,
.client-update-page .modal-footer {
    border-color: var(--ds-border-soft, rgba(143, 193, 230, .10));
}

.client-update-page .modal-title {
    font-family: var(--ds-font-heading, "Sora", "Manrope", sans-serif);
    font-weight: 700;
}

.client-update-page .modal .close {
    color: var(--ds-text, #f5faff);
    text-shadow: none;
    opacity: .7;
}

.client-update-page .modal .close:hover {
    color: var(--ds-text, #f5faff);
    opacity: 1;
}

.client-update-page .modal .btn-light {
    min-height: 44px;
    padding: 8px 20px;
    border: 1px solid var(--ds-border-strong, rgba(143, 193, 230, .17));
    border-radius: 999px;
    color: var(--ds-text, #f5faff);
    background: var(--ds-surface-button, rgba(17, 47, 73, .9));
    font-weight: 700;
}

html[data-theme="light"] .client-update-page {
    background:
        radial-gradient(circle at 12% 10%, rgba(130, 88, 200, .08), transparent 31rem),
        radial-gradient(circle at 88% 16%, rgba(44, 132, 200, .09), transparent 34rem),
        radial-gradient(circle at 72% 92%, rgba(45, 189, 187, .06), transparent 30rem),
        var(--ds-bg, #edf5fa);
}

html[data-theme="light"] .client-update-card .alert,
html[data-theme="light"] .client-update-card .invalid-tooltip {
    color: #9b2138;
    background: rgba(220, 53, 69, .07);
}

html[data-theme="light"] .client-update-page .modal .btn-light {
    color: var(--ds-text, #10283a);
}

@media (max-width: 767.98px) {
    .client-update-wrapper {
        padding: 28px 10px 48px;
    }

    .client-update-logo-cont {
        margin-bottom: 20px;
        padding-left: 6px;
    }

    .client-update-logo {
        max-width: 164px;
        height: 34px;
    }

    .client-update-card {
        border-radius: 24px 24px 24px 10px;
    }

    .client-update-card-header {
        padding: 22px 18px 19px;
    }

    .client-update-card-body {
        padding: 18px;
    }

    .client-update-card fieldset {
        padding: 17px 14px;
        border-radius: 17px 17px 17px 8px;
    }

    .client-update-card .table-responsive {
        overflow-x: auto;
    }

    .client-update-message {
        margin-top: 12px;
        padding: 32px 22px;
    }
}

@media (max-width: 363px) {
    .client-update-card .btn-group-toggle {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .client-update-card .btn-group-toggle .btn {
        width: 100%;
    }
}

/**/

.task-card-deadline {
    border: 4px solid;
    border-left-width: 0;
    border-right-width: 0;
    border-radius: 12px;
}

.task-card-deadline-warning{
    border-color: #ffc107;
}

.task-card-deadline-danger{
    border-color: #dc3545;
}

/**/

.task-notes-btn {
    position: relative;
}

.task-notes-btn.btn-info {
    background-color: #fbfbfb;
    color: #32a2c2;
}

.btn .badge.task-notes-count-badge {
    border-radius: 100%;
}

.task-notes-pulse .task-notes-count-badge {
    animation: taskNotesBadgeScale 0.9s ease-in-out infinite;
    transform-origin: center;
}

.task-show-all-subtasks-toggle{
    height: 29.74px;
    line-height: 1;
}

@keyframes taskNotesBadgeScale {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }

    100% {
        transform: scale(1);
    }
}

.task-notes-list {
    max-height: 430px;
    overflow-y: auto;
    padding: 0 12px 0 0;
}

.task-note-item {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 12px;
    width:100%;
}

.task-note-item.task-note-own {
    justify-content: flex-end;
}

.task-note-bubble {
    width:100%;
    border-radius: 14px;
    padding: 10px 12px;
    background: #eeeeee;
    border: 1px solid #e9ecef;
}

.task-note-own .task-note-bubble {
    background: #e8f4ff;
    border-color: #bee5eb;
}

.task-note-meta {
    font-size: 12px;
    color: #4f4f4f;
    margin-bottom: 6px;
}

.task-note-text {
    white-space: pre-wrap;
    word-break: break-word;
}

.task-note-actions {
    margin-top: 8px;
}

/**/

#task-status-tabs.nav-tabs {
    border-radius:0px!Important;
}

#task-status-tabs .nav-link{
    padding-top: 8px;
    padding-bottom: 6px;
}

#task-status-tabs .badge{
    padding-top: 3px;
    padding-bottom: 3px;
}

.nav-tabs li.nav-item a.task-subtask-tag-tab-member-no-access{
    background-color: #ddd;
    border-top-right-radius: 0px!Important;
    border-bottom-right-radius: 0px!Important;
}

.task-subtask-tag-tab-wrap .task-subtask-tag-access-toggle {
    border-radius: 0;
    box-shadow: none;
    padding: 10px 12px;
    background-color: #ddd;
}

.task-subtask-tag-tab-wrap a.task-subtask-tag-tab-member-no-access{
    background-color: red;

}

.task-subtask-tag-tab-wrap .task-subtask-tag-tab {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.task-subtask-tag-tab-wrap .task-subtask-tag-access-toggle i {
    font-size: 12px;
}

/**/

.task-estimate-dropdown-toggle{
    height: 21.74px;
    line-height: 1;
    border-top-left-radius:0px;
    border-bottom-left-radius:0px;
}

/**/

.competitor-recommendations-progress-track {
    height: 18px;
    background-color: #e9ecef;
    border-radius: 12px;
    overflow: hidden;
}

.competitor-recommendations-progress-bar {
    background-color: #28a745;
    border-radius: 12px;
}

/**/

.task-list-heading {
    border: 1px dashed #d8dce2;
    border-radius: .35rem;
    background: #f8f9fa;
    padding: .35rem .5rem;
}

.task-list-heading-title {
    border-bottom: 0;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    color: #343a40;
    padding-left: .75rem;
}

.task-list-heading .task-card-drag-handle {
    cursor: move;
}

/**/

.audit-report-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    flex-wrap: wrap;
}

.audit-check-progress {
    display: none;
    width: 100%;
    min-width: 0;
    margin: 0;
}

.audit-check-progress.active {
    display: block;
}

.audit-check-progress-card {
    width: 100%;
    max-width: none;
}


#tab-report.audit-check-running > *:not(.audit-report-toolbar) {
    display: none !important;
}

#tab-report.audit-check-running .audit-report-toolbar > *:not(.audit-check-progress) {
    display: none !important;
}

#tab-report.audit-check-running .audit-report-toolbar {
    display: block;
    width: 100%;
}

#tab-report.audit-check-running .audit-check-progress {
    margin-top: 0;
}

.audit-check-progress .main-report-check-progress {
    width: 100%;
    height: 9px;
}

.audit-check-progress-sections {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
    align-content: start;
    gap: 10px;
    max-height: min(50vh, 460px);
    min-height: 77px;
    padding: 2px;
    overflow-x: hidden;
    overflow-y: auto;
    text-align: left;
    scrollbar-width: thin;
}

.audit-check-progress-section {
    min-width: 0;
    margin-bottom: 0;
}

.audit-check-progress-section.is-running {
    border-color: #b8daff;
    background: #f7fbff;
}

.audit-check-progress-section.is-done {
    opacity: .85;
}

.audit-check-progress-section.is-error {
    border-color: #f1aeb5;
    background: #fff5f6;
}

.audit-check-progress-detail {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow-wrap: anywhere;
}

.audit-report-implementation-notes{
    box-shadow: 0 10px 15px -3px rgba(0,0,0,.07),0 4px 6px -2px rgba(0,0,0,.05);
    border-radius: 6px;
}

.audit-report-top-card {
    position: relative;
    display: flex;
    gap: 20px;
    align-items: center;
    overflow: hidden;
    border: 1px solid #d9f99d;
    border-radius: 12px;
    background: linear-gradient(135deg, #f7fee7 0%, #ffffff 58%, #f0f9ff 100%);
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
    padding: 20px;
    margin-bottom: 15px;
}

.audit-report-top-card::after {
    position: absolute;
    top: -95px;
    right: -80px;
    width: 210px;
    height: 210px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(56, 189, 248, .13) 0%, rgba(56, 189, 248, 0) 70%);
    content: '';
    pointer-events: none;
}

.audit-report-score-circle {
    position: relative;
    z-index: 1;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: conic-gradient(#f59e0b 0 65%, #e5e7eb 65% 100%);
}

.audit-report-score-circle-success {
    background: conic-gradient(#22c55e 0 85%, #e5e7eb 85% 100%);
}

.audit-report-score-circle-warning {
    background: conic-gradient(#f59e0b 0 65%, #e5e7eb 65% 100%);
}

.audit-report-score-circle-danger {
    background: conic-gradient(#ef4444 0 40%, #e5e7eb 40% 100%);
}

.audit-report-score-circle > div {
    width: 122px;
    height: 122px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .96);
    box-shadow: inset 0 0 0 1px rgba(226, 232, 240, .9), 0 7px 18px rgba(15, 23, 42, .08);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.audit-report-score-circle strong {
    font-size: 44px;
    line-height: 1;
}

.audit-report-score-circle span {
    font-size: 16px;
    color: #4f4f4f;
}

.audit-report-top-content {
    position: relative;
    z-index: 1;
    flex: 1;
    min-width: 0;
}

.audit-report-top-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #4d7c0f;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.audit-report-top-title {
    display: flex;
    gap: 8px;
    align-items: baseline;
    margin: 6px 0 7px;
}

.audit-report-top-title span {
    color: #4f4f4f;
    font-size: 13px;
}

.audit-report-top-title strong {
    color: #1e293b;
    font-size: 22px;
}

.audit-report-top-content p {
    margin: 0 0 10px;
    color: #475569;
    line-height: 1.55;
}

.audit-report-top-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex-direction: column;
    align-items: flex-start;
}

.audit-report-top-meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #e5e7eb;
    border-radius: 20px;
    padding: 4px 9px;
    font-size: 12px;
    color: #4b5563;
    background: rgba(255, 255, 255, .82);
}

.audit-report-screenshot-preview {
    overflow: hidden;
    margin-bottom: 15px;
    border: 1px solid #dbeafe;
    border-radius: 12px;
    background: linear-gradient(135deg, #f8fafc 0%, #ffffff 54%, #f0f9ff 100%);
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
}

.audit-report-screenshot-preview .audit-report-block-title {
    padding: 14px 16px;
    border-bottom: 1px solid rgba(203, 213, 225, .8);
    background: rgba(255, 255, 255, .58);
}

.audit-report-section-kicker {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 2px;
    color: #0369a1;
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.audit-report-card-heading-copy,
.audit-report-screenshot-title-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-width: 0;
}

.audit-report-card-heading-copy > strong,
.audit-report-card-heading-copy > h4 {
    color: #1e293b;
}

.audit-report-section-kicker-danger {
    color: #b91c1c;
}

.audit-report-section-kicker-warning {
    color: #b45309;
}

.audit-report-section-kicker-success {
    color: #047857;
}

.audit-report-section-kicker-info {
    color: #0369a1;
}

.audit-report-screenshot-preview .audit-report-block-title strong {
    color: #1e293b;
    font-size: 14px;
}

.audit-report-screenshot-preview .audit-report-block-title small {
    color: #64748b;
    font-size: 11px;
}

.audit-report-screenshot-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(180px, 260px);
    align-items: start;
    gap: 12px;
    padding: 14px;
}

.audit-report-screenshot-card {
    height: 100%;
    padding: 12px;
    border: 1px solid rgba(226, 232, 240, .95);
    border-radius: 10px;
    background: rgba(255, 255, 255, .86);
    text-align: center;
}

.audit-report-screenshot-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 74px;
    margin-bottom: 8px;
    padding: 4px 10px;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    background: #ffffff;
    color: #475569;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.audit-report-screenshot-card img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    background: #fff;
}

.audit-report-screenshot-mobile img {
    max-height: 400px;
}

.audit-report-screenshot-desktop img {
    height: 400px;
    width:auto;
}

.audit-report-priority-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.audit-report-priority-card,
.audit-report-recommendations-overview,
.audit-report-category-score-overview {
    position: relative;
    height: 100%;
    overflow: hidden;
    border: 1px solid #dbeafe;
    border-radius: 12px;
    background: linear-gradient(135deg, #f8fafc 0%, #ffffff 58%, #f0f9ff 100%);
    box-shadow: 0 8px 22px rgba(15, 23, 42, .06);
}

.audit-report-priority-card::after,
.audit-report-recommendations-overview::after,
.audit-report-category-score-overview::after {
    position: absolute;
    top: -80px;
    right: -65px;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(56, 189, 248, .11) 0%, rgba(56, 189, 248, 0) 70%);
    content: '';
    pointer-events: none;
}

.audit-report-priority-critical {
    border-color: #fecaca;
    background: linear-gradient(135deg, #fff7f7 0%, #ffffff 58%, #fff1f2 100%);
}

.audit-report-priority-important {
    border-color: #fde68a;
    background: linear-gradient(135deg, #fffbeb 0%, #ffffff 58%, #fff7ed 100%);
}

.audit-report-priority-optional,
.audit-report-recommendations-overview {
    border-color: #bbf7d0;
    background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 58%, #ecfeff 100%);
}

.audit-report-priority-card-header,
.audit-report-block-title {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding: 14px 16px;
    border-bottom: 1px solid rgba(203, 213, 225, .8);
    background: rgba(255, 255, 255, .58);
    font-size: 13px;
}

.audit-report-priority-card-header span,
.audit-report-block-title span {
    min-width: 26px;
    height: 24px;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    background: #f3f4f6;
    font-weight: 700;
    font-size: 12px;
}

.audit-report-priority-card-header-actions,
.audit-report-block-title-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.audit-report-recommendations-export-btn {
    width: 28px;
    height: 24px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    line-height: 1;
}

.audit-report-recommendations-export-btn.disabled,
.audit-report-recommendations-export-btn:disabled {
    pointer-events: none;
    opacity: .65;
}

.audit-report-priority-critical .audit-report-priority-card-header {
    color: #991b1b;
}

.audit-report-priority-important .audit-report-priority-card-header {
    color: #92400e;
}

.audit-report-priority-optional .audit-report-priority-card-header {
    color: #047857;
}

.audit-report-priority-list {
    position: relative;
    z-index: 1;
    max-height: 270px;
    margin: 0;
    overflow: auto;
    padding: 12px 14px 12px 32px;
}

.audit-report-priority-list li {
    margin-bottom: 8px;
    padding: 9px 10px;
    border: 1px solid rgba(226, 232, 240, .95);
    border-radius: 9px;
    background: rgba(255, 255, 255, .78);
    font-size: 12px;
}

.audit-report-priority-list li:last-child {
    margin-bottom: 0;
}

.audit-report-priority-list strong,
.audit-report-recommendation-overview-item strong {
    display: block;
    color: #111827;
    line-height: 1.35;
}

.audit-report-priority-list div,
.audit-report-recommendation-overview-item div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 3px;
    color: #4f4f4f;
}

.audit-report-priority-list .audit-report-estimated-time-long,
.audit-report-recommendation-overview-item .audit-report-estimated-time-long {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 3px;
}

.audit-report-priority-list .audit-report-estimated-time-long em,
.audit-report-recommendation-overview-item .audit-report-estimated-time-long em {
    margin-left: 0;
}

.audit-report-priority-list em,
.audit-report-recommendation-overview-item em {
    color: #4f4f4f;
    font-style: normal;
    font-weight: 700;
}

.audit-report-priority-empty {
    position: relative;
    z-index: 1;
    margin: 12px 14px;
    padding: 12px;
    border: 1px dashed rgba(148, 163, 184, .55);
    border-radius: 9px;
    background: rgba(255, 255, 255, .7);
    color: #64748b;
    font-size: 12px;
}

.audit-report-recommendation-list-overview {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    max-height: 325px;
    overflow: auto;
    padding: 12px 14px;
}

.audit-report-recommendation-overview-item {
    padding: 10px;
    border: 1px solid rgba(187, 247, 208, .95);
    border-radius: 9px;
    background: rgba(255, 255, 255, .78);
    font-size: 12px;
}

.audit-report-category-score-overview .table-responsive {
    position: relative;
    z-index: 1;
}

.audit-report-category-score-table {
    background: rgba(255, 255, 255, .78);
}

.audit-report-category-score-table th,
.audit-report-category-score-table td {
    padding: .55rem .65rem;
    border-color: #e2e8f0 !important;
    vertical-align: middle;
}

.audit-report-category-score-table th {
    background: rgba(248, 250, 252, .92);
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.audit-report-category-score-table tbody tr:hover {
    background: rgba(240, 249, 255, .65);
}

.audit-report-category-score-table td:first-child {
    font-weight: 600;
}

.audit-report-category-dot {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 50%;
    margin-right: 7px;
}

.audit-report-category-table-score {
    min-width: auto;
    font-size: 15px;
}

.audit-report-card-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 5px;
}

.audit-report-card-badges .badge {
    font-size: 10px;
    font-weight: 600;
}

.audit-report-clean-section {
    display: flex;
    align-items: center;
    gap: 7px;
    border: 1px solid #bbf7d0;
    border-radius: 8px;
    background: #f0fdf4;
    color: #047857;
    padding: 10px;
    font-size: 12px;
    font-weight: 600;
}

.audit-report-main-col{
    display: flex;
    flex-wrap: wrap;
}

.audit-report-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    flex: 1;
}

.audit-report-summary-card {
    position: relative;
    flex: 0 0 calc((100% - 2rem) / 3);
    max-width: calc((100% - 2rem) / 3);
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 6px 16px rgba(15, 23, 42, .05);
    padding: 16px 14px 14px;
}

.audit-report-summary-card::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    background: linear-gradient(90deg, #84cc16 0%, #38bdf8 100%);
    content: '';
}

.audit-report-summary-card:nth-child(-n+2) {
    flex: 0 0 calc((100% - 1rem) / 2);
    max-width: calc((100% - 1rem) / 2);
}

.audit-report-summary-card strong {
    display: block;
    font-size: 26px;
    line-height: 1;
}

.audit-report-summary-card span {
    display: block;
    margin-top: 7px;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.audit-report-executive-summary {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #fff;
    padding: 15px;
    margin-bottom: 15px;
}

.audit-report-category-tabs .btn {
    white-space: nowrap;
}

.audit-report-section-heading {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 18px 0 10px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.audit-report-ai-scope-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: -2px 0 10px;
    padding: 9px 11px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f8fafc;
    color: #64748b;
    font-size: 11px;
    line-height: 1.5;
}

.audit-report-ai-scope-note i {
    margin-top: 2px;
    color: #0ea5e9;
}


.audit-report-section-heading:after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

.audit-report-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.audit-report-card {
    border-left-width: 4px;
    border-radius: 6px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,.07),0 4px 6px -2px rgba(0,0,0,.05);
}

.audit-report-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    border-bottom: 1px solid #e5e7eb;
}

.audit-report-card-accordion-toggle {
    cursor: pointer;
    user-select: none;
}

.audit-report-card-accordion-toggle:focus {
    outline: none;
}

.audit-report-card.is-collapsed .audit-report-card-header {
    border-bottom-color: transparent;
}

.audit-report-card.is-collapsed .audit-report-card-body {
    display: none;
}

.audit-report-card-toggle-icon {
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #4f4f4f;
    font-size: 12px;
    transition: transform .2s ease;
}

.audit-report-card.is-open .audit-report-card-toggle-icon {
    transform: rotate(180deg);
}

.audit-report-card-title {
    flex: 1;
    min-width: 0;
}

.audit-report-card-title strong {
    display: block;
    font-size: 15px;
}

.audit-report-card-title small {
    display: block;
    color: #4f4f4f;
    margin-top: 2px;
}

.audit-report-score {
    min-width: 44px;
    text-align: center;
    font-weight: 700;
    font-size: 20px;
    margin-right: 6px;
}

.audit-report-score-success { color: #22c55e; }
.audit-report-score-warning { color: #f59e0b; }
.audit-report-score-danger { color: #ef4444; }
.audit-report-score-info { color: #0ea5e9; }
.audit-report-score-bar {
    height: 6px;
    border-radius: 20px;
    background: #e5e7eb;
    margin-top: 7px;
    overflow: hidden;
}

.audit-report-score-bar span {
    display: block;
    height: 100%;
    border-radius: 20px;
}

.audit-report-score-bar-success { background: #22c55e; }
.audit-report-score-bar-warning { background: #f59e0b; }
.audit-report-score-bar-danger { background: #ef4444; }
.audit-report-score-bar-info { background: #0ea5e9; }
.audit-report-card-body {
    padding: 14px;
}

.audit-working-label {
    color: #dc3545;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 8px;
}

.audit-report-description {
    font-size: 13px;
    margin-bottom: 12px;
}

.audit-report-details {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 6px 14px;
    margin-bottom: 12px;
}

.audit-report-detail {
    font-size: 12px;
}

.audit-report-detail span {
    color: #4f4f4f;
}

.audit-report-detail strong {
    font-weight: 600;
}

.audit-report-subtitle {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 12px 0 6px;
}

.audit-report-problem,
.audit-report-recommendation {
    border-radius: 8px;
    padding: 10px;
    margin-bottom: 7px;
    font-size: 12px;
}

.audit-report-problem {
    background: #fff5f5;
    border: 1px solid #ffd1d1;
    word-break: break-all;
}

.audit-report-recommendation {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    word-break: break-all;
}

.audit-report-badge {
    display: inline-block;
    border-radius: 20px;
    padding: 2px 7px;
    font-size: 10px;
    font-weight: 700;
    margin-right: 5px;
}

.audit-report-badge-critical { background: #dc3545; color: #fff; }
.audit-report-badge-important { background: #f59e0b; color: #111827; }
.audit-report-badge-optional { background: #e5e7eb; color: #374151; }

.audit-report-empty {
    text-align: center;
    color: #4f4f4f;
}

.audit-report-filter-button {
    cursor: pointer;
}

.audit-report-filter-button .badge {
    background-color: #fff;
    color: #000;
    border-radius: 6px;
    padding: 2px 8px;
}

/**/

.audit-list-score {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px;
    border-radius: 1000px;
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
}

.audit-list-score-success {
    color: #166534;
    background: #dcfce7;
}

.audit-list-score-warning {
    color: #92400e;
    background: #fef3c7;
}

.audit-list-score-danger {
    color: #991b1b;
    background: #fee2e2;
}

.audit-list-problems-cell .badge {
    min-width: 28px;
    font-size: 12px;
}

.audit-list-report-cell .badge {
    font-size: 11px;
}

/****/

.heatmap-click-stage {
    width: 100%;
    min-height: 800px;
    overflow: hidden;
    background: #fff;
    text-align: center;
    position: relative;
    box-sizing: border-box;
}

.heatmap-click-stage.heatmap-scroll-report-active {
    padding-left: 44px;
}

.heatmap-click-stage.heatmap-scroll-report-active .heatmap-device-session-counts {
    left: 56px;
}

.heatmap-scroll-wrap {
    position: relative;
    display: block;
    width: 100%;
    max-height: 800px;
    overflow-x: hidden;
    overflow-y: auto;
}

.heatmap-scroll-wrap.heatmap-scroll-wrap-type-loading {
    overflow-y: hidden !important;
}

.heatmap-click-image-wrap {
    position: relative;
    display: inline-block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    text-align: center;
    vertical-align: top;
}

.heatmap-click-image-wrap img {
    display: block;
    max-width: 100%;
    height: auto;
}

.heatmap-click-image-wrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    border: 0;
    background: #fff;
    pointer-events: none;
    transform-origin: top left;
    overflow: hidden;
}

.heatmap-click-image-wrap-snapshot {
    overflow: hidden;
    background: #fff;
    max-width: 100%;
    width: 100%; 
}

.heatmap-click-image-wrap canvas {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    pointer-events: none;
}

.heatmap-click-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background: rgba(0, 0, 0, 0.3);
    pointer-events: none;
}

.heatmap-device-session-counts {
    position: absolute;
    left: 12px;
    bottom: 12px;
    z-index: 999;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px;
    background: rgba(255, 255, 255, 0.94);
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}

.heatmap-device-session-count {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 4px 7px;
    color: #212529;
    font-size: 13px;
    line-height: 1;
    border-radius: 4px;
    background: #fff;
}

.heatmap-device-session-count strong {
    font-size: 14px;
}

.heatmap-device-session-count {
    border: 0;
    cursor: pointer;
}

.heatmap-device-session-count.active {
    color: #fff !important;
    background-color: #6c757d !important;
}

.heatmap-click-empty {
    position: absolute;
    top: 16px;
    left: 16px;
    right: 16px;
    padding: 12px;
    color: #777;
    background: rgba(255, 255, 255, 0.85);
    border: 1px dashed #ccc;
    border-radius: 4px;
}

#tab-report {
    position: relative;
}

.heatmap-report-refresh-loading {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1100;
    min-height: 800px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #777;
    cursor: wait;
}

.heatmap-report-refresh-loading.d-none {
    display: none;
}

.heatmap-click-loading {
    position: relative;
    height: 800px;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #777;
    background: #f1f3f4;
    width: 100%;
}

.heatmap-click-loading.d-none {
    display: none;
}

#heatmap-report-view-loading {
    margin-bottom: 0;
}

.heatmap-report-summary-card {
    padding: 6px 12px;
    background: #fff;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e5e5e5;
}

.heatmap-report-summary-row > .heatmap-report-summary-card:last-child {
    border:none;
}

.heatmap-report-summary-card span {
    display: block;
    font-size: 14px;
    color: #000;
}

.heatmap-report-summary-card strong {
    display: block;
    font-size: 16px;
}

.heatmap-top-element-label {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#button-reset-heatmap-project{
    display:none;
}
 
 
/**Responsive******************************/

@media (max-width: 1650px) {}

@media (max-width: 1480px) {}

@media (max-width: 1350px) {}

@media (max-width: 1199px) {
    .common-dashboard h2.float-right{
        font-size:25px;
    }
    
    /**/
    
    .pagination-cont{
        padding: .5rem;
    }

    .pagination-cont .text-right{
        order: 1;
        text-align: center!Important;
    }
    
    .pagination-cont .text-left{
        order:2;
    }
    
    .pagination-cont .pagination{
        align-items: center;
        justify-content: center;
        margin-top: .5rem;
    }
    
    .pagination-cont .page-link{
        margin: .25rem;
    }
    
    .main-cont-results-page-top,
    .secondary-cont-results-page-top{
        flex-direction:column;
    }
    
    .main-cont-results-page-top > .btn-group{
        width:100%;
    }
    
    .inner-search-cont-results-page-top{
        width:100%;
    }
    
    .secondary-inner-cont-results-page-top-totals{
        width:100%;
        margin-bottom:1.5rem;
    }
    
    .secondary-inner-cont-results-page-top-downloads{
        width:100%;
    }
}

@media (max-width: 992px) {
    .common-dashboard h2.float-right {
        font-size:42px;
    }
    
    .container-fluid {
        padding-left: .75rem;
        padding-right: .75rem;
    }
    
    .page-header > .container-fluid{
        display: flex;
        flex-direction: column-reverse;
        align-items: flex-start;
        justify-content: center;
        gap: 16px
    }
    
    .page-header h1,
    .page-header-h1-cont{
        flex:0 0 100%;
    }
    
    .page-header .float-right{
        justify-content: flex-start;
        width: 100%;
        flex:0 0 100%;
    }
    
    .page-header .float-right .btn,
    .page-header .float-right .btn-group{
        width: calc(50% - 6px);
    }
    
    /****/
    
    .form-group > .col-sm-2,
    .form-group > .col-sm-10{
        flex: 0 0 100%;
    }

    .col-form-label {
        text-align: left;
    }
    
    /**/

    .form-group.row + .form-group.row {
        padding-top: .5rem;
    }
    
    
    .dropdown .dropdown-menu{
        width:100%;
        max-width: 100%;
        overflow: auto;
    }

    .dropdown .dropdown-menu .dropdown-item{
        white-space: normal;
    }

}

@media (min-width: 768px) {
    #column-left:not(.cd-sidebar) {
        left: 0px;
        width: 44px;
    }
    
    #column-left:not(.cd-sidebar):not(.column-left-open-desktop) {
        overflow-x: hidden;
    }
    
    .column-left-active-desktop #column-left:not(.cd-sidebar),
    #column-left:not(.cd-sidebar):hover{
        width: 235px;
    }
    
    #column-left:not(.cd-sidebar) #menu > li > ul:not(.collapsing){
        height:0px;
        overflow:hidden;
    }

    #column-left:not(.cd-sidebar) #menu li a.parent:after {
        opacity:0;
        transition: opacity .2s ease-in;
    }

    .column-left-active-desktop #column-left:not(.cd-sidebar) #menu ul li a.parent:after,
    #column-left:not(.cd-sidebar):hover #menu li a.parent:after {
        opacity:1;
    }

    .column-left-active-desktop #column-left:not(.cd-sidebar) #menu > li > ul:not(.collapsing),
    #column-left:not(.cd-sidebar):hover #menu > li > ul:not(.collapsing){
        height:auto;
    }

    #column-left:not(.cd-sidebar) + #content, #column-left:not(.cd-sidebar) + #content + #footer {
        left: 0px;
        margin-left: 44px;
    }

    #column-left:not(.cd-sidebar).active + #content, #column-left:not(.cd-sidebar).active + #content + #footer {
        left: 0px;
        margin-left: 44px;
    }
    
    .column-left-active-desktop #column-left:not(.cd-sidebar) + #content, #column-left:not(.cd-sidebar) + #content + #footer {
        margin-left: 235px;
    }

    .column-left-active-desktop #column-left:not(.cd-sidebar).active + #content, #column-left:not(.cd-sidebar).active + #content + #footer {
        margin-left: 235px;
    }


}
@media (max-width: 768px) {
    
    ::-webkit-scrollbar {
        width: 5px;
        height: 5px;
    }
    
    #header .navbar-brand{
        width:auto;    
    }
    
    #header #user-profile {
        max-width: none;
    }
    
    .header-profile-item:after{
        display:none;
    }
    
    #header .navbar-nav > li > a {
        line-height: 60px;
    }
    
    .form-control{
        font-size: 1rem!important;
        line-height: 1.8;
    }
    
    .form-control::placeholder{
        font-size: 0.8125rem!important;
    }
    
    #pqe-list-form button#filter,
    #pqe-list-form button#clear-filter{
        font-size: 1rem!important;
    }
    
    .btn,
    .btn-primary,
    .btn-secondary,
    .btn-success,
    .btn-danger,
    .btn-info,
    .btn-warning,
    button {
        min-width:40px;
        min-height:40px;
    }
    
    /****/
    
    .main-cont-results-page-top > .btn-group {
        width: 100%;
        flex-direction: column;
        gap: 6px;
    }
    
    .inner-search-cont-results-page-top{
        width: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    
    .inner-search-cont-results-page-top > div{
        width:100%;
    }
    
    .day-month-results-picker-seo-cont{
        width:100%;
        margin-bottom:6px;
        min-width: 290px;
    }
    
    .day-month-results-picker-seo-cont > .me-3{
        margin-right:0!Important;
    }
    
    .secondary-inner-cont-results-page-top-totals > .badge{
        width:100%;
    }
    
    .secondary-inner-cont-results-page-top-downloads{
        width:100%;
        flex-direction: column;
        gap: 6px;
    }
    
    .main-cont-search-in-keywords-seo-cont{
        width: 100%;
        min-width: 0px;
    }  
    
    #tab-location-input{
        margin-right:0!Important;
    }
    
    .audit-report-grid,
    .audit-report-priority-grid {
        grid-template-columns: 1fr;
    }
    
}
@media (max-width: 576px) {
    .page-header .float-right .btn,
    .page-header .float-right .btn-group{
        width: 100%;
    }
    
    .container-fluid {
        padding-left: .5rem;
        padding-right: .5rem;
    }

    .alert{
        padding: .5rem; 
    }

    .card-header{
        padding: .5rem;
    }

    .card-body {
        padding-left: .5rem;
        padding-right: .5rem;
    }
    
    .input-group {
        flex-wrap: nowrap;
    }
    
    .table-responsive .table thead > tr > td,
    .table-responsive .table thead > tr > th{
        min-width:120px;
    }
    
    .table-responsive .table  th, 
    .table-responsive .table  td {
        padding: .35rem;
    }
    
    .pagination-cont .row{
        margin-left:0;
        margin-right:0;
    }
    
    .pagination-cont .row > div{
        padding:0;
    }
    
    
    .audit-report-top-card {
        align-items: flex-start;
    }
}

@media (max-width: 575px) {
    .audit-report-top-card {
        flex-direction: column;
    }

    .audit-report-screenshot-grid {
        grid-template-columns: 1fr;
    }

    .audit-report-score-circle {
        margin: 0 auto;
    }
}

@media (max-width: 480px) {
    #column-left:not(.cd-sidebar) {
        width: 100vw;
        left: -100vw;
        height:100dvh;
    }
    
    #column-left:not(.cd-sidebar).active + #content, #column-left:not(.cd-sidebar).active + #content + #footer {
        left: 100vw;
    }
    
    body.column-left-active{
        height: 100dvh;
        overflow-y: hidden;
    }

    

}

@media (max-width: 363px) {
    #header.navbar-expand .navbar-nav .dropdown-menu {
        max-width: 100%;
        position: fixed;
        top: 69px;
        left: 0;
        right: 0;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        max-height: 50vh;
        overflow: hidden;
        overflow-y: scroll;
    }
    
    #header.navbar-expand .navbar-nav .dropdown-menu::-webkit-scrollbar {
        width:5px;
    }
    
}









.audit-rich-block {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #f9fafb;
    padding: 10px;
    margin-bottom: 12px;
}

.audit-rich-block-title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #374151;
    margin-bottom: 8px;
}

.audit-rich-check-grid,
.audit-rich-metric-grid,
.audit-rich-mini-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 7px;
}

.audit-rich-check-item,
.audit-rich-metric-card,
.audit-rich-mini-grid > div {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    padding: 8px;
    min-width: 0;
}

.audit-rich-check-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.audit-rich-check-item strong,
.audit-rich-metric-card span,
.audit-rich-mini-grid span {
    display: block;
    font-size: 11px;
    color: #4f4f4f;
    line-height: 1.25;
}

.audit-rich-check-item span,
.audit-rich-mini-grid strong {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    color: #111827;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.audit-rich-check-item i {
    flex-shrink: 0;
}

.audit-rich-check-success {
    border-color: #bbf7d0;
    background: #f0fdf4;
    color: #16a34a;
}

.audit-rich-check-warning {
    border-color: #fde68a;
    background: #fffbeb;
    color: #d97706;
}

.audit-rich-check-danger {
    border-color: #fecaca;
    background: #fff5f5;
    color: #dc2626;
}

.audit-rich-mini-note {
    border-radius: 8px;
    background: #fff;
    border: 1px dashed #d1d5db;
    padding: 8px;
    margin-top: 8px;
    font-size: 12px;
    color: #4b5563;
}

.audit-rich-serp-preview {
    border: 1px solid #dfe1e5;
    border-radius: 10px;
    background: #fff;
    padding: 12px;
    box-shadow: 0 1px 2px rgba(0,0,0,.04);
}

.audit-rich-serp-domain {
    color: #202124;
    font-size: 12px;
    font-weight: 600;
}

.audit-rich-serp-url {
    color: #5f6368;
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.audit-rich-serp-title {
    color: #1a0dab;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.25;
    margin-top: 5px;
}

.audit-rich-serp-description {
    color: #4d5156;
    font-size: 12px;
    line-height: 1.4;
    margin-top: 3px;
}

.audit-rich-check-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 6px;
}

.audit-rich-check-line {
    display: flex;
    align-items: center;
    gap: 7px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    padding: 7px 8px;
    font-size: 12px;
    min-width: 0;
}

.audit-rich-check-line span {
    flex: 1;
    color: #374151;
    min-width: 0;
}

.audit-rich-check-line strong {
    color: #111827;
    font-size: 11px;
    text-align: right;
    overflow-wrap: anywhere;
}

.audit-rich-heading-status-list {
    display: grid;
    gap: 6px;
}

.audit-rich-heading-status-row {
    display: grid;
    grid-template-columns: 34px 36px 92px 1fr;
    align-items: center;
    gap: 8px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    padding: 7px 8px;
    font-size: 11px;
}

.audit-rich-heading-status-row span,
.audit-rich-heading-status-row strong {
    font-weight: 800;
    color: #111827;
}

.audit-rich-heading-status-row em {
    font-style: normal;
    font-weight: 700;
}

.audit-rich-heading-status-row small {
    color: #6b7280;
    overflow-wrap: anywhere;
}

.audit-rich-heading-status-success {
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.audit-rich-heading-status-success em {
    color: #15803d;
}

.audit-rich-heading-status-warning {
    border-color: #fde68a;
    background: #fffbeb;
}

.audit-rich-heading-status-warning em {
    color: #b45309;
}

.audit-rich-heading-status-danger {
    border-color: #fecaca;
    background: #fef2f2;
}

.audit-rich-heading-status-danger em {
    color: #b91c1c;
}

.audit-rich-heading-status-muted em {
    color: #6b7280;
}

.audit-rich-small-list {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    max-height: 180px;
    overflow: auto;
    margin-top: 8px;
}

.audit-rich-small-list div {
    display: flex;
    gap: 8px;
    border-bottom: 1px solid #f1f5f9;
    padding: 6px 8px;
    font-size: 11px;
    color: #374151;
}

.audit-rich-small-list div:last-child {
    border-bottom: 0;
}

.audit-rich-small-list span {
    flex-shrink: 0;
    max-width: 45px;
    font-weight: 800;
    color: #3b82f6;
}

.audit-rich-metric-card strong {
    display: block;
    margin-top: 4px;
    font-size: 17px;
    color: #111827;
}

.audit-rich-metric-success {
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.audit-rich-metric-warning {
    border-color: #fde68a;
    background: #fffbeb;
}

.audit-rich-metric-danger {
    border-color: #fecaca;
    background: #fff5f5;
}

.audit-rich-metric-info,
.audit-rich-metric-muted {
    border-color: #dbeafe;
    background: #eff6ff;
}

.audit-rich-table-wrap {
    border-radius: 8px;
    overflow: hidden;
}

.audit-rich-table {
    background: #fff;
    font-size: 12px;
}

.audit-rich-table th {
    background: #f3f4f6;
    color: #4b5563;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.audit-rich-table td,
.audit-rich-table th {
    vertical-align: middle;
}

.audit-rich-row-success td {
    background: #f0fdf4;
}

.audit-rich-row-warning td,
.audit-rich-row-important td,
.audit-rich-row-open td {
    background: #fffbeb;
}

.audit-rich-row-danger td,
.audit-rich-row-critical td {
    background: #fff5f5;
}

.audit-rich-url-cell {
    max-width: 260px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.audit-rich-lighthouse-list {
    display: grid;
    gap: 7px;
}

.audit-rich-lighthouse-item {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    padding: 8px;
}

.audit-rich-lighthouse-item strong {
    display: block;
    font-size: 12px;
    color: #111827;
    line-height: 1.35;
}

.audit-rich-lighthouse-item div {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 5px;
}

.audit-rich-lighthouse-item span,
.audit-rich-lighthouse-item em {
    display: inline-flex;
    align-items: center;
    border-radius: 20px;
    background: #f3f4f6;
    color: #4b5563;
    font-size: 11px;
    font-style: normal;
    padding: 2px 7px;
}

.audit-rich-lighthouse-item .audit-rich-lighthouse-status-success {
    background: #f0fdf4;
    color: #15803d;
}

.audit-rich-lighthouse-item .audit-rich-lighthouse-status-warning {
    background: #fffbeb;
    color: #b45309;
}

.audit-rich-lighthouse-item .audit-rich-lighthouse-status-danger {
    background: #fef2f2;
    color: #b91c1c;
}

.audit-rich-lighthouse-description {
    display: block;
    margin-top: 6px;
    color: #6b7280;
    font-size: 11px;
    line-height: 1.35;
}

@media (max-width: 575px) {
    .audit-rich-check-grid,
    .audit-rich-metric-grid,
    .audit-rich-mini-grid,
    .audit-rich-check-list {
        grid-template-columns: 1fr;
    }
}

.audit-rich-external-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid #dbeafe;
    border-radius: 9px;
    background: #eff6ff;
    padding: 9px 10px;
}

.audit-rich-external-card span {
    display: block;
    font-size: 11px;
    color: #6b7280;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.audit-rich-external-card strong {
    display: block;
    color: #111827;
    font-size: 14px;
    margin-top: 2px;
}

.audit-rich-external-card small {
    color: #4b5563;
    font-size: 11px;
    text-align: right;
}

.audit-rich-metric-card small {
    display: block;
    margin-top: 3px;
    font-size: 11px;
    color: #6b7280;
}

.audit-rich-reputation .audit-rich-check-item span {
    word-break: break-word;
}

@media (max-width: 575px) {
    .audit-rich-external-card {
        align-items: flex-start;
        flex-direction: column;
    }

    .audit-rich-external-card small {
        text-align: left;
    }
}

.heatmap-device-type-buttons .btn,
.heatmap-report-type-buttons .btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-color: #e9ecef;
}

.heatmap-device-type-buttons .btn.active,
.heatmap-report-type-buttons .btn.active {
    color: #fff !important;
    background-color: #6c757d !important;
    border-color: #6c757d !important;
}

.heatmap-report-type-buttons .btn:disabled {
    color: #9aa0a6;
    background: #f8f9fa;
    border-color: #e9ecef;
    cursor: not-allowed;
    opacity: 0.72;
}

.heatmap-screenshot-nav-group{
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.heatmap-report-type-buttons {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
}

.heatmap-report-view-left-controls {
    gap: 12px;
    min-width: 0;
}

.heatmap-report-view-mode-dropdown {
    flex: 0 0 auto;
}

.heatmap-report-view-mode-button {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 132px;
    height: 31px;
    color: #111827;
    background: #fff;
    border: 1px solid #bdbdbd;
}

.heatmap-report-view-mode-button .heatmap-report-view-mode-chevron {
    margin-left: auto;
    color: #6b7280;
    font-size: 10px;
}

.heatmap-report-view-mode-menu {
    min-width: 160px;
    padding: 4px;
    border-color: #dfe3e8;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
}

.heatmap-report-view-mode-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    color: #111827;
    font-size: 13px;
    border-radius: 5px;
}

.heatmap-report-view-mode-option.active,
.heatmap-report-view-mode-option:hover {
    background: #f3f4f6;
}

.heatmap-report-view-mode-select {
    width: auto;
    min-width: 132px;
    height: 31px;
}

.heatmap-report-table-top-bar {
    align-items: flex-start !important;
}

.heatmap-elements-table-view {
    width: 100%;
    min-height: 800px;
    padding: 0;
    text-align: left;
}

.heatmap-elements-table-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}

.heatmap-elements-table-metrics.d-none {
    display: none !important;
}

.heatmap-elements-table-metric {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: 100%;
    padding: 6px 10px;
    color: #111827;
    font-size: 13px;
    line-height: 1.2;
    background: #f3f4f6;
    border: 1px solid #dfe3e8;
    border-radius: 8px;
}

.heatmap-elements-table-metric-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    font-size: 16px;
    padding: 0;
    color: #4b5563;
    background: transparent;
    border: 0;
    line-height: 1;
    cursor: pointer;
}

.heatmap-table-actions {
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    min-width: 150px;
    justify-content: flex-end;
}

.heatmap-table-add-metric-button {
    height: 31px;
    color: #111827;
    border-color: #d0d7de;
    background: #fff;
}

.heatmap-table-metric-dropdown-menu {
    width: 258px;
    max-height: 394px;
    padding: 6px 0;
    overflow-y: auto;
    border-color: #d0d7de;
    border-radius: 4px;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
}

.heatmap-table-metric-option {
    padding: 8px 12px;
    color: #111827;
    font-size: 13px;
    line-height: 1.2;
    white-space: normal;
}

.heatmap-table-metric-option.active {
    color: #6b7280;
    background: #f3f4f6;
}

.heatmap-table-metric-option:hover {
    color: #111827;
    background: #f3f4f6;
}

.heatmap-elements-table-wrap {
    max-height: 800px;
    overflow: auto;
    border: 1px solid #dfe3e8;
    border-radius: 6px;
}

.heatmap-elements-table {
    background: #fff;
}

.heatmap-elements-table tbody td {
    padding: 11px 8px;
    color: #111827;
    font-size: 13px;
    vertical-align: middle;
}

.heatmap-report-stage-column {
    position: relative;
}

.heatmap-report-stage-column.heatmap-report-view-loading-active #heatmap-report-view-loading.heatmap-report-view-loading-overlay {
    position: absolute;
    top: 52px;
    left: 12px;
    right: 12px;
    width: auto;
    height: 800px;
    max-height: 800px;
    z-index: 120;
    border-radius: 6px;
}

.heatmap-report-table-view-active > .heatmap-report-stage-column {
    flex: 0 0 74%;
    max-width: 74%;
}

.heatmap-report-table-view-active > #heatmap-report-sidebar-column {
    flex: 0 0 26%;
    max-width: 26%;
}

.heatmap-screenshot-dropdown {
    width: auto;
}

.heatmap-screenshot-dropdown-toggle {
    min-width: 42px;
    text-align: center;
}

.heatmap-screenshot-dropdown-menu {
    width: 480px;
    max-width: 90vw;
    max-height: 420px;
    overflow-y: auto;
    padding: 8px;
}

.button-request-heatmap-screenshot{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border-radius: 6px;
    font-weight: 600;
    color: #084154!Important;
    margin-bottom: 8px;
}

.button-request-heatmap-screenshot i{
    position: relative;
    flex: 0 0 82px;
    width: 82px;
    height: 56px;
    overflow: hidden;
    border-radius: 4px;
    background: #d0f0fb;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.heatmap-screenshot-dropdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border-radius: 6px;
    margin-bottom:8px;
}

#dropdown-report-heatmap-page-screenshot > .heatmap-screenshot-dropdown-item:last-child {
    margin-bottom: 0px;
}

.heatmap-screenshot-dropdown-item:hover,
.heatmap-screenshot-dropdown-item.active {
    background: #f1f3ff;
}

.heatmap-screenshot-dropdown-item.report-selected {
    background: #eef8f1;
}

.heatmap-report-include-checkbox {
    flex: 0 0 82px;
    width: 82px;
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 0;
    color: #495057;
    cursor: pointer;
    font-size: 11px;
    line-height: 1.2;
}

.heatmap-report-include-checkbox input {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin: 0;
    cursor: pointer;
}

.heatmap-screenshot-dropdown-preview {
    position: relative;
    flex: 0 0 82px;
    width: 82px;
    height: 56px;
    overflow: hidden;
    border-radius: 4px;
    background: #f8f9fa;
    border: 1px solid #edf0f2;
    text-align:center;
    display:flex;
    align-items: center;
    justify-content: center;
}

.heatmap-screenshot-dropdown-preview img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.heatmap-screenshot-dropdown-preview-loader {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 5;
    display: none;
    align-items: center;
    justify-content: center;
    color: #6c757d;
    background: rgba(248, 249, 250, 0.92);
    pointer-events: none;
}

.heatmap-screenshot-dropdown-preview-is-loading > .heatmap-screenshot-dropdown-preview-loader {
    display: flex;
}

.heatmap-screenshot-dropdown-preview-loader i {
    font-size: 16px;
}

.heatmap-screenshot-dropdown-preview-frame-outer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #f8f9fa;
}

.heatmap-screenshot-dropdown-preview-frame-inner {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    max-width: none;
    max-height: none;
    transform-origin: center center;
}

.heatmap-screenshot-dropdown-preview-frame-iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    pointer-events: none;
}

.heatmap-screenshot-dropdown-preview-empty {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #adb5bd;
}

.heatmap-screenshot-dropdown-preview-empty:empty:before {
    content: "\f03e";
    font-family: "Font Awesome 6 Free";
    font-weight: 400;
}

.heatmap-screenshot-dropdown-main {
    flex: 1;
    min-width: 0;
    padding: 4px 6px;
    color: #212529;
    background: transparent;
    border: 0;
    text-align: left;
}

.heatmap-screenshot-dropdown-main span,
.heatmap-screenshot-dropdown-main small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.heatmap-screenshot-dropdown-main small {
    margin-top: 3px;
    color: #757575;
    font-size: 13px;
    font-style: normal;
}

.heatmap-screenshot-dropdown-url i {
    font-size: 16px;
    text-align: left;
    margin-right: 6px;
}

#heatmap-right-buttons{
    width: 440px;
    max-width: 100%;
}

#heatmap-click-stage-top-bar {
    gap: 10px;
}

@media (max-width: 767px) {
    #heatmap-click-stage-top-bar {
        align-items: flex-start !important;
        flex-direction: column;
    }
}






.heatmap-report-sidebar-card {
    position: relative;
    min-height: 100%;
    padding: 10px;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
}

.heatmap-report-sidebar-header {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 8px;
}

#button-heatmap-report-sidebar-toggle {
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
    padding: 0;
    border-color: #d8e6ec;
    border-radius: 9px;
    color: #277fa9;
}

#button-heatmap-report-sidebar-toggle i {
    margin: 0;
    line-height: 1;
}

.heatmap-report-sidebar-panel {
    width: 100%;
}

.heatmap-report-menu-button {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 44px;
    margin-bottom: 8px;
    padding: 10px 12px;
    color: #212529;
    background: #f8f9fa;
    border: 1px solid #edf0f2;
    border-radius: 6px;
    text-align: left;
    cursor: pointer;
}

.heatmap-report-menu-button:hover,
.heatmap-report-menu-button:focus {
    color: #084154;
    background: #eee;
    border-color: #eee;
}

.heatmap-report-menu-button > i {
    width: 32px;
    height: 32px;
    display: inline-flex;
    flex: 0 0 32px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(39, 170, 225, 0.16);
    border-radius: 9px;
    color: #277fa9;
    background: rgba(39, 170, 225, 0.08);
    text-align: center;
}

.heatmap-report-menu-button-active > i,
.heatmap-report-menu-button-primary > i {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.14);
}

.heatmap-report-menu-button-primary {
    color: #fff;
    background: #27aae1;
    border-color: #27aae1;
}

.heatmap-report-menu-button-primary:hover,
.heatmap-report-menu-button-primary:focus {
    color: #fff;
    background: #1f9bd0;
    border-color: #1f9bd0;
}

.heatmap-report-sidebar-back-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.heatmap-report-menu-collapsed > .heatmap-report-stage-column {
    flex: 0 0 calc(100% - 74px);
    max-width: calc(100% - 74px);
}

.heatmap-report-menu-collapsed > #heatmap-report-sidebar-column {
    flex: 0 0 74px;
    max-width: 74px;
}

#heatmap-report-sidebar-column.heatmap-report-sidebar-collapsed .heatmap-report-sidebar-card {
    padding: 8px;
}

#heatmap-report-sidebar-column.heatmap-report-sidebar-collapsed .heatmap-report-menu-button {
    justify-content: center;
    padding: 10px 8px;
}

#heatmap-report-sidebar-column.heatmap-report-sidebar-collapsed .heatmap-report-menu-button span,
#heatmap-report-sidebar-column.heatmap-report-sidebar-collapsed .heatmap-report-sidebar-back-row strong {
    display: none;
}


.heatmap-click-sections-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
    pointer-events: none;
}

.heatmap-click-section-zone {
    position: absolute;
    box-shadow: inset 0 0 0 0 rgba(255, 255, 255, 0);
    pointer-events: auto;
    cursor: default;
}

.heatmap-click-section-zone:hover {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.96), 0 0 0 1px rgba(0, 0, 0, 0.08);
}

.heatmap-click-section-tooltip {
    position: absolute;
    left: 50%;
    top: 12px;
    min-width: 196px;
    padding: 12px 14px 10px 14px;
    color: #172033;
    text-align: left;
    background: #fff;
    border: 1px solid rgba(122, 132, 156, 0.42);
    border-radius: 6px;
    box-shadow: 0 10px 30px rgba(18, 24, 40, 0.16);
    transform: translateX(-50%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.12s ease, visibility 0.12s ease;
}

.heatmap-click-section-tooltip strong {
    display: block;
    margin-bottom: 10px;
    color: #172033;
    font-size: 13px;
    line-height: 1.2;
}

.heatmap-click-section-tooltip span {
    display: block;
    color: #5f6b85;
    font-size: 12px;
    line-height: 1.2;
}

.heatmap-click-section-zone:hover .heatmap-click-section-tooltip {
    opacity: 1;
    visibility: visible;
}

.heatmap-top-clicks-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
    pointer-events: none;
}

.heatmap-top-click-marker {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin-left: -14px;
    margin-top: -14px;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.26);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28);
    pointer-events: auto;
    cursor: default;
}

.heatmap-top-click-marker-1 {
    width: 32px;
    height: 32px;
    margin-left: -16px;
    margin-top: -16px;
    font-size: 15px;
}

.heatmap-report-menu-item-wrap {
    margin-bottom: 8px;
}

.heatmap-report-menu-item-wrap .heatmap-report-menu-button {
    margin-bottom: 2px;
}

.heatmap-report-menu-button-active,
.heatmap-report-menu-button-active:hover,
.heatmap-report-menu-button-active:focus {
    color: #084154;
    background: #d0f0fb;
    border-color: #27aae1;
}

.heatmap-report-menu-button-disabled,
.heatmap-report-menu-button-disabled:hover,
.heatmap-report-menu-button-disabled:focus,
.heatmap-report-menu-button:disabled {
    color: #9aa0a6;
    background: #f8f9fa;
    border-color: #edf0f2;
    cursor: not-allowed;
    opacity: 0.72;
}

.heatmap-report-menu-button-disabled i,
.heatmap-report-menu-button:disabled i {
    color: #9aa0a6;
}

.heatmap-report-menu-button-loading,
.heatmap-report-menu-button-loading:hover,
.heatmap-report-menu-button-loading:focus,
.heatmap-report-menu-button-primary.heatmap-report-menu-button-loading:disabled {
    color: #ffffff;
    background: #1f9bd0;
    border-color: #1f9bd0;
    cursor: wait;
    opacity: 0.9;
}

.heatmap-report-menu-button-loading i,
.heatmap-report-menu-button-primary.heatmap-report-menu-button-loading:disabled i {
    color: #ffffff;
}



.heatmap-report-menu-info-link {
    display: inline-block;
    padding: 0;
    color: #27aae1;
    background: transparent;
    border: 0;
    font-size: 12px;
    line-height: 1.3;
    cursor: pointer;
}

.heatmap-report-menu-info-link:hover,
.heatmap-report-menu-info-link:focus {
    color: #1f9bd0;
    text-decoration: underline;
    outline: none;
}

.heatmap-report-info-section-title {
    margin-top: 18px;
    margin-bottom: 8px;
    font-weight: 700;
}

.heatmap-report-info-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.heatmap-report-info-list li {
    position: relative;
    margin-bottom: 10px;
    padding-left: 22px;
}

.heatmap-report-info-list li:before {
    content: '\2713';
    position: absolute;
    top: 0;
    left: 0;
    color: #212529;
}

#heatmap-report-sidebar-column.heatmap-report-sidebar-collapsed .heatmap-report-menu-info-link {
    display: none;
}


.heatmap-engagement-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
    pointer-events: none;
}

.heatmap-engagement-cell {
    position: absolute;
    display: block;
    pointer-events: auto;
    cursor: default;
}

.heatmap-engagement-cell-tooltip {
    position: absolute;
    left: 50%;
    bottom: 100%;
    display: none;
    align-items: center;
    gap: 7px;
    width: max-content;
    max-width: 240px;
    padding: 8px 13px;
    color: #4b5563;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    white-space: nowrap;
    background: #fff;
    border: 1px solid rgba(216, 222, 232, 0.92);
    border-radius: 20px;
    box-shadow: 0 8px 22px rgba(18, 24, 40, 0.14);
    transform: translate(-50%, -8px);
    pointer-events: none;
}

.heatmap-engagement-cell:hover .heatmap-engagement-cell-tooltip {
    display: flex;
}
.heatmap-engagement-cell:hover {
    z-index: 2000;
}

.heatmap-engagement-cell-tooltip {
    z-index: 2001;
}

.heatmap-click-stage.heatmap-report-type-click .heatmap-click-sections-overlay,
.heatmap-click-stage.heatmap-report-type-scroll .heatmap-scroll-depth-overlay,
.heatmap-click-stage.heatmap-report-type-attention .heatmap-attention-overlay {
    z-index: 20;
}

.heatmap-click-stage.heatmap-report-type-scroll .heatmap-scroll-depth-scale,
.heatmap-click-stage.heatmap-report-type-attention .heatmap-attention-depth-scale {
    z-index: 21;
}

.heatmap-click-stage.heatmap-report-type-scroll .heatmap-scroll-average-fold {
    z-index: 22;
}

.heatmap-click-stage.heatmap-report-type-scroll .heatmap-scroll-hover-line,
.heatmap-click-stage.heatmap-report-type-attention .heatmap-attention-hover-line {
    z-index: 23;
}

.heatmap-click-stage.heatmap-report-type-attention .heatmap-attention-hover-card {
    z-index: 24;
}

.heatmap-click-stage.heatmap-engagement-report-active .heatmap-engagement-overlay {
    z-index: 60;
}

.heatmap-click-stage.heatmap-engagement-report-active .heatmap-click-sections-overlay,
.heatmap-click-stage.heatmap-engagement-report-active .heatmap-top-clicks-overlay,
.heatmap-click-stage.heatmap-engagement-report-active .heatmap-rage-clicks-overlay,
.heatmap-click-stage.heatmap-engagement-report-active .heatmap-scroll-depth-overlay,
.heatmap-click-stage.heatmap-engagement-report-active .heatmap-attention-overlay,
.heatmap-click-stage.heatmap-engagement-report-active .heatmap-scroll-depth-scale,
.heatmap-click-stage.heatmap-engagement-report-active .heatmap-attention-depth-scale {
    pointer-events: none !important;
}

.heatmap-click-stage.heatmap-engagement-report-active .heatmap-click-section-tooltip,
.heatmap-click-stage.heatmap-engagement-report-active .heatmap-scroll-hover-line,
.heatmap-click-stage.heatmap-engagement-report-active .heatmap-attention-hover-line {
    display: none !important;
}

.heatmap-click-stage.heatmap-engagement-report-active .heatmap-engagement-cell {
    pointer-events: auto;
}


.heatmap-engagement-cell-tooltip-dot {
    display: block;
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    background: #f05a42;
    border-radius: 50%;
}

.heatmap-engagement-cell-level-very-high .heatmap-engagement-cell-tooltip-dot {
    background: #d83a2e;
}

.heatmap-engagement-cell-level-high .heatmap-engagement-cell-tooltip-dot {
    background: #f05a42;
}

.heatmap-engagement-cell-level-moderate .heatmap-engagement-cell-tooltip-dot {
    background: #f59f00;
}

.heatmap-engagement-cell-level-low .heatmap-engagement-cell-tooltip-dot,
.heatmap-engagement-cell-level-very-low .heatmap-engagement-cell-tooltip-dot {
    background: #27aae1;
}

.heatmap-rage-clicks-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 6;
    pointer-events: none;
}

.heatmap-rage-click-marker {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(237, 55, 45, 0.26);
    border: 2px solid rgba(237, 55, 45, 0.92);
    border-radius: 50%;
    box-shadow: 0 0 0 5px rgba(237, 55, 45, 0.16), 0 2px 10px rgba(0, 0, 0, 0.22);
    pointer-events: auto;
    cursor: default;
}

.heatmap-rage-click-marker span {
    display: block;
    width: 42%;
    height: 42%;
    background: rgba(237, 55, 45, 0.94);
    border-radius: 50%;
}

.heatmap-rage-click-marker:after {
    content: '';
    position: absolute;
    top: -7px;
    right: -7px;
    bottom: -7px;
    left: -7px;
    border: 1px solid rgba(237, 55, 45, 0.38);
    border-radius: 50%;
}

.heatmap-report-info-rage-clicks-icon {
    position: relative;
    width: 150px;
    height: 112px;
}

.heatmap-report-info-rage-clicks-arrow {
    position: absolute;
    left: 50%;
    bottom: 18px;
    width: 34px;
    height: 58px;
    margin-left: -17px;
    background: #060851;
    border-radius: 4px 4px 0 0;
}

.heatmap-report-info-rage-clicks-arrow:before {
    content: '';
    position: absolute;
    left: 50%;
    top: -48px;
    width: 0;
    height: 0;
    margin-left: -34px;
    border-right: 34px solid transparent;
    border-bottom: 56px solid #060851;
    border-left: 34px solid transparent;
}

.heatmap-report-info-rage-clicks-shake {
    position: absolute;
    top: 14px;
    width: 44px;
    height: 52px;
    background: repeating-linear-gradient(160deg, transparent 0 8px, #060851 8px 11px, transparent 11px 20px);
}

.heatmap-report-info-rage-clicks-shake-left {
    left: 0;
    transform: rotate(-16deg);
}

.heatmap-report-info-rage-clicks-shake-right {
    right: 0;
    transform: scaleX(-1) rotate(-16deg);
}

.heatmap-device-type-buttons .btn.bg-secondary,
.heatmap-report-type-buttons .btn.bg-secondary,
.heatmap-device-session-count.bg-secondary {
    color: #fff !important;
    background-color: rgba(45, 188, 187, 1)!important;
    border-color: rgba(45, 188, 187, 1)!important;
}




.heatmap-scroll-depth-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
    pointer-events: auto;
}

.heatmap-scroll-hover-line {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 6;
    height: 1px;
    background: rgba(0, 0, 0, 0.48);
    pointer-events: none;
}

.heatmap-scroll-hover-line span {
    position: absolute;
    top: -12px;
    left: 50%;
    padding: 4px 8px;
    color: #fff;
    background: rgba(52, 58, 64, 0.88);
    border-radius: 2px;
    font-size: 12px;
    line-height: 1.2;
    white-space: nowrap;
    transform: translateX(-50%);
}

.heatmap-scroll-average-fold {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 5;
    height: 2px;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: 1px 1px 4px 1px rgba(0, 0, 0, 0.25);
    pointer-events: none;
}

.heatmap-scroll-average-fold span {
    position: absolute;
    top: -13px;
    left: 0;
    padding: 2px 6px;
    color: #212529;
    background: rgba(255, 255, 255, 0.94);
    border-radius: 2px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

.heatmap-scroll-depth-scale {
    position: absolute;
    left: 12px;
    z-index: 7;
    width: 14px;
    min-height: 80px;
    border: 2px solid #fff;
    border-radius: 9px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.24);
    pointer-events: auto;
    cursor: pointer;
    user-select: none;
}

.heatmap-scroll-depth-scale-thumb {
    position: absolute;
    top: 0;
    left: -5px;
    right: -5px;
    min-height: 42px;
    background: rgba(255, 255, 255, 0.18);
    border: 2px solid #6c757d;
    border-radius: 6px;
    cursor: grab;
}

.heatmap-scroll-depth-scale-dragging,
.heatmap-scroll-depth-scale-dragging .heatmap-scroll-depth-scale-thumb {
    cursor: grabbing;
}

.heatmap-device-type-buttons .btn.active,
.heatmap-report-type-buttons .btn.active,
.heatmap-device-type-buttons .btn.bg-secondary,
.heatmap-report-type-buttons .btn.bg-secondary,
.heatmap-device-session-count.active,
.heatmap-device-session-count.bg-secondary {
    color: #fff !important;
    background-color: rgba(45, 188, 187, 1)!important;
    border-color:rgba(45, 188, 187, 1)!important;
}

.heatmap-attention-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
    pointer-events: auto;
}

.heatmap-attention-hover-line {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 8;
    height: 1px;
    background: rgba(0, 0, 0, 0.32);
    pointer-events: none;
}

.heatmap-attention-hover-card {
    position: absolute;
    top: -44px;
    left: 6px;
    width: 188px;
    padding: 12px 14px;
    color: #212529;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);
    text-align: left;
}

.heatmap-attention-hover-level {
    display: inline-block;
    margin-bottom: 12px;
    padding: 6px 8px;
    border-radius: 5px;
    font-size: 12px;
    line-height: 1.2;
}

.heatmap-attention-hover-level-high {
    color: #c82333;
    background: rgba(255, 229, 225, 0.94);
}

.heatmap-attention-hover-level-medium {
    color: #9a6a00;
    background: rgba(255, 243, 205, 0.94);
}

.heatmap-attention-hover-level-low {
    color: #157347;
    background: rgba(209, 231, 221, 0.94);
}

.heatmap-attention-hover-time {
    display: block;
    margin-bottom: 2px;
    color: #212529;
    font-size: 18px;
    line-height: 1.1;
}

.heatmap-attention-hover-card small {
    display: block;
    color: #212529;
    font-size: 12px;
    line-height: 1.2;
}

.heatmap-attention-depth-scale {
    position: absolute;
    left: 12px;
    z-index: 7;
    width: 14px;
    min-height: 80px;
    border: 2px solid #fff;
    border-radius: 9px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.24);
    pointer-events: auto;
    cursor: pointer;
    user-select: none;
}

@media (max-width: 991px) {
    .heatmap-report-table-view-active > .heatmap-report-stage-column,
    .heatmap-report-table-view-active > #heatmap-report-sidebar-column {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .heatmap-elements-table-view {
        padding-right: 0;
    }
}


/* Heatmap report updates */
#heatmap-click-stage {
    position: relative;
}

.heatmap-scroll-wrap {
    transition: opacity 0.18s ease;
}

.heatmap-click-image-wrap {
    transition: transform 0.18s ease, margin-bottom 0.18s ease;
    will-change: transform;
}

.heatmap-report-stage-column,
#heatmap-report-sidebar-column {
    transition: flex-basis 0.28s ease, max-width 0.28s ease, width 0.28s ease;
}

.heatmap-report-view-loading-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: auto;
    min-height: 280px;
    background: rgba(241, 243, 244, 0.86);
    z-index: 1005;
}

.heatmap-report-stage-column.heatmap-report-view-loading-active {
    position: relative;
}

.heatmap-zoom-controls {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease;
    
    background: rgba(255, 255, 255, 0.94);
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}

.heatmap-click-stage:hover .heatmap-zoom-controls,
.heatmap-zoom-controls:hover {
    opacity: 1;
    pointer-events: auto;
}

.heatmap-zoom-button {
    width: 36px;
    height: 36px;
    padding: 0;
    color: #212529;
    background: #fff;
    border: 0;
    border-bottom: 1px solid #e5e5e5;
    cursor: pointer;
}

.heatmap-zoom-button:last-child {
    border-bottom: 0;
}

.heatmap-zoom-button:hover,
.heatmap-zoom-button:focus {
    background: #eee;
    outline: none;
}

.heatmap-zoom-button:disabled {
    color: #ddd;
    cursor: not-allowed;
}

.heatmap-report-visible-type-card {
    margin-bottom: 12px;
    padding: 12px;
    background: #f8f9fa;
    border: 1px solid #edf0f2;
    border-radius: 8px;
}

.heatmap-report-visible-type-title {
    margin-bottom: 4px;
    font-size: 18px;
    font-weight: 700;
    color: #111827;
}

.heatmap-report-visible-type-subtitle {
    color: #6b7280;
    font-size: 13px;
    line-height: 1.45;
}

.heatmap-report-visible-type-info-link {
    margin-left: 4px;
    padding: 0;
    line-height: 1.2;
}

#heatmap-report-sidebar-column.heatmap-report-sidebar-collapsed .heatmap-report-visible-type-card {
    display: none;
}

.heatmap-report-summary-card-label {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
}

.heatmap-report-summary-info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #4f4f4f;
    background: transparent;
    border: 0;
    cursor: help;
    font-size: 14px;
}

.heatmap-report-summary-info:hover,
.heatmap-report-summary-info:focus {
    color: #2dbcbb;
    outline: none;
}


@media (max-width: 767px) {
    .heatmap-zoom-controls {
        right: 8px;
        bottom: 8px;
    }

    .heatmap-zoom-button {
        width: 32px;
        height: 32px;
    }
}

.heatmap-page-config-row > td {
    background: #f1f3f4;
}

.heatmap-page-report-screenshots-row > td {
    background: #fff;
    padding: 14px;
    border-top: 0;
}

.heatmap-page-report-screenshots-title {
    margin-bottom: 8px;
    font-weight: 600;
    color: #344054;
}

.heatmap-page-report-screenshots-list {
    display: flex;
    gap: 8px;
    min-width: 0;
    overflow-x: auto;
    padding-bottom: 4px;
    flex-flow: column;
}

.heatmap-page-report-screenshots-list > .text-muted {
    padding: 8px 0;
}

.heatmap-page-report-screenshot-option {
    display: flex;
    width:100%;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 6px 8px;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
}

.heatmap-page-report-screenshot-option:hover {
    background: #f1f3ff;
}

.heatmap-page-report-screenshot-option input {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin: 0;
}

.heatmap-page-report-screenshot-details {
    flex: 1 1 auto;
    min-width: 0;
    align-self: flex-start;
    font-size:14px;
}

.heatmap-page-report-screenshot-url {
    display: block;
    overflow: hidden;
    color: #1f2937;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 6px;
}

.heatmap-page-report-screenshot-url i {
    margin-right: 6px;
}

.heatmap-page-report-screenshot-option small {
    display: block;
    overflow: hidden;
    color: #667085;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 991px) {
}

@media (max-width: 767px) {
    .heatmap-page-report-screenshot-option {
        flex-basis: 320px;
    }
}

.heatmap-page-details-grid-td{
    padding: 0px!Important;
}

.heatmap-page-details-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0;
    align-items: start;
}

.heatmap-page-match-column,
.heatmap-page-report-screenshots {
    min-width: 0;
}

.heatmap-page-match-column {
    padding:14px;
    padding-right: 24px;
}

.heatmap-page-report-screenshots {
    padding:14px;
    padding-left: 24px;
    border-left: 1px solid #e2e8f0;
    min-height:100%;
}

@media (max-width: 991px) {
    .heatmap-page-details-grid {
        grid-template-columns: 1fr;
    }

    .heatmap-page-match-column {
        padding-right: 0;
    }

    .heatmap-page-report-screenshots {
        margin-top: 16px;
        padding-top: 16px;
        padding-left: 0;
        border-top: 1px solid #e2e8f0;
        border-left: 0;
    }
}



.audit-ai-signal-list { display: grid; gap: 12px; }
.audit-ai-signal { border: 1px solid #e2e8f0; border-left-width: 4px; border-radius: 9px; background: #ffffff; overflow: hidden; }
.audit-ai-signal-pass { border-left-color: #22c55e; }
.audit-ai-signal-warn { border-left-color: #f59e0b; }
.audit-ai-signal-fail { border-left-color: #ef4444; }
.audit-ai-signal-header { display: flex; justify-content: space-between; gap: 15px; padding: 13px 15px; background: #f8fafc; }
.audit-ai-signal-header > div:first-child { min-width: 0; }
.audit-ai-signal-header strong { display: block; color: #1e293b; }
.audit-ai-signal-header span { display: block; color: #64748b; font-size: 12px; margin-top: 3px; word-break: break-word; }
.audit-ai-signal-status { min-width: 105px; text-align: right; }
.audit-ai-signal-status span { font-size: 11px; text-transform: uppercase; font-weight: 700; }
.audit-ai-signal-status strong { font-size: 13px; margin-top: 2px; }
.audit-ai-signal-pass .audit-ai-signal-status span { color: #15803d; }
.audit-ai-signal-warn .audit-ai-signal-status span { color: #b45309; }
.audit-ai-signal-fail .audit-ai-signal-status span { color: #b91c1c; }
.audit-ai-signal-content { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
.audit-ai-signal-content-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.audit-ai-signal-content > div { padding: 13px 15px; border-right: 1px solid #e2e8f0; }
.audit-ai-signal-content > div:last-child { border-right: 0; }
.audit-ai-signal-content small { display: block; margin-bottom: 5px; color: #64748b; font-size: 10px; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; }
.audit-ai-signal-content p { margin: 0; color: #334155; font-size: 12px; line-height: 1.5; }

@media (max-width: 767px) {
    .audit-ai-signal-header { flex-direction: column; }
    .audit-ai-signal-status { min-width: 0; text-align: left; }
    .audit-ai-signal-content { grid-template-columns: 1fr; }
    .audit-ai-signal-content > div { border-right: 0; border-bottom: 1px solid #e2e8f0; }
    .audit-ai-signal-content > div:last-child { border-bottom: 0; }
}

/****/

.offer-document-header,
.contract-document-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 62px;
}
.offer-document-heading,
.contract-document-heading {
    min-width: 0;
}
.offer-document-title,
.contract-document-title {
    color: #212529;
    font-size: 15px;
    font-weight: 600;
}
.offer-document-subtitle,
.contract-document-subtitle {
    margin-top: 3px;
    color: #6c757d;
    font-size: 12px;
}
.offer-document-format,
.contract-document-format {
    margin-right: 2px;
}
.document-editor-card-body {
    padding: 0;
    overflow: hidden;
    background: #e9edf2;
}
.document-fields-card-body {
    overflow-y: auto;
}
.document-fields-help {
    font-size: 11px;
    line-height: 1.35;
}
.document-fields-accordion {
    border: 0;
    border-radius: 0;
    overflow: visible;
}
.document-fields-accordion-item + .document-fields-accordion-item {
    border-top: 0;
}
.document-fields-accordion-toggle {
    display: flex;
    width: 100%;
    min-height: 44px;
    margin-bottom: 8px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    color: #212529;
    background: #f8f9fa;
    border: 1px solid #edf0f2;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
}
.document-fields-accordion-toggle:hover,
.document-fields-accordion-toggle:focus {
    color: #084154;
    background: #eee;
    border-color: #eee;
    outline: 0;
}
.document-fields-accordion-toggle[aria-expanded="true"],
.document-fields-accordion-toggle[aria-expanded="true"]:hover,
.document-fields-accordion-toggle[aria-expanded="true"]:focus {
    color: #084154;
    background: #eee;
    border-color: #eee;
}
.document-fields-accordion-toggle i {
    flex: 0 0 20px;
    width: 20px;
    color: inherit;
    text-align: center;
}
.document-fields-accordion-chevron {
    font-size: 10px;
    transition: transform .2s ease;
}
.document-fields-accordion-toggle[aria-expanded="true"] .document-fields-accordion-chevron {
    transform: rotate(180deg);
}
.document-fields-accordion-body {
    margin: -2px 0 8px 0;
    padding: 12px 0;
    border: 0;
    border-radius: 0;
    background: #fff;
}
.document-fields-field-control {
    margin-bottom: 12px;
}
.document-fields-field-control:last-child {
    margin-bottom: 0;
}
.document-fields-field-control > label {
    display: block;
    margin-bottom: 4px;
    color: #5c6570;
    font-size: 11px;
    font-weight: 600;
}
.document-fields-field-control .form-control,
.document-fields-custom-field-input-group .form-control {
    height: calc(1.4em + 1.077rem + 2px);
    padding: .375rem .75rem;
    font-size: 0.8125rem;
    line-height: 2.1;
    color: #4f4f4f;
    font-weight: 400;
}
.document-fields-field-control select.form-control,
.document-fields-field-control .custom-select {
    height: auto;
}
.document-fields-field-control .input-group-append .btn,
.document-fields-field-tag-button {
    min-width: 34px;
    line-height:2;
    padding-left: 1rem;
    padding-right: 1rem;
}
.document-fields-field-tag-button {
    margin-left: 6px;
}
.document-fields-client-type-toggle .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
}
.document-fields-custom-fields-help {
    margin-bottom: 10px;
    font-size: 10px;
    line-height: 1.35;
}
.document-fields-custom-field-row {
    margin-bottom: 10px;
    padding: 10px;
    border: 1px solid #e1e7ee;
    border-radius: 8px;
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 2px 7px rgba(31, 45, 61, 0.04);
}
.document-fields-custom-field-label {
    display: block;
    max-width: 100%;
    margin-bottom: 5px;
    overflow: hidden;
    color: #475569;
    font-size: 11px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.document-fields-custom-field-input-group .btn {
    min-width: 36px;
}
.document-fields-custom-field-modal-token {
    font-family: monospace;
    text-transform: uppercase;
}
.document-fields-custom-field-settings-modal .modal-content {
    overflow: hidden;
    border: 0;
    border-radius: 12px;
    box-shadow: 0 18px 48px rgba(15, 23, 42, .2);
}
.document-fields-custom-field-settings-modal .modal-header {
    border-bottom-color: #e7ecf2;
    background: linear-gradient(135deg, #f8fafc 0%, #eef4ff 100%);
}
.document-fields-custom-field-settings-modal .modal-title i {
    color: #2563eb;
}
body.document-editor-fullscreen-active {
    overflow: hidden;
}
body.document-editor-fullscreen-active #header,
body.document-editor-fullscreen-active #column-left,
body.document-editor-fullscreen-active #footer {
    display: none !important;
}
body.document-editor-fullscreen-active #content {
    margin-left: 0 !important;
    padding: 0 !important;
}
#tab-general.document-editor-fullscreen {
    position: fixed;
    inset: 0;
    z-index: 20000;
    display: block !important;
    padding: 0;
    overflow-x: hidden;
    overflow-y: auto;
    background: #f1f3f4;
}

#tab-general.document-editor-fullscreen > .row {
    margin-top:0!Important;
    height:100%;
    overflow:hidden;
}

/****/

p:has(> br) {
    height: auto!Important;
}

.document-editor-fullscreen .document-editor-toolbar{
    margin-top: 16px;
}

.document-editor-fullscreen .document-fields-sidebar-column{
    padding-right: 24px;
}






.heatmap-screenshot-drag-handle {
    flex: 0 0 22px;
    width: 22px;
    min-width: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    color: #98a2b3;
    cursor: grab;
    user-select: none;
}

.heatmap-screenshot-drag-handle:active {
    cursor: grabbing;
}

.heatmap-screenshot-sort-placeholder {
    display: block;
    width: 100%;
    min-height: 64px;
    margin-bottom: 8px;
    border: 1px dashed #27aae1;
    border-radius: 6px;
    background: #eefaff;
    visibility: visible !important;
}

/* Offer statuses */
.badge-offer-approved {
    color: #fff;
    background-color: #6f42c1;
}


/** AJAX document list search **/
.document-list-ajax-results {
    position: relative;
    min-height: 120px;
}

.document-list-ajax-results.document-list-loading {
    min-height: 220px;
    pointer-events: none;
}

.document-list-freeze-overlay {
    position: absolute;
    z-index: 50;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 220px;
    background: rgba(255, 255, 255, 0.92);
    cursor: wait;
}

.document-list-freeze-overlay .spinner-border {
    width: 2.5rem;
    height: 2.5rem;
}


.send-email-modal-dialog {
    height: calc(100vh - 2rem);
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.send-email-modal-content {
    display: flex;
    flex-direction: column;
    max-height: 100%;
    height: 100%;
    overflow: hidden;
}

.send-email-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    max-height: 100%;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.send-email-modal-tags {
    margin-top: 1rem;
}

.send-email-recipient-error {
    display: block;
    font-size: 13px;
    line-height: 1.4;
}

.send-email-recipient-error[hidden] {
    display: none !important;
}

.send-email-modal-content .modal-footer {
    flex: 0 0 auto;
}

.send-email-copy-recipient {
    flex: 0 0 auto;
}

/* Mobile navigation: avoid cross-document snapshot compositing and shell fades. */
@media (max-width: 767.98px) {
    #content,
    #header,
    #column-left {
        view-transition-name: none !important;
    }

    body,
    #content,
    #header,
    #column-left {
        transition: none !important;
    }

    ::view-transition-group(root),
    ::view-transition-image-pair(root),
    ::view-transition-old(root),
    ::view-transition-new(root),
    ::view-transition-group(crm-content),
    ::view-transition-old(crm-content),
    ::view-transition-new(crm-content),
    ::view-transition-group(crm-header),
    ::view-transition-new(crm-header),
    ::view-transition-old(crm-header),
    ::view-transition-group(crm-sidebar),
    ::view-transition-new(crm-sidebar),
    ::view-transition-old(crm-sidebar) {
        animation: none !important;
    }
}


/* Shared public-link transcript page. */
.chat-transcript-public-page::before,
.chat-transcript-public-page::after {
    display: none !important;
}
.chat-transcript-public-page .client-update-wrapper {
    padding: 24px 12px;
}
.chat-transcript-public-page .client-update-logo-cont {
    max-width: 600px;
    margin-bottom: 18px;
}
.chat-transcript-public-page .client-update-logo-cont img {
    max-width: min(280px, 82vw);
    max-height: 90px;
    width: auto;
    height: auto;
    margin: 0 auto;
}
@media (max-width: 767.98px) {
    .chat-transcript-public-card > div:last-child > div {
        padding: 20px 16px !important;
    }
}