:root {
    --main-bg-color: #333;
    /*old color #423B35*/
    --boxes-bg-color: #1B1B1B;
    /*old color #222222*/
    --imput-color: #555555/*old color #625954*/
}

.navbar-brand {
    background-color: var(--main-bg-color) !important;
}

body {
    background-color: var(--boxes-bg-color);
    color: #ffffff;
}

.gray-bg,
.bg-muted {
    background-color: var(--boxes-bg-color);
}

.navbar-fixed-top {
    background-color: var(--main-bg-color);
    border-color: var(--main-bg-color) !important;
}

.ibox-content {
    background-color: var(--boxes-bg-color);
    border-color: var(--main-bg-color);
}

.ibox-title {
    background-color: var(--main-bg-color);
    border-color: var(--main-bg-color);
    border-radius: 10px;
}

.ibox-cm {
    background-color: var(--main-bg-color);
    border-color: var(--main-bg-color);
}

.white-bg {
    background-color: var(--boxes-bg-color);
}

.border-bottom {
    border-color: var(--main-bg-color) !important;
}

h1 {
    font-size: 24px;
}

h2 {
    font-size: 20px;
}

.top-navigation .nav>li a,
.top-navigation .navbar-nav .open .dropdown-menu>li a {
    background-color: var(--main-bg-color);
    color: #fff;
}

.top-navigation .nav>li a:hover,
.top-navigation .nav>li a:focus,
.top-navigation .navbar-nav .open .dropdown-menu>li a:hover,
.top-navigation .navbar-nav .open .dropdown-menu>li a:focus {
    background: #201D1A;
    color: #fff;
}

.top-navigation .nav>li.active>a,
.top-navigation .navbar-nav .open .dropdown-menu>li.active a {
    color: #ffffff !important;
}

.footer.fixed {
    background-color: var(--main-bg-color);
    border-color: var(--main-bg-color);
}

.form-control {
    background-color: var(--imput-color);
    color: #ffffff;
    border-radius: 5px;
}

.ui-select-choices-row {
    background-color: var(--imput-color) !important;
    color: #ffffff !important;
}

.ui-select-choices-row-inner,
.ui-select-bootstrap .ui-select-choices-row>span {
    color: #ffffff !important;
}

.ui-select-choices-row:hover {
    background-color: var(--main-bg-color) !important;
    color: var(--imput-color) !important;
}

.input-group-addon-nobg {
    border: 1px solid #E5E6E7;
    border-radius: 1px;
    color: inherit;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    padding: 6px 12px;
    text-align: center;
}

.btn-default,
.btn-default:hover {
    color: #000000;
}

.btn-dark {
    color: #000000;
    background-color: #777;
    border-color: #555;
    border-radius: 4px;
}

.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active,
.btn-dark.active,
.open .dropdown-toggle.btn-dark {
    color: #000000;
    background-color: #777;
    border-color: #444;
}

.btn-dark:hover {
    color: #000000;
    background-color: #888;
    border-color: #444;
}

.btn-round {
    color: #000000;
    background-color: var(--imput-color);
    border-color: #555;
    border-radius: 100%;
}

.btn-round:focus,
.open .dropdown-toggle.btn-round {
    color: #000000;
    background-color: #f25c0b;
    border-color: #444;
}

.btn-round:hover {
    color: #000000;
    background-color: #4a4a4a;
    border-color: #444;
}

.btn-round:active {
    color: #000000;
    background-color: #424242;
    border-color: #444;
}

.panel {
    background-color: transparent;
}

.panel-default>.panel-heading {
    background-color: var(--main-bg-color);
    color: #eeeeee;
}

.panel-default {
    border-color: transparent;
}

.panel {
    background-color: transparent;
}

.list-group.clear-list .list-group-item,
.list-group-item,
.hr-line-solid,
.form-control {
    border-color: #555555;
}

.panel-body {
    border-top-color: #555555 !important;
    border: 1px solid #555555 !important;
}

h2,
h4 {
    color: #00AAAE;
    /*old color #87cefa*/
}

.ibox-title {
    padding: 7px 20px 3px !important;
}

.ibox-cm {
    padding: 7px 15px 3px !important;
    margin: 5px;
}

.ui-select-bootstrap>.ui-select-match>.btn {
    color: #ffffff !important;
}

.form-control:focus {
    border-color: transparent;
}

.footable-odd {
    background-color: #333333 !important;
}

td {
    border-top-color: #555555 !important;
}

td:not(.leo_report) {
    background-color: #212121;
}


th {
    border-bottom-color: #555555 !important;
}

.pagination>li>a,
.pagination>li>span {
    background-color: var(--imput-color) !important;
    border-color: var(--main-bg-color) !important;
}

.pagination>li>a:focus,
.pagination>li>a:hover,
.pagination>li>span:focus,
.pagination>li>span:hover {
    color: #87cefa;
}

.tabs-container .nav-tabs {
    border-bottom: 1px solid #555555;
}

.tabs-container .nav-tabs>li {
    border: none;
    background: none;
}

.tabs-container .nav-tabs>li.active {
    border: none;
    background: none;
}

.tabs-container .nav-tabs>li>a {
    background-color: var(--imput-color);
    border: none;
}

.tabs-container .nav-tabs>li>a:hover {
    background-color: #333;
    border: none;
}

.tabs-container .nav-tabs>li>a:focus {
    background-color: #00AAAE;
    border: none;
}

.tabs-container .nav-tabs>li.active>a {
    background-color: #00AAAE;
    border: none;
}

.tabs-container .nav-tabs>li.active>a:hover {
    background-color: #00AAAE;
    border: none;
}

.tabs-container .nav-tabs>li.active>a:focus {
    background-color: #00AAAE;
    border: none;
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    background-color: #3f3f3f;
    color: #a9a9a9;
    opacity: 1;
}

.c3-tooltip-container {
    display: none !important;
}

.c3-chart-arcs-gauge-unit {
    fill: #ffffff !important;
}

.c3-gauge-value {
    fill: #ffffff !important;
}

.ct-series-a .ct-slice-donut {
    stroke: #ff0000 !important;
}

.ct-series-b .ct-slice-donut {
    stroke: #00ff00 !important;
}

.ct-series-c .ct-slice-donut {
    stroke: #0000ff !important;
}

.ct-label {
    fill: rgba(255, 255, 255, 1) !important;
    color: rgba(255, 255, 255, 1) !important;
    font-size: 1.2rem !important;
    line-height: 1 !important;
}

