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

:root{ 
    --mdb-body-font-size: 0.8125rem;   
}

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;
}

.table>thead {
    background-color: #f8f9fa;
}

.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:auto;
}

.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 {
    min-height: 100%;
    width: 100%;
    position: relative;
    background: #f1f3f4;
    overflow: hidden;
}

.bg-main{
    background: #f1f3f4;
}

.container-fluid {
    padding-left: var(--mdb-gutter-x, 1.25rem);
    padding-right: var(--mdb-gutter-x, 1.25rem);
}

#header {
    min-height: 0px;
    z-index: 1000;
    margin: 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: var(--mdb-gray-dark);
    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;
}

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

#button-menu {
    font-size: 24px;
    padding: 4px 12px;
    cursor: pointer;
    color: #27aae1;
}

#button-desktop-menu{
    font-size: 24px;
    padding: 4px 12px;
    cursor: pointer;
    color: #27aae1;
}

#column-left {
    width: 235px;
    height: 100%;
    overflow: auto;
    background-color: #fff;
    position: absolute;
    top: 0px;
    left: -235px;
    padding-top: 68px;
    z-index:2;
}

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

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

#column-left, #content, #footer {
    transition: all 0.3s;
}

#column-left + #content, #column-left + #content + #footer {
    position: relative;
    left: 0px;
}

#column-left.active {
    left: 0px;
}

#column-left.active + #content, #column-left.active + #content + #footer {
    left: 235px;
}

#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 */
#menu, #menu ul, #menu li {
    padding: 0;
    margin: 0;
    list-style: none;
}

#menu {
    margin-bottom: 25px;
}

#menu li a {
    text-decoration: none;
    display: block;
    padding: 12px;
    cursor: pointer;
    border-bottom: 0px solid #515151;
    font-size: 14px;
}

#menu li a.parent:after {
    font-family: 'Font Awesome 5 Free';
    font-weight: 600;
    position:absolute;
    right: 12px;
}

#menu li a.parent:after {
    content: "\f107";
}

#menu li a.collapsed:after {
    content: "\f105";
}

/* 1st lvl */
#menu > li {
    position: relative;
    border-bottom: 1px solid #dee2e6;
}

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

#menu > li > a:hover {
    background-color: rgba(0,0,0,0.075);
}

#menu > li > a > i {
    font-size: 18px;
    width: 20px;
    margin-right: 12px;
    padding-right: 12px;
    color: #27aae1;
    position: relative;
    top: 1px;
}

#menu > li.active > a {
    color: #fff;
    background-color: #27aae1;
}

#menu > li.active > a i{
    color: #fff;
}

#menu > li > ul {
    background-color: #f2f2f2;
}

/* 2nd lvl */
#menu li li a {
    color: #212529;
}

#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;
}

#menu li li a:hover:before {
    margin-right: 20px;
}

#menu li li a:hover {
    background-color: rgba(0,0,0,0.075);
}

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


#menu li li a i {
    font-size: 18px;
    width: 20px;
    margin-right: 9px;
    color: #2dbcbb;
    position: relative;
    top: 1px;
}

#menu li ul a {
    padding-left: 20px;
}

#menu li li ul a {
    padding-left: 40px;
}

#menu li li li ul a {
    padding-left: 60px;
}

#menu li li li li ul a {
    padding-left: 80px;
}

/* footer */
#footer {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

#footer a{
    color:#545454!Important;
    text-decoration: none!Important;
}

/**/

#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 li.nav-item a{
    white-space: nowrap;
    background: var(--light);
    border-radius: .25rem ! Important;
    padding: 12px 24px 10px;
    color: var(--mdb-gray-800);
    letter-spacing: .2px;
}

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

.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: 13px;
    width: 16px \0;
    height: 13px;
    height: 16px \0;
    -webkit-appearance: none;
    background: white;
    border: 1px solid #dcdcdc;
    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: 15px;
    width: 18px \0;
    height: 15px;
    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: .25rem;
    margin-top: -4px!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!Important;
}

