body{
    font-family: 'Inter', sans-serif;
}

.active svg{
    stroke: #1d4ed8;
    transform: scale(1.2);
}

.domain-data .circle svg{
    margin-top: -40px;
    position: relative;
    top: 50px;
}

.domain-data .circle span{
    padding-top: 55px;
}

#visitsHistoricData,
#keywordsHistoricData,
#rankHistoricData{
    max-height: 177px;
    display: block; 
}

.age-data {
    max-height: 290px;
}


#trendChart{
    width: 100% !important;
}

.data-table th[data-order]{
    cursor: pointer;
    text-decoration: underline;
}

.link{
   color: #0875d2;
   position: relative;
}

.link:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -2px;
    width: 0;
    border-bottom: 1px solid #0875d2;
    transition: width .3s;
}

.link:hover:after {
    width: 100%;
    left: 0;
}



.login a,
.register a{
    color: #0875d2 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px;
}

body .login-google{
    color: #1e293b !important;
    text-decoration: none !important;
}


.flex-3{
    flex: 3;
}
 
.choice-active{
    background-color: #1D5D9B;
    color: #fff;
}

.btn{
    background-color: #1D5D9B !important;
    color: #fff;
    padding: 6px 15px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 6px !important;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
    backface-visibility: hidden;
    transform: translateZ(0); /* Evita el difuminado */
    height: 34px;
}

form .field{
    margin-bottom: 10px;
}

.label{
    display: block;
    font-weight: 500;
    margin-bottom: 5px;
}

.login input[type=text],
.login input[type=password],
.register input[type=text],
.register input[type=password],
.form input[type=text],
.form input[type=password],
.formInput{
    border: 1px solid #e2e8f0;
    border-radius: 0.25rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #1a202c;
    background-color: #f9fcff;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    width: 100%;
}

.form input[type=text]:disabled,
.form input[type=password]:disabled{
    background-color: #efefef;
    color: #2f333a;
}

.countries-submenu div{
    transition: height 0.3s ease-in-out;
}

.pro-btn{
    background-color: #D9E021;
    padding: 12px 20px;
    border: 2px solid black;
    border-radius: 6px;
    box-shadow: 4px 4px 0px 0px #000000;
    font-weight: 500;
}

.menu-sidebar li.active{
    border-color: #1D5D9B;
}

#rankHistoricData .apexcharts-tooltip,
#backlinks-chart .apexcharts-tooltip{
    width: 190px !important;
}

#rankHistoricData .apexcharts-tooltip-y-group .apexcharts-tooltip-text-y-value,
#backlinks-chart .apexcharts-tooltip-y-group .apexcharts-tooltip-text-y-value{
    position: absolute !important;
    right: 10px !important;
}

#rankHistoricData .apexcharts-tooltip-series-group,
#backlinks-chart .apexcharts-tooltip-series-group{
    height: 25px !important;
}

.apexcharts-tooltip-marker{
    width: 9px !important;
    height: 9px !important;
}

.apexcharts-tooltip-y-group{
    padding: 0 !important;
}
.apexcharts-tooltip-series-group.apexcharts-active, .apexcharts-tooltip-series-group:last-child{
    padding-bottom: 0 !important;
}

::-webkit-scrollbar,
::-webkit-scrollbar{
	width: 6px;
    border-radius: 2px;
}

::-webkit-scrollbar-thumb,
::-webkit-scrollbar-thumb{
	background-color: #aaa;
    border-radius: 2px;
}

::-webkit-scrollbar-track,
::-webkit-scrollbar-track{
	background-color: #eee;
}

.menu-tab,
.menu-tab .arrow,
.tab-content{
    transition: all 0.5s ease;
}

.menu-tab .arrow{
    transform: rotate(-90deg);
}

.menu-tab.open .arrow{
    transform: rotate(0deg);
}

.tab-container .tab-content{
    max-height: 0;
    overflow: hidden;
}