.mtt-majorGraduationText {
    fill: rgba(255, 255, 255, 1) !important;
    color: rgba(255, 255, 255, 1) !important;
}

.c3-chart-arc text {
    fill: #fff !important;
    color: #fff !important;
}

.c3-chart-arc {
    fill: #fff !important;
    color: #fff !important;
}

.chosen-container-single .chosen-single {
    background-color: var(--imput-color) !important;
    color: #ffffff !important;
    border-color: #777777;
}

.chosen-container .chosen-results {
    background-color: var(--imput-color) !important;
    color: #ffffff !important;
}

.chosen-container-single .chosen-search input[type="text"] {
    background-color: var(--imput-color) !important;
    color: #ffffff !important;
}

.chosen-container-single .chosen-search {
    background-color: var(--imput-color) !important;
    color: #ffffff !important;
}

.chosen-container .chosen-drop {
    background-color: var(--imput-color) !important;
}

.chosen-container .chosen-results li.highlighted {
    background-color: #17699c !important;
}

.chosen-container-active.chosen-with-drop .chosen-single {
    border-color: #17699c !important;
}

.scenario-select-container .chosen-container {
    width: 100% !important;
    max-width: calc(100% - 130px);
  }
  

.top-navigation .navbar-nav .dropdown-menu {
    border: 1px solid #666666 !important;
}

.dropdown-menu>li>a {
    border-radius: 0px !important;
    border: 1px solid #666666 !important;
}

.cropArea {
    overflow: hidden;
    width: 400px;
    height: 300px;
}

#reportlogo {
    max-width: 300px;
}

.sweet-alert.show-input input {
    color: #000000;
}

.modal-content {
    background-color: #333333 !important;
}

.inmodal .modal-body {
    background-color: #333333 !important;
}

.fileinput-filename {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: Calc(100% - 25px);
}

#canvas-rate,
#canvas-rate-fw,
#canvas-rate-rt {
    margin-left: -15px !important;
    margin-bottom: -20px !important;
}

.c3-chart-arcs .c3-chart-arcs-gauge-max,
.c3-chart-arcs .c3-chart-arcs-gauge-min {
    fill: #fff !important;
}

.c3-chart-arcs .c3-chart-arcs-background {
    fill: #777777 !important;
    stroke: none;
}

.keepheight {
    max-height: 263px !important;
}

#div-transmitrate svg {
    max-height: 160px !important;
}

#doughnutEbnoRT,
#doughnutEbnoFW,
#doughnutMarginRT,
#doughnutMarginFW,
#doughnutEbnoFWWorstRT,
#doughnutEbnoRTBestRT,
#doughnutMarginRTBestRT {
    min-height: 105px !important;
    height: 10px !important;
}

.chosen-container-single .chosen-single span {
    font-size: 14px !important;
}

.viewer-toolbar {
    display: block;
    position: absolute;
    top: 20px;
    right: 40px;
    z-index: 20;
}

.dropdown-menu-right>li a,
.dropdown-menu-right>li a:hover,
.dropdown-menu-right>li a:focus {
    /*background: #201D1A;*/
    background-color: rgba(32, 29, 26, .7);
    color: #fff;
}

.switch-layer {
    position: relative;
    top: 2px;
}

.dropdown-menu-right {
    min-width: 280px;
    left: auto !important;
    background-color: transparent !important;
}


/* The switch - the box around the slider */

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}


/* Hide default HTML checkbox */

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}


/* The slider */

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}


/********************************************/

.sliderPrec {
    position: relative;
    top: 10px;
    display: inline;
    -webkit-appearance: none;
    height: 10px;
    border-radius: 5px;
    background: linear-gradient(to right, #008000, #FFFF00, #FF0000);
    outline: none;
    -webkit-transition: .2s;
    transition: opacity .2s;
}

.sliderPrec::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #2b2d2f;
    border: 1px solid grey;
    cursor: pointer;
}


/******************************************************/

.slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked+.slider {
    background-color: #2196F3;
}

input:focus+.slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked+.slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}


/* Rounded sliders */

.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

#colorscaletitle,
#colorscaletitle2 {
    display: block;
    position: absolute;
    top: 20px;
    left: 40px;
    z-index: 20;
}

#colorscale,
#colorscale2 {
    display: block;
    position: absolute;
    top: 45px;
    left: 40px;
    z-index: 20;
}

.colorpicker-sample-min,
.colorpicker-sample-max {
    width: 100px;
    height: 100px;
    float: right;
    background-size: contain;
}

.colorpicker-element .input-group-addon {
    background-color: #969696 !important;
    border: none;
}

.colorpicker-element .input-group-addon i {
    border: 1px solid #000000;
}

h5.charttitle,
h4.charttitle {
    /*max-height: 30px !important; */
    /* fallback */
    min-height: 30px !important;
    /* fallback */
}

h5.charttitle {
    color: #eeeeee !important;
}

h5.charttitlesimple {
    /*max-height: 30px !important; */
    /* fallback */
    min-height: 38px !important;
    /* fallback */
    color: #eeeeee !important;
}

.rategauge {
    min-height: 105px !important;
    display: flex !important;
    align-items: center !important;
}

.disabledtext {
    color: #555555;
}

.sweet-alert button.cancel {
    background-color: #676767 !important;
}

.sweet-alert button.cancel:hover {
    background-color: #333333 !important;
}

.btn-link:hover,
.btn-link:active,
.btn-link.active,
.btn-link:focus {
    color: inherit !important;
}

.btn-default:active,
.btn-default.active,
.btn-default:focus {
    color: #000000 !important;
}

.btn-dod {
    background-color: #807e38;
    color: #ffffff!important;
}

.btn-dod:hover {
    background-color: #a19f57;
    color: #ffffff!important;
}

.btn-dod:active,
.btn-dod.active,
.btn-dod:focus {
    background-color: #a19f57 !important;
    color: #ffffff!important;
}


/*
.sweet-alert button.confirm {
    background-color: #0d82b7 !important;
}

.sweet-alert button.confirm:hover {
    background-color: #075e86 !important;
}
*/

@media (min-width: 768px) {
    .scenarioname {
        padding-top: 7px;
        margin-bottom: 0;
        text-align: left !important;
    }
}

@media (max-width: 2000px) {
    .selectslabels {
        width: 100% !important;
        padding-right: 15px;
        padding-left: 15px;
    }
}

@media (min-width: 1200px) and (max-width: 2000px) {
    #selects {
        width: 100%;
    }
}