.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{
    width: 200px;
    height: 200px;
    padding: 5px;
    overflow: hidden; 
    display: flex;
    justify-content: center;
    align-items: center;
}

.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;
    top: 0;
    right: 0;
    z-index: 1035;
    padding: 0;
    height: 100dvh;
}

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

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

#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;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff9;
    z-index: 10000;
    display: none;
    align-items: center;
    justify-content: center;
    flex-flow: column;
}

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

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

/* Keep Bootstrap modals above their backdrop and above page overlays. */
.main-spinner-text{
    margin-top:10px;
    font-size:18px;
    font-weight:600;
}

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;
}

.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: all 1s;
}

.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: var(--mdb-gray-800);
    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: var(--mdb-gray-800);
    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: var(--mdb-font-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;
}

.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-spinner.active{
    display:flex;
}

#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-logo-cont{
    margin-bottom: 35px;
    text-align: center;
}

.client-update-logo {
    max-width:80px;
}

.client-update-wrapper {
    padding: 35px 15px 70px;
    height: 100vh;
    overflow-y: scroll;
    width: 100%;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: start;
}

.client-update-card {
    width: 100%;
    max-width: 980px;
    background: #fff;
    border: 1px solid #dfe3e8;
    border-radius: 6px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, .06);
}

.client-update-card-header {
    padding: 18px 22px;
    border-bottom: 1px solid #dfe3e8;
}

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

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

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

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

.client-update-card .btn-group-toggle .btn{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/**/

.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%;
    margin-top: 10px;
}

.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;
}

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

.audit-check-progress .main-report-check-progress {
    height: 8px;
}

.audit-check-progress-sections {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(390px, 1fr));
    gap: 8px;
    overflow: auto;
    text-align: left;
    min-height:77px;
}

.audit-check-progress-section {
    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-detail {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.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-cont-results-page-top{
        
    }
    
    .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: var(--mdb-gutter-x, .75rem);
        padding-right: var(--mdb-gutter-x, .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 {
        left: 0px;
        width: 44px;
    }
    
    #column-left:not(.column-left-open-desktop) {
        overflow-x: hidden;
    }
    
    .column-left-active-desktop #column-left,
    #column-left:hover{
        width: 235px;
    }
    
    #menu > li > ul:not(.collapsing){
        height:0px;
        overflow:hidden;
    }

    #menu li a.parent:after {
        opacity:0;
        transition: all .2s ease-in;
    }

    .column-left-active-desktop #column-left #menu uli a.parent:after,
    #column-left:hover #menu li a.parent:after {
        opacity:1;
    }

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

    #column-left + #content, #column-left + #content + #footer {
        left: 0px;
        margin-left: 44px;
    }

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

    .column-left-active-desktop #column-left.active + #content, #column-left.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: var(--mdb-gutter-x, .5rem);
        padding-right: var(--mdb-gutter-x, .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;
    }
    
    
    .client-update-wrapper{
        padding-left: 6px;
        padding-right: 6px;
    }
    
    .client-update-card-header,
    .client-update-card-body{
        padding-left: 12px;
        padding-right: 12px;
    }

    .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 {
        width: 100vw;
        left: -100vw;
        height:100dvh;
    }
    
    #column-left.active + #content, #column-left.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;
    }
    
    .client-update-card .btn-group-toggle{
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        gap: 6px;
    }
    
    .client-update-card .btn-group-toggle .btn{
        width:100%;
    }
}









.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;
    align-items: center;
}

.heatmap-report-type-buttons {
    flex-wrap: wrap;
}

.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-menu{
    
}

.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,var(--mdb-bg-opacity))!important;
    border-color: rgba(45,188,187,var(--mdb-bg-opacity))!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,var(--mdb-bg-opacity))!important;
    border-color:rgba(45,188,187,var(--mdb-bg-opacity))!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;
    background: #fff;
    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-details-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.heatmap-page-match-column,
.heatmap-page-report-screenshots {
    min-width: 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) {
    .heatmap-page-details-grid {
        grid-template-columns: 1fr;
    }
}

@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;
    }
}

.report-history-table-resp{
    min-height:170px;
}


.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;
}