.tab-container.open .tab-content{
    max-height: 500px;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.tab-container.open .arrow{
    transform: rotate(0deg);
}

.top-countries-select .selected li{
    padding-left: 5px;
    padding-right: 0;
    list-style: none;
}

.top-countries-select .selected li:hover{
    background-color: #fff;
}

.top-countries-select .selected li a{
    pointer-events: none;
    font-size: 13px;
}

.pagination-container{
    padding-top: 15px;
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: end;
}

.pagination-container button{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 500;
    width: 30px;
    height: 30px;
    border-radius: 6px;
}

.pagination-container button.active{
    border: 1px solid #d4d4d4;
}

.pagination-container button:hover{
    background-color: #F4F4F5;
}

.page-size-select{
    margin-top: 11px;
}

.page-size-select select{
    background: #fff;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid #d4d4d4;
    border-radius: 6px;
    padding: 5px;

}

th[data-order="true"] span,
th[data-order="asc"] span,
th[data-order="desc"] span{
    border-bottom: 1px dashed #979797;
    display: inline-flex;
    align-items: center;
    cursor: help;
}

th[data-order] span[data-order=asc] svg{
    transform: rotate(180deg);
}

.countries-table .others{
    margin-top: 3px;
}

.countries-table .others > tr:first-child{
    padding-top: 3px;
}

.page-size-select{
    min-height: 34px;
}

.percentage-circle {
    position: relative;
    width: 100px;
    height: 100px;
}

.percentage-circle svg {
    width: 100%;
    height: auto;
}

.percentage-circle .circle-bg {
    fill: none;
    stroke: #eee;
    stroke-width: 3.8;
}

.percentage-circle .circle {
    fill: none;
    stroke: #4caf50;
    stroke-width: 2.8;
    transition: stroke-dasharray 0.6s ease;
}

.percentage-circle .percentage-text {
    fill: #333;
    font-family: Arial, sans-serif;
    font-size: 0.5em;
    text-anchor: middle;
    dominant-baseline: middle;
}
.submenu .submenu-item:nth-child(4),
.submenu .submenu-item:nth-child(20){
    position: relative;
}

.submenu .submenu-item:nth-child(4):before,
.submenu .submenu-item:nth-child(20):before{
    content: "";
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #d4dbe5;
}

.submenu .submenu-item img{
    height: auto !important;
}

.custom-range ul li:last-child{
    background-color: transparent !important;
    cursor: default !important;
}

.tr-relative tr{
    position: relative;
    border: none;
}

.tr-relative tbody tr::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #d8d3d3;
}

.small-chart{
    position: relative;
}

.small-chart .apexcharts-grid-borders{
    display: none;
}


.small-chart-container{
    min-height: 40px !important;
    max-height: 40px !important;
    position: relative;
    top: -25px;
    left: -10px;
    /* transform: scale(.95); */
}

.order-active svg{
    transform: rotate(0deg) !important;
}

label.disabled{
    color: #a9a9a9;
}

.btn-export.disabled{
    pointer-events: none;
    cursor: not-allowed;
}

.keyword-sidebar ul li::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #d8d3d3;
}

.card h2,
.tooltip-container{
    cursor: default;
}

.card h2:hover + .tooltip,
.tooltip-container:hover .tooltip{
    display: block;
    font-size: 13px !important;
    line-height: 20px;
    font-weight: 400;
    background-color: #fff;
}

.batch-analysis #dropdown-button-2{
    border-radius: 6px;
    height: 34px;
}

.country-traffic-global{
    padding-bottom: 35px;;
}

.country-traffic-global table tbody tr:nth-last-child(2){
    display: flex;
    position: absolute;
    top: -35px;
}

.country-traffic-global table tbody tr:nth-last-child(2) td:first-child{
    width: 140px;
}

.country-traffic-global table tbody tr:nth-last-child(2) td:nth-child(2){
    width: 61px;
}

.country-traffic-global table tbody tr:nth-last-child(2) td:nth-child(3){
    width: 80px;
}

.country-traffic-global table tbody tr:nth-last-child(2) td:nth-child(4){
    width: 62px;
}


.country-traffic-global table tbody tr:nth-last-child(2)::before{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #d8d3d3;
}

.country-traffic-global table tbody{
    position: relative;
    top: 35px;
    min-height: 232px;
}

.country-traffic-global table .pagination{
    position: relative;
    top: 0;
}

#trendChart{
    position: relative;
    top: -10px;
}

#trendChart{
    min-height: 120px !important;
}

#trendChart,
#trendChart .apexcharts-canvas,
#trendChart .apexcharts-canvas > svg{
    max-height: 120px !important;
}

.keyword-search-form #dropdown-button-2{
    border-radius: 6px;
}

textarea:focus{
    outline: none;
    bottom: #94a3b8;
}

textarea.no-focus:focus{
    border: none;
    outline: none;
}

.tabs .active,
.tabs div:hover:not(.active){
    border-top: 1px solid #cbd5e1;
    border-left: 1px solid #cbd5e1;
    border-right: 1px solid #cbd5e1;
}

.create-list-modal #dropdown-button-3,
.create-list-modal .submenu2,
.create-project-modal #dropdown-button-3,
.add-project-keywords-modal #dropdown-button-4{
    border-radius: 6px;
}