@media (min-width: 992px) and (max-width: 1475px) {
    .lb-type-selector-container {
        flex-direction: column;
    }
    .lb-type-selector{
        width: 100% !important;
    }

    .network-area {
        margin-top: 66px !important;
    }
}





@media (min-width: 1200px) {
    .linkdelete {
        padding-right: 5px !important;
        padding-bottom: 0px !important;
    }
    .linksave {
        padding-left: 5px !important;
    }
}

@media (max-width: 1200px) {
    #leodelete {
        padding-left: 30px;
        padding-right: 30px;
        margin-bottom: 10px;
    }
    #leosave {
        padding-left: 30px;
        padding-right: 30px;
        margin-bottom: 0px;
    }
}

@media (min-width: 1201px) {
    #leodelete {
        padding-left: 30px;
        padding-right: 5px;
        margin-bottom: -5px;
    }
    #leosave {
        padding-left: 5px;
        padding-right: 30px;
        margin-bottom: 0px;
    }
}

@media (max-width: 992px) {
    #leocreate {
        margin-bottom: 10px;
    }
    #leoload {
        margin-bottom: -10px !important;
    }
}

@media (min-width: 1200px) {
    #info2 {
        display: none;
    }
}

@media (max-width: 1200px) {
    #info1 {
        display: none;
    }
}

.tour-tour {
    color: #000000 !important;
}

.row>.sk-spinner {
    display: none;
}

.row.sk-loading {
    position: relative;
    z-index: 1000 !important;
}

.row.sk-loading:after {
    content: '';
    background-color: rgba(50, 50, 50, 0.7);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.row.sk-loading>.sk-spinner {
    display: block;
    position: absolute;
    top: 40%;
    left: 0;
    right: 0;
    z-index: 2000;
}


/***** Custom collapse breakpoint ***/


/* @media (max-width: 1712px) { */

.mobile_mode .navbar-header {
    float: none;
}

.mobile_mode .navbar-left,
.mobile_mode .navbar-right {
    float: none !important;
}

.mobile_mode .navbar-toggle {
    display: block;
}

.mobile_mode .navbar-collapse {
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.mobile_mode .navbar-fixed-top {
    top: 0;
    border-width: 0 0 1px;
}

.mobile_mode .navbar-collapse.collapse {
    display: none!important;
}

.mobile_mode .navbar-nav {
    float: none!important;
    margin-top: 7.5px;
}

.mobile_mode .navbar-nav>li {
    float: none;
}

.mobile_mode .navbar-nav>li>a {
    padding-top: 10px;
    padding-bottom: 10px;
}

.mobile_mode .collapse.in {
    display: block !important;
}

.mobile_mode .navbar-nav .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: transparent;
    border: 0;
    box-shadow: none;
}

.mobile_mode .navbar-nav .open .dropdown-menu>li>a,
.mobile_mode .navbar-nav .open .dropdown-menu .dropdown-header {
    padding: 5px 15px 5px 25px;
}

.mobile_mode .navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
    color: #999;
}

.mobile_mode .navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover,
.mobile_mode .navbar-inverse .navbar-nav .open .dropdown-menu>li>a:focus {
    color: #fff;
    background-color: transparent;
    background-image: none;
}


/* }  */


/***** IPAD PRO ********/

@media only screen and (min-width: 1366px) and (max-height: 1024px) and (-webkit-min-device-pixel-ratio: 1.5) {
    .ipadpro-col-3 {
        width: 0%;
    }
    .ipadpro-col-7 {
        width: 80%;
    }
    .ipadpro-col-2 {
        width: 10%;
    }
    .ipadpro-col-4 {
        width: 50%;
    }
    .ipadpro-col-12 {
        width: 100%;
        text-align: left !important;
        margin-bottom: 5px !important;
    }
    .ipadpro-col-8 p {
        margin-left: 10px;
    }
    .chart-doughnut-ipadpro {
        width: auto !important;
        height: 150px !important;
    }
    /*Jaime 02-06-21*/
    .ipad-col-2-lat {
        width: 100%;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-bottom: 5px !important;
    }
    .ipad-col-2-lon {
        width: 100%;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-bottom: 12px !important;
    }
    /******/
}


/**** IPAD LANDSCAPE *******/

@media only screen and (min-width: 1024px) and (max-height: 768px) and (-webkit-min-device-pixel-ratio: 1.5) and (orientation: landscape) {
    .ipad-col-3 {
        width: 0%;
    }
    .ipad-col-7 {
        margin-top: 10px;
    }
    .ipad-col-2 button {
        float: right;
    }
    .ipad-col-4 {
        width: 50%;
    }
    .ipad-col-10 {
        margin-left: 10px;
    }
    .ipad-usebutton {
        margin-left: -10px;
    }
    .rategauge {
        max-height: 100px !important;
        width: 100% !important;
        display: flex !important;
        align-items: stretch !important;
    }
    .top-navigation .navbar-header {
        display: block !important;
        float: none !important;
    }
    .ipad-col-2-location {
        width: 100%;
        padding: 6px 12px !important;
        margin-bottom: 2px !important;
    }
    .chart-doughnut {
        width: auto !important;
        height: auto !important;
        max-height: 180px !important;
    }
    /*Jaime 02-06-21*/
    .ipad-col-2-lat {
        width: 100%;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-bottom: 5px !important;
    }
    .ipad-col-2-lon {
        width: 100%;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-bottom: 12px !important;
    }
    /******/
}


/**** IPAD PORTRAIT *******/

@media only screen and (min-width: 768px) and (max-height: 1024px) and (orientation: portrait) {
    .chart-doughnut {
        width: auto !important;
        height: auto !important;
        max-height: 180px !important;
    }
    .rategauge {
        width: 100% !important;
        display: flex !important;
        align-items: stretch !important;
    }
    /*Jaime 02-06-21*/
    .ipad-col-2-lat {
        width: 100%;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-bottom: 5px !important;
    }
    .ipad-col-2-lon {
        width: 100%;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-bottom: 12px !important;
    }
    /******/
}


/***** LAPTOP 1366x768 ********/

@media only screen and (max-width: 1366px) and (max-height: 768px) {
    .ipadpro-col-3 {
        width: 0%;
    }
    .ipadpro-col-7 {
        width: 80%;
    }
    .ipadpro-col-2 {
        width: 10%;
    }
    .ipadpro-col-4 {
        width: 50%;
    }
    .ipadpro-col-12 {
        width: 100%;
        text-align: left !important;
        margin-bottom: 5px !important;
    }
    .ipadpro-col-8 p {
        margin-left: 10px;
    }
    .chart-doughnut-ipadpro {
        width: auto !important;
        height: 150px !important;
    }
    /*Jaime 02-06-21*/
    .ipad-col-2-lat {
        width: 100%;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-bottom: 5px !important;
    }
    .ipad-col-2-lon {
        width: 100%;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-bottom: 12px !important;
    }
    /******/
}

.modcod-ru {
    background-color: #91923c !important;
    /* amarillo */
}

.modcod-rd {
    background-color: #09909c !important;
    /* azul */
}

.modcod-cs {
    background-color: #4a8861 !important;
    /* verde */
}

.modcod-global {
    background-color: #926b91 !important;
    /* morado */
}

.ibox-title h3.withbutton {
    display: inline-block;
    text-overflow: ellipsis;
}

.ibox-cm h4.withbutton {
    display: inline-block;
    text-overflow: ellipsis;
}

.flot-tick-label {
    opacity: 0 !important;
}

.btn-favorite:hover {
    color: #FFD700;
}

.opacityslider {
    padding: 7px 20px;
    padding-bottom: 20px;
    background-color: rgba(32, 29, 26, .7);
    border-radius: 0px !important;
    border: 1px solid #666666 !important;
}

.noUi-horizontal {
    height: 10px !important;
}

.noUi-horizontal .noUi-handle {
    height: 20px !important;
    width: 17px !important;
    left: -5px !important;
}

.noUi-handle:before,
.noUi-handle:after {
    height: 7px !important;
    left: 5px !important;
    top: 6px !important;
}

.noUi-handle:after {
    left: 9px !important;
}

.noUi-base {
    background-color: #676767 !important;
}

.const-ok {
    background-color: #4a8861 !important;
    /* verde */
}

#tdhover {}

#tdhover:hover {
    background-color: #d3d3d3 !important;
    /*gris*/
    color: black;
    cursor: pointer;
}

.const-nok {
    background-color: #91923c !important;
    /* amarillo */
}

.const-nok1 {
    background-color: #c42536 !important;
    /* rojo */
}


/*CSS HELP STYLE-CUSTOM*/


/*Cards style*/

.card-body {
    background-color: #100e17;
    font-family: 'Open Sans', sans-serif;
}

.container {
    position: absolute;
    height: 300px;
    width: 100%;
    top: 80px;
    left: 0%;
    right: 0%;
    display: flex;
}

.card {
    display: flex;
    height: 400px;
    width: 100%;
    border-radius: 10px;
    box-shadow: -1rem 0 3rem #000;
    /*   margin-left: -50px; */
    transition: 0.4s ease-out;
    position: relative;
    left: 0px;
    filter: brightness(0.8);
}

.card:not(:first-child) {
    margin-left: -50px;
}

.card:hover {
    transform: translateY(-20px);
    transition: 0.4s ease-out;
    filter: brightness(1.1);
}

.card:hover~.card {
    position: relative;
    left: 50px;
    transition: 0.4s ease-out;
}

.title {
    color: white;
    font-weight: bold;
    font: sans-serif;
    text-shadow: 1px 1px 2px black;
    font-size: 1.5em;
    position: absolute;
    left: 20px;
    top: 15px;
}

.bar {
    position: absolute;
    top: 60px;
    left: 20px;
    height: 5px;
    width: 150px;
}

.filledbar {
    position: absolute;
    top: 0px;
    z-index: 3;
    width: 0px;
    height: 100%;
    background: rgb(0, 154, 217);
    background: white;
    transition: 0.6s ease-out;
}

.card:hover .filledbar {
    width: 120px;
    transition: 0.4s ease-out;
    shadow: 1px 1px 2px black;
}

.model-p {
    margin-top: 20px;
    text-align: left;
    margin-left: 10px;
    opacity: 0%;
    top: 200px;
    left: calc(25% - 60px);
}

.card:hover .model-p {
    color: white;
    opacity: 90%;
}

.infoview {
    margin-top: 200px;
    left: calc(25% - 60px);
}

.card:hover .infoview {
    background-color: var(--main-bg-color);
    width: 100%;
    border-radius: 10px;
    opacity: 80%;
}

.circle {
    position: absolute;
    top: 300px;
    left: calc(50% - 60px);
}

.stroke {
    stroke: white;
    stroke-dasharray: 360;
    stroke-dashoffset: 360;
    transition: 0.6s ease-out;
}

.card:hover .stroke {
    stroke-dashoffset: 100;
    transition: 0.6s ease-out;
}

.boton_personalizado {
    font-size: 0px;
    padding: 10px;
    position: absolute;
    transition: 0.6s ease-out;
    text-decoration: none;
}

.card:hover .boton_personalizado {
    width: 120px;
    font-size: 15px;
    color: white;
    border-radius: 6px;
    border: 2px solid white;
    transition: 0.4s ease-out;
}


/*Videos flotantes*/

.boton_personalizado:hover {
    color: grey;
    border: 2px solid grey;
}

.modal {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Stay in place */
    z-index: 1;
    /* Sit on top */
    left: 0;
    top: 0;
    width: 100%;
    /* Full width */
    height: 100%;
    /* Full height */
    overflow: auto;
    /* Enable scroll if needed */
    background-color: rgb(0, 0, 0);
    /* Fallback color */
    background-color: rgba(0, 0, 0, 0.4);
    /* Black w/ opacity */
}


/* Modal Content/Box */

.modal-content {
    background-color: #fefefe;
    margin: 4% auto;
    /* 15% from the top and centered */
    padding: 0px;
    border: 1px solid #888;
    width: 73%;
    /* Could be more or less, depending on screen size */
}

.modalflot {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Stay in place */
    z-index: 1;
    /* Sit on top */
    left: 0;
    top: 0;
    width: 100%;
    /* Full width */
    height: 100%;
    /* Full height */
    overflow: auto;
    /* Enable scroll if needed */
    background-color: rgb(0, 0, 0);
    /* Fallback color */
    background-color: rgba(0, 0, 0, 0.4);
    /* Black w/ opacity */
}


/* Modal Content/Box */

.modalflot-content {
    background-color: #fefefe;
    margin: 4% auto;
    /* 15% from the top and centered */
    padding: 0px;
    border: 1px solid #888;
    width: 73%;
    /* Could be more or less, depending on screen size */
}


/* The Close Button */