.create-list-modal .submenu2{
    max-height: 300px;
}

.sidebar-container{
    transform: translateX(-100%);
    transition: transform 0.3s ease-in-out;
}

.sidebar-container.open{
    transform: translateX(0);
}

.table-keyword-suggestion table thead tr th:last-child,
.table-keyword-suggestion table thead tr th:nth-last-child(2),
.table-keyword-suggestion table tbody tr td:last-child,
.table-keyword-suggestion table tbody tr td:nth-last-child(2),
.table-keyword-question table thead tr th:last-child,
.table-keyword-question table thead tr th:nth-last-child(2),
.table-keyword-question table tbody tr td:last-child,
.table-keyword-question table tbody tr td:nth-last-child(2),
.table-keyword-ideas table thead tr th:last-child,
.table-keyword-ideas table thead tr th:nth-last-child(2),
.table-keyword-ideas table tbody tr td:last-child,
.table-keyword-ideas table tbody tr td:nth-last-child(2){
    display: none;
}

.posicion-media-chart .apexcharts-xaxis,
.posicion-media-chart .apexcharts-xaxis-tick,
#trendChart .apexcharts-xaxis,
#trendChart .apexcharts-xaxis-tick{
    display: none;
}

.site-explorer #dropdown-button-3{
    background-color: transparent;
    border: none;
}

.gsc-projects-container.hidden{
    width: 0;
    max-width: 0;
}

.gsc-projects-container{
    padding-top: 25px;
    max-width: 450px;
    transition: width 3s ease-in-out;
    max-height: 500px;
    overflow-y: auto;
}

.create-project-modal .loader-container{
    width: 450px;
}


.import-gsc-projects-table{
    width: 100%;
}

.import-gsc-projects-table th{
    text-align: left;
    font-size: 14px;
    font-weight: 500;
}

.import-gsc-projects-table tbody tr{
    border-top: 1px solid #d4d4d4;
}

.import-gsc-projects-table td,
.import-gsc-projects-table th{
    padding: 8px;
}

.proyect-domain-data,
.proyect-rank-tracker-data{
    margin-bottom: -16px;
}

.proyect-domain-data .card,
.proyect-rank-tracker-data .card{
    border: none !important;
    box-shadow: none !important;
}

.proyect-domain-data .card > div:first-child,
.proyect-rank-tracker-data .card > div:first-child{
    padding-top: 18px !important;
}

.btn:hover{
    transform: scale(1.08);
}

.login .btn,
.register .btn{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
}

.tab-button.active{
    background-color: #fff;
}

.tab-rendimiento-gsc .apexcharts-xaxis-tick{
    display: none;
}

.order-tabs .active{
    background-color: #fff;
}

.order-tabs svg{
    stroke: #000 !important;
}

.order-tabs .tabs-btn-container{
    gap: 4px !important;
}

input[name=country-search]:focus-visible{
    outline: none !important;
}

.tracked-keywords .loader{
    width: 25px;
    position: relative;
    left: -5px;
}

.tracked-keywords .loader svg{
    width: 25px;
    height: 25px;
}

.sticky-card-table{
    padding-top: 0;
}

.sticky-card-table > div{
    padding-left: 0;
    padding-right: 0;
}

.sticky-card-table .sticky{
    padding-left: 24px;
    padding-right: 24px;
}

.sticky-card-table table{
    margin: 0;
}

.sticky-card-table thead{
    padding-left: 24px;
    padding-right: 24px;
    background-color: #fff;
}

.sticky-card-table table thead{
    position: sticky;
    top: 70px;
    background-color: #fff;
}

.table-search-form .card{
    border-color: #e2e8f0 !important;
}

.include-active{
    background-color: #e0e7ff;
}

.create-list-card{
    top: 0 !important;
}

.create-list-card h2{
    position: relative;
    top: -16px;
}

#main-form #dropdown-button-2{
    height: 36px;
}

.keyword-search-form #main-form #dropdown-button-2{
    height: 34px;
}

.keyword-explorer .lists-container .tabs-btn-container{
    display: inline-flex;
}


@media screen and (max-width: 768px){
    .tracked-keywords .text-2xl.font-bold{
        overflow-y: scroll;
    }

  

}

@media screen and (min-width: 768px){
    .gsc-projects-container{
        padding-top: 25px;
        width: 450px;
        max-width: 450px;
        transition: width 3s ease-in-out;
        max-height: 500px;
        overflow-y: auto;
    }
}

@media screen and (min-width: 1024px){
    .sidebar-container{
        transform: translateX(0);
    }
}

/* @media screen and (max-width: 1023px){

    main .content{
        display: none;
    }

} */