.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.container-video {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%;
    /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

.responsive-iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}


/*drag and drop*/


/***************************** Dropzone Styling *****************************/


/**
 * The dnd-list should always have a min-height,
 * otherwise you can't drop to it once it's empty
 */

.nestedDemo .dropzone ul[dnd-list] {
    margin: 0px;
    min-height: 42px;
    padding-left: 0px;
}

.nestedDemo .dropzone li {
    background-color: #fff;
    border: 1px solid #ddd;
    display: block;
    padding: 0px;
}


/**
 * Reduce opacity of elements during the drag operation. This allows the user
 * to see where he is dropping his element, even if the element is huge. The
 * .dndDragging class is automatically set during the drag operation.
 */

.nestedDemo .dropzone .dndDragging {
    opacity: 0.7;
}


/**
 * The dndDraggingSource class will be applied to the source element of a drag
 * operation. It makes sense to hide it to give the user the feeling that he's
 * actually moving it. Note that the source element has also .dndDragging class.
 */

.nestedDemo .dropzone .dndDraggingSource {
    display: none;
}


/**
 * An element with .dndPlaceholder class will be added as child of the dnd-list
 * while the user is dragging over it.
 */

.nestedDemo .dropzone .dndPlaceholder {
    background-color: #ddd;
    display: block;
    min-height: 42px;
}


/***************************** Element Selection *****************************/

.nestedDemo .dropzone .selected .item {
    color: #3c763d;
    background-color: #dff0d8;
}

.nestedDemo .dropzone .selected .box {
    border-color: #d6e9c6;
}

.nestedDemo .dropzone .selected .box>h3 {
    background-color: #dff0d8;
    background-image: linear-gradient(to bottom, #dff0d8 0, #d0e9c6 100%);
    border-color: #d6e9c6;
    color: #3c763d;
}


/***************************** Element type specific styles *****************************/

.nestedDemo .dropzone .item {
    padding: 10px 15px;
}

.nestedDemo .dropzone .container-element {
    margin: 10px;
}

.nestedDemo .dropzone .container-element .column {
    float: left;
    width: 50%;
}


/***************************** Toolbox *****************************/

.nestedDemo .toolbox ul {
    cursor: move;
    list-style: none;
    padding-left: 0px;
}

.nestedDemo .toolbox button {
    margin: 5px;
    opacity: 1.0;
    width: 123px;
}

.nestedDemo .toolbox .dndDragging {
    opacity: 0.5;
}

.nestedDemo .toolbox .dndDraggingSource {
    opacity: 1.0;
}


/***************************** Trashcan *****************************/

.nestedDemo .trashcan ul {
    list-style: none;
    padding-left: 0px;
}

.nestedDemo .trashcan img {
    width: 100%;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    filter: grayscale(100%);
}

.nestedDemo .trashcan .dndDragover img {
    width: 100%;
    -webkit-filter: none;
    -moz-filter: none;
    filter: none;
}

.nestedDemo .trashcan .dndPlaceholder {
    display: none;
}

.sinOP {
    background-color: var(--main-bg-color);
    border-color: var(--main-bg-color);
    padding: 7px 15px 3px !important;
    margin: 5px;
}

.sinOP:hover {
    background-color: #302B27;
}

.conOP {
    background-color: var(--main-bg-color);
    border-color: var(--main-bg-color);
    padding: 7px 15px 3px !important;
    margin: 5px;
}

.conOP:hover {
    background-color: #302B27;
}

.newtrsp {
    background-color: transparent !important;
}

.newtrsp:empty {
    background-color: red;
}

.arrowsend {
    float: right;
    margin-top: -25px;
    opacity: 0.2;
}

.arrowsend:hover {
    opacity: 1;
}

.gridPadre {
    width: 100%;
    display: grid;
    grid-template-columns: 25% Calc(100% - 25% - 45px) 45px;
    row-gap: 10px;
    margin-bottom: 0px;
}

.gridTitulo11 {
    grid-column: 1;
    grid-row: 1;
}

.gridContenido12 {
    grid-column: 2;
    grid-row: 1;
}

.gridContenido13 {
    grid-column: 3;
    grid-row: 1;
}

.gridTitulo21 {
    grid-column: 1;
    grid-row: 2;
}

.gridContenido22 {
    grid-column: 2;
    grid-row: 2;
}

.gridContenido23 {
    grid-column: 3;
    grid-row: 2;
}

.gridTitulo31 {
    grid-column: 1;
    grid-row: 3;
}

.gridContenido32 {
    grid-column: 2;
    grid-row: 3;
}

.gridContenido33 {
    grid-column: 3;
    grid-row: 3;
}

.gridTitulo41 {
    grid-column: 1;
    grid-row: 4;
}

.gridContenido42 {
    grid-column: 2;
    grid-row: 4;
}

.gridContenido43 {
    grid-column: 3;
    grid-row: 4;
}

.gridTitulo51 {
    grid-column: 1;
    grid-row: 5;
}

.gridContenido52 {
    grid-column: 2;
    grid-row: 5;
}

.gridContenido53 {
    grid-column: 3;
    grid-row: 5;
}

.alturaTitulo {
    height: 68px;
}

.leasetrspbutton {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

.leasebutonwidth {
    width: 100px;
}

.Carrierbutonwidth {
    width: 160px;
}

.addtrspbutonwidth {
    width: 180px;
    margin-top: 0px;
}

@media (max-width: 1420px) {
    .leasetrspbutton {
        flex-direction: column;
        justify-content: flex-start;
    }
    .leasebutonwidth {
        width: 100%;
    }
    .addtrspbutonwidth {
        width: 100%;
        margin-top: 10px;
    }
    .Carrierbutonwidth {
        width: 100%;
    }
}

@media (max-width: 1420px) {
    .gridPadre {
        grid-template-columns: Calc(100% - 45px) 45px;
        row-gap: 2px;
        margin-bottom: 45px;
    }
    .gridContenido12 {
        grid-column: 1;
        grid-row: 2;
    }
    .gridContenido13 {
        grid-column: 2;
        grid-row: 2;
    }
    .gridTitulo21 {
        grid-column: 1;
        grid-row: 3;
    }
    .gridContenido22 {
        grid-column: 1;
        grid-row: 4;
    }
    .gridContenido23 {
        grid-column: 2;
        grid-row: 4;
    }
    .gridTitulo31 {
        grid-column: 1;
        grid-row: 5;
    }
    .gridContenido32 {
        grid-column: 1;
        grid-row: 6;
    }
    .gridContenido33 {
        grid-column: 2;
        grid-row: 6;
    }
    .gridTitulo41 {
        grid-column: 1;
        grid-row: 7;
    }
    .gridContenido42 {
        grid-column: 1;
        grid-row: 8;
    }
    .gridContenido43 {
        grid-column: 2;
        grid-row: 8;
    }
    .gridTitulo51 {
        grid-column: 1;
        grid-row: 9;
    }
    .gridContenido52 {
        grid-column: 1;
        grid-row: 10;
    }
    .gridContenido53 {
        grid-column: 2;
        grid-row: 10;
    }
    .alturaTitulo {
        height: 42px;
    }
}

.CarrierPadre {
    padding-left: 5%;
}

.carrier {
    background-color: var(--main-bg-color);
    border-color: var(--main-bg-color);
    padding: 7px 15px 3px !important;
    margin: 5px;
    color: #87cefa;
}

.botonBloqueado:hover {
    cursor: not-allowed;
}

.carrier:hover {
    color: #6BA4C7;
    background-color: #302B27;
}

.modal-dialog {
    width: 65% !important;
}

.linea {
    border-top: 2px solid grey;
    height: 2px;
    max-width: 200px;
    padding: 0;
    margin-left: 10%;
    margin-top: -10px;
    margin-bottom: 10px;
}

.modal-content {
    z-index: 1000 !important;
    width: 100% !important;
}

.my-custom-scrollbar {
    position: relative;
    height: 200px;
    overflow: auto;
}

.date-picker-date-time {
    z-index: 99999 !important;
    margin-top: -275px;
}

.table-wrapper-scroll-y {
    display: block;
}

.linea {
    border-top: 2px solid grey;
    height: 2px;
    max-width: 200px;
    padding: 0;
    margin-left: 10%;
    margin-top: -10px;
    margin-bottom: 10px;
}

.addcontractModal .modal-dialog {
    z-index: 100 !important;
    width: fit-content;
    height: fit-content;
    /*height: fit-content;*/
}

@media (min-width: 992px) {
    .flexcap_edit_satellite_modal .modal-dialog {
        width: 800px !important;
        /*height: fit-content;*/
    }
}

@media (max-width: 991px) {
    .flexcap_edit_satellite_modal .modal-dialog {
        width: 90% !important;
        /*height: fit-content;*/
    }
}

.viewcontractModal {
    z-index: 99000 !important;
    /* width: fit-content;
    height: fit-content; */
    /*height: fit-content;*/
}

.addcontractModal {
    /* height: fit-content; */
}

.apdf {
    color: white !important;
}

.apdf:hover {
    color: grey !important;
}

.selectorTipoEPFDaCalcular {
    width: 32%;
    margin-bottom: -15px;
}

.flexSelectorTipoEPFDaCalcular {
    flex-direction: row;
}

.helpSelectorTipoEPFDaCalcular {
    transition: color 0.3s ease;
    visibility: visible;
    color: #888888;
    margin-left: -5px;
}

.controladorFlujoInterGEO {
    display: flex;
    flex-direction: column;
}

.controladoresFlujoInterGeoHijos {
    width: 100%;
}

@media (((max-width: 1940px) and (min-width: 992px)) or (max-width: 635px)) {
    .flexSelectorTipoEPFDaCalcular {
        flex-direction: column;
    }
    .selectorTipoEPFDaCalcular {
        width: 100%;
    }
    .helpSelectorTipoEPFDaCalcular {
        visibility: visible;
    }
}

@media (min-width: 992px) {
    .controladorFlujoInterGEO {
        flex-direction: row;
    }
    .controladoresFlujoInterGeoHijos {
        width: 50%;
    }
}

.butt {
    /* background-color: #00aaae; */
    height: 35px;
    border: 1px solid transparent;
    border-radius: 3px;
    color: white;
    padding: 6px 12px;
    font-weight: 400;
    font-size: 14;
    width: 100px;
    cursor: pointer;
}

.butt:hover {
    /* background-color: blue; */
    color: white;
}

.alturaSelect {
    height: 34px !important;
}

.inputblanco input::placeholder {
    color: grey;
}

.inputblanco::-webkit-input-placeholder {
    color: grey;
}

.inputblanco:-moz-placeholder {
    color: grey;
    opacity: 1;
}

.inputblanco::-moz-placeholder {
    color: grey;
    opacity: 1;
}

.inputblanco:-ms-input-placeholder {
    color: grey;
}

.inputblanco::-ms-input-placeholder {
    color: grey;
}

.inputblanco::placeholder {
    color: grey;
}

.custom-scrollbar {
    padding-right: 10px !important;
    overflow-x: auto;
}

.custom-scrollbar::-webkit-scrollbar {
    width: 8px !important;
    margin-right: 8px !important;
}

.custom-scrollbar::-webkit-scrollbar-track {
    background-color: var(--imput-color) !important;
    border-radius: 8px !important;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    background-color: #333333 !important;
    border-radius: 8px !important;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background-color: #262320 !important;
}

.custom-scrollbar-horizontal::-webkit-scrollbar {
    height: 8px !important;
}



::-webkit-scrollbar {
    width: 8px !important;
    margin-right: 8px !important;
}

::-webkit-scrollbar-track {
    background-color: #1b1b1b !important;
    border-radius: 8px !important;
}

::-webkit-scrollbar-thumb {
    background-color: #333333 !important;
    border-radius: 8px !important;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #444444 !important;
}







.custom-scrollbar-horizontal::-webkit-scrollbar-thumb {}

.custom-scrollbar-horizontal::-webkit-scrollbar-thumb:hover {}

.text-success {
    color: #06836b;
}

.text-danger {
    color: #f34336;
}

.InterGEO_POPUP_satellite_selection_card {}

.InterGEO_POPUP_satellite_selection_delete_icon {
    visibility: hidden;
    background-color: #00aaae;
    color: white;
    border-radius: 3px;
    width: 100px;
    height: 30px;
    display: flex;
    justify-content: center;
    margin: 15px 15px 0px 0px;
    padding: 1px 5px 5px 0px;
}

.InterGEO_POPUP_satellite_selection_delete_icon:hover {
    background-color: white;
    color: #00aaae;
}

.InterGEO_POPUP_satellite_selection_card:hover .InterGEO_POPUP_satellite_selection_delete_icon {
    visibility: visible;
}

.InterGEO_POPUP_satellite_selection_update_icon {
    visibility: hidden;
    background-color: transparent;
    color: white;
    border: 1px solid white;
    border-radius: 3px;
    width: 100px;
    height: 30px;
    display: flex;
    justify-content: center;
    margin: 15px 15px 0px 0px;
    padding: 1px 5px 5px 0px;
}

.InterGEO_POPUP_satellite_selection_update_icon:hover {
    background-color: transparent;
    color: #00aaae;
    border: 1px solid #00aaae;
}

.InterGEO_POPUP_satellite_selection_card:hover .InterGEO_POPUP_satellite_selection_update_icon {
    visibility: visible;
}

.InterGEO_POPUP_satellite_selection_update_icon:hover .img_no_hover {
    visibility: collapse;
}

.img_hover {
    visibility: collapse;
}

.InterGEO_POPUP_satellite_selection_update_icon:hover .img_hover {
    visibility: visible;
}

.InterGEO_Cesium_Result_Container {
    z-index: 99;
    background-color: rgba(48, 51, 54, 0.7);
    border: 1px solid #444444;
    border-radius: 5px;
    color: #edffff;
    backdrop-filter: blur(6px);
}

.is_button {
    cursor: pointer;
}

.InterGEO_Cesium_Result_Container.is_button:hover {
    background-color: rgba(68, 136, 187, 0.7);
    border: 1px solid #8cd0ea;
}

.double_slider_wrapper input {
    position: absolute;
    height: 5px;
    background: none;
    pointer-events: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.double_slider[type="range"]::-webkit-slider-thumb {
    height: 17px;
    width: 17px;
    border-radius: 50%;
    -webkit-appearance: none;
    pointer-events: auto;
    background-color: #00aaae;
    border: none;
}

.double_slider[type="range"]::-moz-range-thumb {
    height: 17px;
    width: 17px;
    border-radius: 50%;
    -moz-appearance: none;
    pointer-events: auto;
    background-color: #00aaae;
    border: none;
}

.danger_slider[type="range"]::-webkit-slider-thumb {
    height: 17px;
    width: 17px;
    border-radius: 50%;
    -webkit-appearance: none;
    pointer-events: auto;
    background-color: #ed5565;
    border: none;
}

.warning_slider[type="range"]::-webkit-slider-thumb {
    height: 17px;
    width: 17px;
    border-radius: 50%;
    -webkit-appearance: none;
    pointer-events: auto;
    background-color: #f8ac59;
    border: none;
}

.footprint_contour_slider[type="range"]::-webkit-slider-thumb {
    height: 17px;
    width: 17px;
    border-radius: 50%;
    -webkit-appearance: none;
    pointer-events: auto;
    background-color: #ffffff;
    border: none;
}

.danger_slider[type="range"]::-moz-range-thumb {
    height: 17px;
    width: 17px;
    border-radius: 50%;
    -moz-appearance: none;
    pointer-events: auto;
    background-color: #ed5565;
    border: none;
}

.warning_slider[type="range"]::-moz-range-thumb {
    height: 17px;
    width: 17px;
    border-radius: 50%;
    -moz-appearance: none;
    pointer-events: auto;
    background-color: #f8ac59;
    border: none;
}

.footprint_contour_slider[type="range"]::-moz-range-thumb {
    height: 17px;
    width: 17px;
    border-radius: 50%;
    -moz-appearance: none;
    pointer-events: auto;
    background-color: #ffffff;
    border: none;
}

.barra-carga {
    width: 0;
    height: 10px;
    background-color: #00AAAE;
    /* Color de la barra de carga */
    transform: translate(-50%, -50%);
    z-index: 9999;
    animation: carga 2s linear forwards;
    /* Duración de la animación */
    max-width: 1100px;
    /* Ancho máximo de la barra de carga */
    border-radius: 5px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@keyframes carga {
    100% {
        width: 100%;
        /* Ancho de la barra de carga al completarse */
    }
}

.starlink_dish {
    background-color: #181818;
}

.starlink_dish:hover {
    background-color: #242424;
}

.lb-description-title {
    color: white;
}

.lb-description-title:hover {
    color: #00aaae;
}

#miParrafo {
    white-space: pre-line;
}


/* Chrome, Safari, Edge, Opera */

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}


/* Firefox */

input[type=number] {
    -moz-appearance: textfield;
}

.starlink_hide_sats:hover {
    background-color: #4488ba;
    border-color: #a9edfe;
}

.orbisat_collision_table tr:not(:first-of-type):hover {
    background-color: #252525;
}

.transponders_list_wrapper:hover {
    background-color: #494949!important;
}

.carriers_list_wrapper:hover {
    background-color: #494949!important;
}

.footprint_list:hover {
    background-color: #494949!important;
}


/*table {
  border-collapse: collapse;
  letter-spacing: 1px;
  font-size: 0.8rem;

}*/


/*td{
  padding: 10px 40px;
  font-size: 20px;
  
}
th {
  padding: 10px 40px;
  text-align: center;
  font-size: 20px;
  background-color: var(--main-bg-color);
}

td {
  text-align: center;
}*/

.orbisat_prediction_sample:hover {
    background-color: #2a2a2a;
    cursor: pointer;
}

.date_time_holder {
    position: relative;
}

.orbisat_slider {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent;
    cursor: pointer;
    width: 15rem;
}

.orbisat_slider::-webkit-slider-runnable-track {
    background: #00aaae;
    height: 5px;
}

.orbisat_slider::-moz-range-track {
    background: #00aaae;
    height: 5px;
}

.orbisat_slider::-webkit-slider-thumb {
    height: 17px;
    width: 17px;
    border-radius: 50%;
    pointer-events: auto;
    background-color: #00aaae;
    border: none;
}

.orbisat_slider::-moz-range-thumb {
    height: 17px;
    width: 17px;
    border-radius: 50%;
    pointer-events: auto;
    background-color: #00aaae;
    border: none;
}

.swal2-container {
    z-index: 2050 !important;
}

.api_status {
    transition: border 0.3s ease, background-color 0.3s ease; user-select: none;
    display: flex; flex-direction: column; gap: 10px; padding: 10px; border: 2px solid #555555; border-radius: 10px; cursor: pointer;
}

.api_status:hover {
    border: 2px solid #888888;
    background-color: #222222;
}

.reborde {
    border-radius: 3px !important;
    border: 1px solid #747474 !important;
}

.border-transition {
    transition: border 0.3s ease;
}
.color-transition {
    transition: color 0.3s ease;
}
#list-container {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 20px;
    max-height: 900px; /* Limita la altura máxima del contenedor */
    overflow-y: auto; /* Habilita el scroll vertical */
  }

  .list-item {
    display: flex;
    align-items: center;
    background-color: #2a2a2a;
    color: white;
    padding: 15px;
    border-radius: 10px;
    cursor: pointer;
    transition: background 0.3s;
  }

  .list-item:hover {
    background-color: #555555;
  }

  .list-content {
    display: flex;
    align-items: center;
    width: 100%;
  }

  .list-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
  }

  .list-icon img {
    width: 60px;
    height: 60px;
  }

  .list-info {
    flex: 1;
    margin-left: 30px;
  }
  .list-info2 {
    display: flex;
    flex: 1;
    margin-left: 5px;
  }
  .list-info strong {
    font-size: 16px;
    margin-bottom: 5px;
  }

  .list-info p {
    margin: 2px 0;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 5px;
  }

  .icon {
    font-size: 16px;
  }

  #select-button {
    margin-top: 10px;
    padding: 10px 15px;
    border: none;
    background-color: #00bcd4;
    color: white;
    border-radius: 5px;
    cursor: pointer;
    display: block;
    margin: 0 auto;
  }
/* Checkbox personalizado */
.custom-checkbox {
    display: flex;
    align-items: center;
    cursor: pointer;
    position: relative;
    font-size: 18px; /* Ajusta el tamaño del texto */
}

/* Ocultar el checkbox nativo */
.custom-checkbox input {
    opacity: 0;
    position: absolute;
}

/* Estilizar el checkmark (Caja del checkbox) */
.custom-checkbox .checkmark {
    width: 22px;
    height: 22px;
    background-color: #444;
    border-radius: 4px;
    display: inline-block;
    margin-right: 10px;
    position: relative;
    transition: 0.2s ease-in-out;
}

/* Mostrar el check cuando el input está seleccionado */
.custom-checkbox input:checked + .checkmark::after {
    content: "✔";
    position: absolute;
    left: 4px;
    color: #00aaae;
    font-size: 16px;
    font-weight: bold;
}
.date-block {
    background-color: #2a2a2a;
    border: none;
    padding: 15px;
    border-radius: 8px;
    border: 1px solid #444;
    margin-bottom: 10px;
    cursor: pointer; /* Indicar que es interactivo */
}

.custom-date {
    background-color: #2a2a2a;
    border: 1px solid #555;
    border-radius: 6px;
    padding: 10px;
    width: 100%;
    color: white;
    outline: none;
    cursor: pointer;
}

/* Invertir el color del icono del calendario */
.custom-date::-webkit-calendar-picker-indicator {
    filter: invert(1);
    cursor: pointer;
}

/*Machine learning css*/
.swal2-title-custom {
    color: #2c3e50 !important;
    font-size: 1.8em !important;
    font-weight: bold !important;
}

.swal2-confirm-custom {
    background-color: #3498db !important;
    color: #fff !important;
    border-radius: 5px !important;
    padding: 10px 20px !important;
}

.swal2-popup {
    border-radius: 10px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
}

.my-confirm-button {
    background-color: #00AAAE !important;
    color: #ffffff !important;
    font-size: 20px;
    padding: 12px 24px;
    border-radius: 8px;
  }
  


  /* From Uiverse.io by iZOXVL */ 
.boton-elegante {
  padding: 15px 30px;
  border: 2px solid #00AAAE;
  background-color: #333333;
  color: #ffffff;
  font-size: 1.2rem;
  cursor: pointer;
  border-radius: 10px;
  transition: all 0.4s ease;
  outline: none;
  position: relative;
  overflow: hidden;
}

.boton-elegante::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transition: transform 0.5s ease;
}

.boton-elegante:hover::after {
  transform: scale(4);
}

.boton-elegante:hover {
  border-color: #00AAAE;
  background: #00AAAE;
}

.card_newcarrier {
 border-radius: 30px;
 box-shadow: 15px 15px 30px rgb(25, 25, 25),
             -15px -15px 30px rgb(60, 60, 60);

}

.styled-date-picker {
    appearance: none;
    -webkit-appearance: none;
    background-color: #2a2a2a;
    color: #fff;
    border: none;
    border-radius: 12px;
    padding: 12px 16px;
    font-size: 18px;
    width: 250px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
    outline: none;
    transition: box-shadow 0.3s ease;
  }

  .styled-date-picker:hover {
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.35);
  }

  .styled-date-picker:focus {
    box-shadow: 0 0 0 2px #00aaae;
  }

  /* Oculta el ícono del calendario por defecto en Chrome */
  .styled-date-picker::-webkit-calendar-picker-indicator {
    filter: invert(1);
    cursor: pointer;
  }
  .spinner {
  background-image: linear-gradient(rgb(42 42 42) 35%,rgb(0, 225, 255));
  width: 100px;
  height: 100px;
  animation: spinning82341 1.7s linear infinite;
  text-align: center;
  border-radius: 50px;
  filter: blur(1px);
}

.spinner1 {
  background-color: rgb(36, 36, 36);
  width: 100px;
  height: 100px;
  border-radius: 50px;
  filter: blur(10px);
}

@keyframes spinning82341 {
  to {
    transform: rotate(360deg);
  }
}
.swal2-confirm-custom {
    background-color: #00CFCF !important;
    color: white !important;
    padding: 8px 20px;
    font-size: 16px;
    border-radius: 6px;
    border: none;
    margin: 10px;
}

.swal2-cancel-custom {
    background-color: #333 !important;
    color: white !important;
    padding: 8px 20px;
    font-size: 16px;
    border-radius: 6px;
    border: 1px solid #555;
    margin: 10px;
}
.swal2-deny-custom {
    background-color: #d9534f !important;
    color: white !important;
    padding: 8px 20px;
    font-size: 16px;
    border-radius: 6px;
    border: none;
    margin: 10px;
}
.swal2-validation-message {
    background: #2a2a2a;
    color: #ff6666;
    border: 1px solid #ff6666;
    border-radius: 5px;
    padding: 10px 15px;
    font-weight: bold;
    font-size: 14px;
    margin-top: 10px;
    text-align: center;
}

.focused-view {
    border: 2px solid #00AAAE;
    box-shadow: 0 0 15px rgba(0, 170, 174, 0.5);
}
.contenedor_satelite_transponders.block-disabled {
  opacity: .5;
  filter: grayscale(.6);
  cursor: not-allowed;
}