/* here you can put your own css to customize and override the theme */
#bb_des{ width: 216px; float: right;}
#bb_des .bootstrap-select{ width: 55px; float: inline-start;}
.map_clientes{
    margin:0;
}
.map_clientes > i{
    font-size: 20px;
}
#header_data{
    padding-top:10px;
    padding-bottom:10px;
    border-bottom: 1px solid #cccccc;
}

.archivos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 16px;
    align-items: start;
}

.archivo-card {
    width: 100%;
    text-align: center;
}

.archivo-thumb {
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #f4f4f4;
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.archivo-thumb img,
.archivo-thumb video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Para iconos PDF, Word, Excel, etc. */
.archivo-thumb.archivo-icon img {
    width: 70%;
    height: auto;
    object-fit: contain;
}

/* Audio (nota de voz de WhatsApp, etc.): mantiene el mismo cuadrado 1/1 que las
   imagenes para que todas las tarjetas queden a la misma altura (simetria). El
   reproductor se acomoda dentro del cuadrado. */
.archivo-audio {
    flex-direction: column;
    gap: 6px;
    padding: 8px;
    background: #f4f4f4;
}
.archivo-audio > .fa {
    font-size: 26px;
    color: #666;
}
.archivo-audio audio {
    width: 100%;
}

/* Icono de archivos que no son imagen/audio/video (PDF, Word, STL...) */
.archivo-thumb.archivo-icon > .fa {
    font-size: 40px;
    color: #888;
}

/* Fecha, hora y estado en que se subio cada archivo adicional */
.archivo-meta {
    margin-top: 4px;
    text-align: center;
    line-height: 1.2;
}
.archivo-meta .archivo-fecha {
    font-size: 11px;
    color: #666;
}
.archivo-meta .archivo-estado {
    font-size: 11px;
    font-weight: 600;
    color: #337ab7;
}

.archivo-wrap {
    position: relative;
    display: block;
}

/* Encabezado de grupo por fecha en las fotos adicionales */
.archivos-grupo-fecha {
    font-weight: 600;
    font-size: 13px;
    color: #555;
    border-bottom: 1px solid #e0e0e0;
    margin: 14px 0 8px;
    padding-bottom: 4px;
}

/* Barra de acciones debajo de cada foto: editar imagen, editar nombre, eliminar.
   Iconos alineados en fila bajo la miniatura (no flotan sobre la imagen). */
.archivo-acciones {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin: 3px 0;
}
.archivo-btn {
    width: 26px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-size: 12px;
    color: #555;
    background: #f0f0f0;
    border: 1px solid #d5d5d5;
    border-radius: 3px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.archivo-btn:hover {
    background: #337ab7;
    color: #fff;
    text-decoration: none;
    border-color: #2e6da4;
}
.archivo-btn.archivo-btn-danger:hover {
    background: #d9534f;
    border-color: #d43f3a;
}

/* Nombre del archivo (editable con el lapiz) */
.archivo-nombre {
    font-size: 10px;
    color: #888;
    word-break: break-all;
    max-width: 160px;
    margin: 0 auto;
}
/***
Rounded Portlets
***/
#checkbox-list li{ list-style: none; }
#load_inventario li{ list-style: none; }
#listado_procesos_tracking li .menu_tracking li{ padding: 0px; margin-bottom: 0px;}
.btn_liquidacion{ margin-top: 11px;}
.caption{ color: #ffffff; }
.inicio .btn_tracking{ margin-left: auto; margin-right:auto; }
#listado_procesos_tracking li{ display: inline-grid; }
.disabled button{ background: #eeeeee}
.select-items{ width: 100%}
.nopadding{ padding: 0px;}
#cometchat__widget{ position: fixed; }
.list_group{
    list-style: none;
    margin: 0;
    padding: 0;
}
#id_old_password, #id_new_password1, #id_new_password2{
    font-size: 14px;
    font-weight: normal;
    color: #333;
    background-color: #fff;
    border: 1px solid #e5e5e5;

    display: block;
    width: 40%;
    height: 34px;
    padding: 6px 12px;
    line-height: 1.42857143;
    background-image: none;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.errorlist{
    background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;
    border-width: 1px;

    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}
ul.errorlist{ list-style: none;}
.tools a{
    float:left;
    margin:8px;
    text-decoration: none;
}
.tools a i{color:#ffffff;}
.tools a:hover i{ color:#cccccc;}
.tools a i{ display:inline; }
.list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.toolbar{
    text-align: end;
    padding:10px;
    display:block;
    margin-top: 9px;
    font-size:12px;
}
.vdientes{
    word-break: break-word;
}
.view_marca{ display: block; }
.lbl-barra{ display: block; color: #dca526; text-align: center; }
#totales_table{ margin-top: 20px;}
.row-eq-height {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;
}
.formRow {
    /*position: relative;
    width: 100%;*/
}

.formRow--item {
    /*display: block;
    width: 100%;*/
}

.formRow--input {
    position: relative;
    padding: 15px 20px 11px;
    width: 100%;
    outline: none;
    border: solid 1px #95989a;
    border-radius: 4px;
    color: #2c3235;
    letter-spacing: .2px;
    font-weight: 400;
    font-size: 16px;
    resize: none;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}

.formRow--input-wrapper {
    position: relative;
    display: block;
    /*width: 100%;*/
}

.formRow--input-wrapper.active .placeholder {
    top: -5px;
    background-color: #ffffff;
    color: #dca526;
    text-transform: uppercase;
    letter-spacing: .8px;
    font-size: 11px;
    line-height: 14px;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.formRow--input-wrapper.active .formRow--input:not(:focus):not(:hover) ~ .placeholder { color: #f7d68b; }

.formRow--input-wrapper .formRow--input:focus, .formRow--input-wrapper .formRow--input:hover { border-color: #dca526; }

.formRow .placeholder {
    position: absolute;
    top: 50%;
    left: 33px;
    display: block;
    padding: 0 10px;
    color: #95989a;
    white-space: nowrap;
    letter-spacing: .2px;
    font-weight: normal;
    font-size: 13px;
    -webkit-transition: all, .2s;
    transition: all, .2s;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

ul.visto {
    border: solid 2px #6d6d6c;
    border-radius: 5px;
    padding: 0.5em 1em 0.5em 2.3em;
    position: relative;
}

ul.visto li {
    line-height: 1.5;
    padding: 0.5em 0;
    list-style-type: none!important;
}

ul.visto li:before {
    font-family: FontAwesome;
    content: "\f00c";
    position: absolute;
    left : 1em;
    color: #6d6d6c;
}
.iconFontSize{ font-size: 20px;}

.fa-whatsapp:before {
    content: "\f232";
}
.field_proceso{ margin-top:5px; margin-bottom: 5px;}
#listado_pedidos li{ border-bottom: 1px solid #ccc; padding-bottom: 10px; padding-top: 10px; }
.btn_flip{ position: absolute; right: -12px; top: 13px; width: 26px;height: 26px; padding: 5px; background: #6d6d6c; border-radius: 200px 200px 200px 200px;
    -moz-border-radius: 200px 200px 200px 200px;
    -webkit-border-radius: 200px 200px 200px 200px;
    border: 0px solid #6d6d6c; color: #ffffff;z-index:200;}
.flip .back {
    background: #2184cd;
    color: #fff;
    text-align: center;
}
.front img { border:6px solid #6d6d6c;}
.numInv{ width: 29%;}
.textInv{ width: 62%;}
.opInv{ width: 16px;}
.checkInv opInv{ color:#c56b03; }
#result #foto_2{ display: block; margin-left: auto;margin-right:auto;}
.ListInv{float:left;}
.list-title{ margin-top: 45px; text-align: center; }
.circleTracking label{ display: block; text-align: center; color: #ffffff;}

.info_track{ display: block; text-align: center; font-size: 12px;}
#pago,#sucursales{ list-style: none;}
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (-webkit-min-device-pixel-ratio: 2) {
.hide-header{ display:none;}
}

.num_pedido_search{ font-size: 21px;}
.side-navi-data #content{ margin-left: 25px; margin-right: 25px;}
.side-navi-data #title_proceso{ margin:10px; }
#registro ul{ list-style: none; padding: 0; margin:0;}
#registro ul li ul{ padding-left: 10px; margin:5px;}
#listado_procesos_tracking,
#listado_procesos,#listado_pruebas,#listado_tecnicos{ list-style: none; padding: 0; margin: 0; }
#listado_procesos li,#listado_tecnicos li{ width: 100%; }
#listado_pruebas li{ width:100%; }
#listado_procesos_tracking li,
#listado_procesos li,
#listado_tecnicos li,
#listado_pruebas li{
padding: 5px;
margin-bottom: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
cursor: pointer;}

.number_t a { font-size: 30px; color: #dca526; }
#procesos_total{ cursor: pointer;}
#listado_procesos_tracking li a{color:#ffffff;}
.timeline {
 margin:0 0 30px;
 padding:0;
 position:relative
}
.timeline:before {
 content:'';
 position:absolute;
 display:block;
 width:4px;
 background:#f5f6fa;
 top:0;
 bottom:0;
 margin-left:38px
}
.timeline .timeline-item {
 margin:0;
 padding:0
}
.timeline .timeline-badge {
 float:left;
 position:relative;
 padding-right:30px;
 height:80px;
 /*! width:80px */
}
.timeline .timeline-badge-userpic {
 width:80px;
 height:80px;
 border:4px solid #f5f6fa;
 -webkit-border-radius:50%!important;
 -moz-border-radius:50%!important;
 border-radius:50%!important
}
.timeline .timeline-badge-userpic img {
 border-radius:50%!important;
 vertical-align:middle!important
}
.timeline .timeline-icon {
 width:80px;
 height:80px;
 background-color:#f5f6fa;
 -webkit-border-radius:50%!important;
 -moz-border-radius:50%!important;
 border-radius:50%!important;
 padding-top:30px;
 padding-left:22px
}
.timeline .timeline-icon i {
 font-size:34px
}
.timeline .timeline-body {
 position:relative;
 padding:7px;
 margin-top:10px;
 margin-left:110px;
 background-color:#f5f6fa;
 -webkit-border-radius:4px;
 -moz-border-radius:4px;
 -ms-border-radius:4px;
 -o-border-radius:4px;
 border-radius:4px
}
.timeline .timeline-body:after,
.timeline .timeline-body:before {
 content:" ";
 display:table
}
.timeline .timeline-body:after {
 clear:both
}
.timeline .timeline-body-arrow {
 position:absolute;
 top:30px;
 left:-14px;
 width:0;
 height:0;
 border-style:solid;
 border-width:14px 14px 14px 0;
 border-color:transparent #f5f6fa transparent transparent
}
.timeline .timeline-body-head {
 margin-bottom:10px
}
.timeline .timeline-body-head-caption {
 /*float:left*/
}
.timeline .timeline-body-alerttitle,
.timeline .timeline-body-title {
 font-size:16px;
 font-weight:600
}
.timeline .timeline-body-time {
 font-size:14px;
 margin-left:10px
}
.timeline .timeline-body-head-actions {
 float:right
}
.timeline .timeline-body-head-actions .btn-group {
 margin-top:-2px
}
.timeline .timeline-body-content {
 font-size:14px;
}
.timeline .timeline-body-img {
 width:100px;
 height:100px;
 margin:5px 20px 0 0
}
.timeline.white-bg:before {
 background:#fff
}
.timeline.white-bg .timeline-badge-userpic {
 border-color:#fff
}
.timeline.white-bg .timeline-body,
.timeline.white-bg .timeline-icon {
 background-color:#fff
}
.timeline.white-bg .timeline-body-arrow {
 border-color:transparent #fff transparent transparent
}
@media (max-width:768px) {
 .timeline .timeline-body-head-caption {
  width:100%
 }
 .timeline .timeline-body-head-actions {
  float:left;
  width:100%;
  margin-top:20px;
  margin-bottom:20px
 }
 .table-responsive{min-height:.01%;overflow-x:auto; }
}
@media (max-width:480px) {
 .timeline:before {
  margin-left:28px
 }
 .timeline .timeline-badge {
  padding-right:40px;
  width:60px;
  height:60px
 }
 .timeline .timeline-badge-userpic {
  width:60px
 }
 .timeline .timeline-icon {
  width:60px;
  height:60px;
  padding-top:23px;
  padding-left:18px
 }
 .timeline .timeline-icon i {
  font-size:25px
 }
 .timeline .timeline-body {
  margin-left:80px
 }
 .timeline .timeline-body-arrow {
  top:17px
 }
 .table-responsive{min-height:.01%;overflow-x:auto; }
}
#sideNavi {
  position: fixed;
  right: 50px;
  top: 25%;
}

.side-navi-item {
  position: absolute;
  display: inline-block;
  width: 150px;
  height: 50px;
  transform: rotate(-90deg);
  transform-origin: left top 0;
  color: #fff;
  background-color: #384047;
  cursor: pointer;
  border-radius: 5px 5px 0 0;
}

.side-navi-item.item1 {
  top: 180px;
  left: 0;
}

.side-navi-item.item2 {
  top: 355px;
  left: 0;
}

.side-navi-item.active {
  background-color: #e5e5e5;
  color: #000;
}

.side-navi-item > div {
  padding-top: 15px;
  text-align: center;
}

.side-navi-data {
  position: absolute;
  top: 0;
  left: 50px;
  width: 650px;
  height: 450px;
  background-color: #e5e5e5;
}

.side-navi-tab { display: none; }

.side-navi-tab.active {
  display: inline-block;
  color: #000;
}

.side-navi-tab > div { padding: 30px; }
.garantia td{ background: #6d6d6c; color:#ffffff;}
.garantia td a{ color:#ffffff;}
.garantia td a:hover{ color:#dca526;}
.garantia .dropdown-menu a{ color:#555;}
.garantia .dropdown-menu a:hover{ color:#555;}
.parameter-title{ text-align: center;margin: 0; padding: 0;}
.foto_parameter{ width: 150px; height: 113px; display: block; margin-right: auto; margin-left: auto;}
.foto_parameter_cc{ width: 150px; height: 113px; display: block; margin-right: auto; margin-left: auto;}

#parametros{ margin: 0; padding: 0;}
#parametros li{ width: 250px; float: left; list-style: none;}
#list_procesos_adicional li{ list-style: none; }
#list_procesos_adicional{ padding: 0; margin: 0;}
.annotated-list .search {
    border-radius: 25px;
    padding: 7px 14px;
    background-color: #ffffff;
    border: solid 1px rgba(0,0,0,0.2);
    width: 200px;
    box-sizing: border-box;
    color: #2e2e2e;
    margin-bottom: 5px;
}
.annotated-list .sort {
    font-size: 12px;
    font-size: 1.2rem;
    padding: 5px 15px;
    border-radius: 25px;
    border: none;
    display: inline-block;
    color: #2e2e2e;
    text-decoration: none;
    margin: 2px 0;
}
.annotated-list .sort.asc::after {
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #2e2e2e;
    content: "";
    position: relative;
    top: 11px;
    right: -4px;
}
.annotated-list .sort.desc::after {
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 4px solid #2e2e2e;
    content: "";
    position: relative;
    top: -9px;
    right: -4px;
}
.intl-tel-input{ width: 100%; }
.mt-list-item{ cursor:grab;}
.toggle-password{ cursor:pointer;}
.map_canvas { width: 100%;height: 450px;margin: 10px 20px 10px 0; }
.fila_direccion,.fila_contacto{ cursor: pointer;}
.form-control2{ display: block;
width: 100%;
height: 34px;
padding: 6px 3px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;}
.btn_edad {
    border-width: 0;
    padding: 7px 7px;
    font-size: 14px;
    outline: none !important;
    background-image: none !important;
    filter: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    text-shadow: none;
}
#txt_edad{ text-align: center; }
.diente{ cursor: pointer;}
.inicio,.fin{ margin-bottom: 10px;}
.text_time{ width: 130px; float: left; border-radius: 3px;}
.time_txt { padding-left: 10px; padding-right:10px;}
.btnLibre{ width: 100%; }
.btnAction{ width: 100%;}
.tiempo{ font-size:26px; }
.number_stopwatch{ font-size:33px; }
.num_pedido{ font-size:20px;}
.filas_pedido_despacho { cursor: move; }
.box_tracking{ -webkit-box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75); box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75); padding:10px; height: 150px; margin-bottom:10px; }
.arrow-down {
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 20px solid #f00;
  border-top: 20px solid #cccccc;
  position: relative;
  bottom: 10px;
  left: 39%;
}
#laboratorio{ list-style:none; margin:0; padding:0;}
.lab_online .lab{ float:left; }
.lab_online #laboratorio{ display:flex; justify-content:center; align-items:center; margin-left:auto; margin-right:auto; }
.activeInv{ margin-right:10px; }
.btn_1{ width: 33px;display: block; float: left; }
.table_coordinar{ margin-top: 15px; }
#field_pedido{ margin-left:14px; padding: 0; list-style: number; }
#field_pedido li{ padding:5px; }
#input-txt{ float:left; width: 90%; }
#map_d{ float: left; margin-right: 5px; }
.name_collapsed{ cursor: pointer;}
#list_procesos_adicional_fin{ list-style: none; padding: 0; margin: 0;}
.btn_d{
	/*width: 30px;*/
	margin: 0;
	padding: 5px;
}
.gallery_historial{
	margin: 5px;
	list-style: none;
	padding: 0;
}
.gallery_historial li{
	margin: 5px;
	float: left;
	position:relative;
}
.gallery_historial li a{ display:block; }
.gallery_historial li img{ width:100px; }
#back_list{
	background: #dca526;
	color:#ffffff;
	border-style: outset;
	border-color: #dca500;
	height: 40px;
	width: 125px;
	text-shadow: none;
	border:0;
	margin-bottom: 5px;
}
#btn_top, #btn_bottom,#btn_diagonal,#btn_side,#btn_zoom_in,#btn_zoom_out{
	border: 1px double #dca526;
	border-radius: 5px;
	width: 61px;
	height: 61px;
	margin:5px;
}
#btn_top{
	background: url("../../global/img/ic_top.1e5cfb1b6f4d.png");
}
#btn_bottom{
	background: url("../../global/img/ic_bottom.f8e4d7936097.png");
}
#btn_diagonal{
	background: url("../../global/img/ic_diagonal.17c522b75431.png");
}
#btn_side{
	background: url("../../global/img/ic_side.6730fdaaec0c.png");
}
#btn_zoom_in{
	background: url("../../global/img/ic_zoom_in.98a043ac271c.png");
}
#btn_zoom_out{
	background: url("../../global/img/ic_zoom_out.6216fdaf4532.png");
}

body #cometchat {
	position: absolute;
  z-index:100;
}
.modal-header .close{
	position:absolute;
	right:6px;
	top:5px;
	z-index: 100;
}
.modal-number{
	text-align:right;
	display: block;
	margin: 0;
}
.number a{ font-size:30px; color:#dca526;}
.number2 a{ font-size:30px; color:#6d6d6c;}
.list-group-item{ margin:5px; float:left; width:20%; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;}
.btn_photo_delete{ margin-top: 5px;}
#load_photos{ margin:0; padding: 0;}
#dropzone{ background-image: url("../../img/dropfile.dc1196ffa7cc.png"); background-repeat: no-repeat; background-position: center; }
.tools{ margin-top: 11px;}
.flag-text{float: left;}
.btn_badge{position: relative;}
.bd_up{ position: absolute; top: -9px; left: 19px; font-size: 15px;}
.badge2 {
    font-weight: 300;
    text-align: center;
    height: 21px;
    padding: 3px 6px 3px 6px;
    -webkit-border-radius: 12px !important;
    -moz-border-radius: 12px !important;
    border-radius: 12px !important;
    text-shadow: none !important;
    text-align: center;
    vertical-align: middle;

    display: inline-block;
    min-width: 10px;
    line-height: 1;
    white-space: nowrap;
}
.hider-page {
    background: #ffffff url("../img/loading.c7136d0803ce.gif") 50% 50% no-repeat;
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
}
.fila_asignacion{ background: #f5d58d; }

.ajax-file-upload-statusbar{
    float: left;
}
.fc-view-container{ margin-top:10px; }
#suggesstion-box{
    position: absolute;
    z-index: 11;
    background: white;
    top: 33px;
    border: 1px solid gray;
    width: 90%;
}
#pedido-box{
    position: absolute;
    z-index: 11;
    background: white;
    top: 33px;
    /*border: 1px solid gray;*/
    width: 90%;
}
#top-menu-search{ float:right; }
#pedido_s{ background: #ffffff; height: 35px; width: 206px;}
#s2id_search_cliente{ width: 206px;}
#cliente_s .select2-container .select2-choice{ height: 35px; border-radius:0px;}
#cliente_s .select2-container .select2-choice > .select2-chosen{ margin-top: 5px;}
.search-form{ margin-right: 10px;}
.diseno_pop { padding: 0; margin:0; }
.diseno_pop .flag{ float:left; }
.diseno_tooltip{ margin-left: -36px; position: absolute; }
.comment_tooltip{ margin-left: -36px; position: absolute;  word-wrap: break-word;}
.marca_tooltip{ margin-left: -120px; position: absolute;  word-wrap: break-word; z-index:1;}
.munon_tooltip{ margin-left: -77px; }
.box_inv{text-align:center; width:30px; height:22px}
.minus{height: 22px; width:20px; border:none; cursor:pointer; text-align:center;}
.plus{ height: 22px; width:20px; border:none; cursor:pointer; text-align:center;}
.btn_diente_ad{ cursor: pointer; float:left; padding: 5px; margin:1px; border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; border: 1px solid #000000; }
.select_adicional{ cursor: pointer; }
.unselect{ background: #ffffff; color: #000000; }
.select{ background: #000000; color:#ffffff; }

.tooltip.bottom .tooltip-arrow2 {
    top: 0;
    left: 50%;
    margin-left: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #a2a2a2;
}
.tooltip-arrow2 {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}
.tooltip-inner2 {
    max-width: 200px;
    padding: 3px 8px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    background-color: #a2a2a2;
    border-radius: 4px;
}

.dientes_tooltip.top {
    padding: 5px 0;
    margin-top: -61px;
}

.tooltip.top .tooltip-arrow3 {
    bottom: 0;
    left: 50%;
    margin-left: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000;
}
.tooltip-arrow3 {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}
.tooltip-inner3 {
    max-width: 200px;
    padding: 3px 8px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    background-color: #a2a2a2;
    border-radius: 4px;
}

.view_adicional{ cursor: pointer; }
.adicional_tooltip{ margin-left: -80px; }
.pop_up_adicional_content{ margin: 0; padding: 0; list-style: none; }
.pop_up_adicional_content li{ padding: 3px; }

.tooltip.bottom .tooltip-arrow4 {
    top: 0;
    left: 50%;
    margin-left: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #000000;
}
.tooltip-arrow4 {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}
.tooltip-inner4 {
    max-width: 200px;
    padding: 3px 8px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    background-color: #000000;
    border-radius: 4px;
}

.filtro1{ padding:15px; }

.modal.left .modal-dialog,
.modal.right .modal-dialog {
	position: fixed;
	margin: auto;
	width: 320px;
	height: 100%;
	-webkit-transform: translate3d(0%, 0, 0);
		-ms-transform: translate3d(0%, 0, 0);
			-o-transform: translate3d(0%, 0, 0);
		    	transform: translate3d(0%, 0, 0);
}

.modal.left .modal-content,
.modal.right .modal-content {
	height: 100%;
	overflow-y: auto;
}

.modal.left .modal-body,
.modal.right .modal-body {
	padding: 15px 15px 80px;
}

/*Right*/
.modal.right.fade .modal-dialog {
	right: -320px;
	-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
		-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
			-o-transition: opacity 0.3s linear, right 0.3s ease-out;
		    	transition: opacity 0.3s linear, right 0.3s ease-out;
}

.modal.right.fade.in .modal-dialog {
	right: 0;
}
.page-number{
    display: inline-block;
    float: right;
    padding: 5px 0;
}
.page-number h1{
    margin: 0;
    font-weight: 400;
    font-size: 22px;
    color: #f29222;
}
.page-number span{
    text-align: center;
    display: block;
    font-size: 20px;
}
#totales{ margin-top: 30px; }
#totales td{ padding:6px; }
.fecha_grande {
    font-family: 'Verdana,Arial,Helvetica,sans-serif';
    color: black;
    font-size: 15px;
    font-weight: bold;
}
.modal-stl {
    z-index: 999;
    outline: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1040;
    overflow: hidden;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
}
.modal-stl .modal-dialog{ z-index: 10051;}
/* Large screens */
@media only screen and (min-width : 1824px) {
    #logo-2{ display:block; }
    #logo-2 img{ margin-left: 0px;}
    .iffyTip {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 340px;
        cursor:pointer;
    }
    .iffyTip2 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 407px;
        cursor:pointer;
    }
    .iffyTip3 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 150px;
        cursor:pointer;
    }
    .iffyTip4 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 150px;
        cursor:pointer;
    }
    .iffyTip5 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 150px;
        cursor:pointer;
    }
    .iffyTip6 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 68px;
        cursor:pointer;
    }
    .iffyTip7 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 238px;
        cursor:pointer;
    }
    .iffyTip8 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 220px;
        cursor:pointer;
    }
}

@media only screen and (min-width : 1700px) {
    #logo-2{ display:block; }
    .page-header-top{ display:none; }
    .page-header-menu .nav .dropdown-user a.dropdown-toggle{ color:#ffffff; }
    .iffyTip {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 300px;
        cursor:pointer;
    }
    .iffyTip2 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 300px;
        cursor:pointer;
    }
    .iffyTip3 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 140px;
        cursor:pointer;
    }
    .iffyTip4 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 114px;
        cursor:pointer;
    }
    .iffyTip5 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 68px;
        cursor:pointer;
    }
    .iffyTip6 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 59px;
        cursor:pointer;
    }
    .iffyTip7 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 107px;
        cursor:pointer;
    }
    .iffyTip8 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 220px;
        cursor:pointer;
    }
}

/* Desktops and laptops */
@media only screen and (max-width : 1400px) {
    #logo-2{ display:block; }
    .page-header-top{ display:none; }
    .page-header-menu .nav .dropdown-user a.dropdown-toggle{ color:#ffffff; }
    .iffyTip {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 91px;
        cursor:pointer;
    }
    .iffyTip2 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 150px;
        cursor:pointer;
    }
    .iffyTip3 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 100px;
        cursor:pointer;
    }
    .iffyTip4 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 72px;
        cursor:pointer;
    }
    .iffyTip5 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 68px;
        cursor:pointer;
    }
    .iffyTip6 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 59px;
        cursor:pointer;
    }
    .iffyTip7 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 107px;
        cursor:pointer;
    }
    .iffyTip8 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 220px;
        cursor:pointer;
    }
}

/* Desktops and laptops */
@media screen and (max-width: 1200px) {
    #logo-2{ display:block; }
    .page-header-top{ display:none; }
    .page-header-menu .nav .dropdown-user a.dropdown-toggle{ color:#ffffff; }
	.iffyTip {
    	overflow:hidden;
    	white-space:nowrap;
    	text-overflow:ellipsis;
    	width: 100px;
    	cursor:pointer;
	}
	.iffyTip2 {
    	overflow:hidden;
    	white-space:nowrap;
    	text-overflow:ellipsis;
    	width: 111px;
    	cursor:pointer;
	}
    .iffyTip3 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 135px;
        cursor:pointer;
    }
    .iffyTip4 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 159px;
        cursor:pointer;
    }
    .iffyTip5 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 173px;
        cursor:pointer;
    }
    .iffyTip8 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 220px;
        cursor:pointer;
    }
}

/* Tablets (landscape) */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
   .page-header-top{ display:none; }

    .iffyTip {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 100px;
        cursor:pointer;
    }
    .iffyTip2 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 150px;
        cursor:pointer;
    }
    .iffyTip3 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 200px;
        cursor:pointer;
    }
    .iffyTip4 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 250px;
        cursor:pointer;
    }
    .iffyTip5 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 300px;
        cursor:pointer;
    }
    .iffyTip8 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 220px;
        cursor:pointer;
    }
    .table-responsive{min-height:.01%;overflow-x:auto; }
}

/* Tablets (portrait) */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
    .page-header-top{ display:none; }
    #top-menu-search{ width: 739px; }
    #logo-2 img{ margin-left: 15px;}

    .iffyTip {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 100px;
        cursor:pointer;
    }
    .iffyTip2 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 150px;
        cursor:pointer;
    }
    .iffyTip3 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 200px;
        cursor:pointer;
    }
    .iffyTip4 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 250px;
        cursor:pointer;
    }
    .iffyTip5 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 300px;
        cursor:pointer;
    }
    .iffyTip8 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 220px;
        cursor:pointer;
    }
    .table-responsive{min-height:.01%;overflow-x:auto; }
}

/* Smartphones (landscape) */
@media only screen and (max-width : 321px) {

    .page-header-top{ display:none; }
    #s2id_search_cliente{ width: 100%; }

    .iffyTip {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 100px;
        cursor:pointer;
    }
    .iffyTip2 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 150px;
        cursor:pointer;
    }
    .iffyTip3 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 200px;
        cursor:pointer;
    }
    .iffyTip4 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 250px;
        cursor:pointer;
    }
    .iffyTip5 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 300px;
        cursor:pointer;
    }
    .iffyTip8 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 220px;
        cursor:pointer;
    }
}

/* Smartphones (portrait) */
@media only screen and (max-width : 400px) {
    #laboratorio li.lab{ width: 80px; float: left; }
    .item{ float:none; width: 100%; }
    .portlet.calendar .fc-button {
        color:#000000; top:0;
    }
    #calendar{ margin-top: 20px; }
    .page-h eader-top{ display: block; }
    #logo-2{ display:none; }
    .table-responsive{ display:block; }
    #top-menu-search{ width: 100%; }
    .top-menu{ float: none;}

    .iffyTip {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 100px;
        cursor:pointer;
    }
    .iffyTip2 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 150px;
        cursor:pointer;
    }
    .iffyTip3 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 200px;
        cursor:pointer;
    }
    .iffyTip4 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 250px;
        cursor:pointer;
    }
    .iffyTip5 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 300px;
        cursor:pointer;
    }
    .iffyTip8 {
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        width: 220px;
        cursor:pointer;
    }
    .table-responsive{min-height:.01%;overflow-x:auto; }
}
#producto_1 .item, #producto_2 .item {
    float: left;
    width: 298px;
}
#producto_3 .item{
    float: left; width: 300px; padding: 10px;
}
.page-header-top{ background: #6d6d6c; }
img.svg { fill: #b9c9d4; }
.svg path {
  fill: #ff0000;
}
.btn-is-disabled {
  pointer-events: none; /* Disables the button completely. Better than just cursor: default; */
  @include opacity(0.7);
}
#field_opcion5{ background: #cccccc; padding: 10px; }
#form_pedido_1.col-md-11{padding-right: 0; padding-left: 0;}
#priori.col-md-3{padding-right: 0; padding-left: 0;}
.title_opcion{     display: block;
    text-align: end;
    position: absolute;
    top: -9px;
    background: white;
    width: 85px;
    right: 30px;
    float: right; }
.opcion_6.box{
    border: 1px solid #cccccc;
    padding: 10px;
    position: relative;
}
.dataTables_filter{ height: 40px; }
#check_online{ float: right; }
#diseno{ left: 144px; }

/* Styles for verification */
#pswd_info ul{
    list-style:none;
    margin-left: 0px;
    padding-left: 0px;
}
#pswd_info {
    position:absolute;
    bottom:30px;
    /*bottom:-212px;*/
    /*right:55px;*/
    width:377px;
    padding:15px;
    background:#fefefe;
    font-size:.875em;
    border-radius:5px;
    box-shadow:0 1px 3px #ccc;
    border:1px solid #ddd;
    display:none;
    z-index:4;
}
#pswd_info::before {
    content: "\25B2";
    position:absolute;
    top:-12px;
    left:45%;
    font-size:14px;
    line-height:14px;
    color:#ddd;
    text-shadow:none;
    display:block;
}
#pswd_info h4 {
    margin:0 0 10px 0;
    padding:0;
    font-weight:normal;
    font-size:14px;
  color: #000000;
}

.invalid {
    padding-left:22px;
    line-height:24px;
    color:#ec3f41;
}
.valid_p {
    padding-left:22px;
    line-height:24px;
    color:#3a7d34;
}
#msg {
    border-radius: 5px;
    display: block;
    font-size: 10px;
    text-align: center;
    position: absolute;
    background: #a94442;
    top: 68px;
    width: 160px;
    left:40%;
    padding: 7px 10px;
    color: #fff;
}
#msg:after {
    right: 50%;
    top: -8px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: #a94442;
    border-width: 8px;
    margin-top: -8px;
}

.t1_tag{
    display: inline-block;
    padding: 10px;
    text-align: center;
    background: #969494;
    margin: 2px;
    border-radius: 3px;
    cursor: pointer;
    font-size:20px;
}

.t1_tag_selected{
    background: #E74C3C;
    color:#ffffff;
}

#tag_single_select{
  width: 300px;
  margin-left: auto;
  margin-right: auto;
}
#month{ font-size: 40px; line-height: 30px; padding-top:70px; text-transform: uppercase;text-align: center; color:#ffffff;}
#dayOfWeek{ font-size: 27px; text-align: center;}
#day{ text-align: center; font-size: 62px; line-height: 31px; color: #787878;}
#year{ text-align: center; font-size: 19px;}
#date{
  background: url("../../img/calendar.f579de005aa4.png");
  width: 200px;
  height: 251px;
  margin-left: auto;
  margin-right: auto;
}
#clock{
  align-items: center;
  -webkit-align-items: center;
  justify-content: space-around;
  -webkit-justify-content: space-around;
  margin-top:77px;
  margin-left: 32px;
}
#hours,#seconds{ background: url("../../img/box_hour.d92a3a6f6c22.png") no-repeat; }
#minutes,#ampm{ background: url("../../img/box_minute.03588c725e26.png") no-repeat; }
#cedula{ border:1px solid #5d5e5e;}
#field_contacto{ margin-top: 30px;}
.unit{
  color: #5d5e5e;
  font-family: "Open Sans", sans-serif;
  font-size: 4.2em;
  height: 120px;
  line-height: 130px;
  text-align: center;
  text-shadow: 0 2px 2px #666;
  width: 131px;
  float: left;
}
.button_clock{ border: 0; width: 120px; height: 120px; cursor: pointer;}
#btn_1{ background: url("../../img/btn_1.63751704496c.png") no-repeat; }
#btn_2{ background: url("../../img/btn_2.7533e248bfea.png") no-repeat; }
#btn_3{ background: url("../../img/btn_3.c191b9963e5c.png") no-repeat; }
#btn_4{ background: url("../../img/btn_4.0e8693f67606.png") no-repeat; }
.modal-xlg{
    width: 98%;
}
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
    .modal-xlg{
        width: 93%;
    }

    .circleTracking {
        border-radius: 50%;
        display: inline-block;
        margin-right: 0px;
        width: 32%;
        height: 80px;
    }
    .circleTracking label:first-child {
        font-size: 39px;
        height: 29px;
        margin-top: 15px;
    }
    .circleTracking label:last-child {
        font-weight: bold;
        padding-top: 0px;
        font-size: 12px;
    }
    .num_tracking{
        width: 100%;
    }
    #listado_procesos_tracking li {
        display: block;
    }
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px)and (max-device-width : 1024px) and (orientation : portrait) {
/* Styles */
}

/* Desktops and laptops ----------- */
@media only screen and (min-width : 1224px) {
    .modal-xlg{
        width: 98%;
    }

    .circleTracking {
        border-radius: 50%;
        display: inline-block;
        margin-right: 20px;
        width: 150px;
        height: 150px;
    }
    .circleTracking label:first-child{ font-size: 60px; height: 33px; margin-top: 43px;}
    .circleTracking label:last-child{ font-weight: bold; padding-top: 10px; font-size: 20px; }
    .num_tracking{
        width: 50%;
    }
    #listado_procesos_tracking li {
        display: inline-grid;
    }
}

/* Large screens ----------- */
@media only screen and (min-width : 1824px) {
    .modal-xlg{
        width: 98%;
    }

    .circleTracking {
        border-radius: 50%;
        display: inline-block;
        margin-right: 20px;
        width: 150px;
        height: 150px;
    }
    .circleTracking label:first-child{ font-size: 60px; height: 33px; margin-top: 43px;}
    .circleTracking label:last-child{ font-weight: bold; padding-top: 10px; font-size: 20px; }
    .num_tracking{
        width: 50%;
    }
    #listado_procesos_tracking li {
        display: inline-grid;
    }
}

/* iPhone 4 ----------- */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}

/* ===== Gestion de accesos rediseñada (2026-08) ===== */
.accesos-wrap { --oro:#e0a800; --borde:#e5e5e5; --gris:#777; --verde:#4a8b5c; --azul:#3d7ab5; }
.accesos-top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.accesos-titulo { margin:0 0 3px; font-size:20px; }
.accesos-sub { margin:0; color:var(--gris); font-size:13px; }
.accesos-layout { display:grid; grid-template-columns:300px 1fr; gap:18px; align-items:start; }
@media (max-width:820px){ .accesos-layout{ grid-template-columns:1fr; } }
.accesos-card { background:#fff; border:1px solid var(--borde); border-radius:8px; }
.accesos-card-cab { padding:12px 15px; border-bottom:1px solid var(--borde); display:flex; justify-content:space-between; font-size:12px; text-transform:uppercase; letter-spacing:.6px; color:var(--gris); font-weight:700; }
.accesos-cuenta-total { color:#aaa; }
.accesos-buscar { position:relative; margin:11px 13px; }
.accesos-buscar .fa { position:absolute; left:11px; top:50%; transform:translateY(-50%); color:#bbb; font-size:13px; }
.accesos-buscar input { width:100%; padding:8px 10px 8px 32px; border:1px solid #ddd; border-radius:6px; font-size:14px; }
.accesos-roles { list-style:none; margin:0; padding:5px; max-height:520px; overflow:auto; }
.accesos-roles li { padding:9px 11px; border-radius:6px; cursor:pointer; display:flex; align-items:center; gap:9px; font-size:14px; }
.accesos-roles li:hover { background:#f7f6f3; }
.accesos-roles li.activo { background:#fbf3dd; font-weight:600; }
.accesos-roles li.accesos-cargando { color:#aaa; cursor:default; justify-content:center; }
.accesos-roles li.accesos-cargando:hover { background:none; }
.pt { width:8px; height:8px; border-radius:50%; flex:none; }
.pt.ext { background:var(--azul); } .pt.int { background:var(--verde); }
.accesos-roles .cuenta { margin-left:auto; font-size:12px; color:#aaa; }
.accesos-leyenda { padding:10px 14px; border-top:1px solid var(--borde); font-size:11px; color:var(--gris); display:flex; flex-direction:column; gap:4px; }
.accesos-leyenda .pt { display:inline-block; margin-right:5px; vertical-align:middle; }
.accesos-vacio { padding:60px 20px; text-align:center; color:#bbb; }
.accesos-vacio .fa { font-size:30px; margin-bottom:10px; }
.accesos-detalle-cab { padding:16px 18px; border-bottom:1px solid var(--borde); display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; }
.accesos-detalle-cab h3 { margin:0 0 5px; font-size:18px; }
.accesos-badge { font-size:12px; font-weight:600; padding:3px 9px; border-radius:100px; }
.accesos-badge.ext { background:#eaf1f8; color:var(--azul); }
.accesos-badge.int { background:#eaf3ec; color:var(--verde); }
.accesos-seccion { padding:16px 18px; border-bottom:1px solid var(--borde); }
.accesos-seccion:last-child { border-bottom:none; }
.accesos-seccion h4 { font-size:14px; margin:0 0 3px; }
.accesos-seccion-sub { color:var(--gris); font-size:13px; margin:0 0 12px; }
.accesos-tipo-box { display:flex; align-items:center; gap:12px; background:#f7f6f3; border:1px solid var(--borde); border-radius:7px; padding:12px 14px; }
.accesos-tipo-box .ico { width:32px; height:32px; border-radius:7px; display:grid; place-items:center; flex:none; font-size:15px; }
.accesos-tipo-box.ext .ico { background:#eaf1f8; color:var(--azul); }
.accesos-tipo-box.int .ico { background:#eaf3ec; color:var(--verde); }
.accesos-tipo-box strong { display:block; font-size:14px; }
.accesos-tipo-box span { color:var(--gris); font-size:12.5px; }
.accesos-tipo-box .candado { margin-left:auto; font-size:11px; color:#aaa; white-space:nowrap; }
.accesos-arbol { min-height:60px; }
.accesos-arbol .jstree-anchor { font-size:14px; }

/* Ajustes de integracion de la pantalla de accesos en el theme */
.accesos-wrap { padding:4px 2px; }
.accesos-wrap .btn.yellow-gold { background:#e0a800; border-color:#e0a800; color:#fff; }
.accesos-wrap .btn.yellow-gold:hover { background:#c99700; border-color:#c99700; }
.accesos-detalle-cab .btn-default[disabled] { opacity:.5; cursor:not-allowed; }
.accesos-arbol .jstree-default .jstree-clicked { background:#fbf3dd; box-shadow:none; border-radius:4px; }
.accesos-arbol .jstree-default .jstree-wholerow-clicked { background:#fbf3dd; }

/* Paginas como tarjetas con switch (reemplaza el arbol de carpetas) */
.accesos-paginas { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px; }
.pagina-card { border:1px solid #e5e5e5; border-radius:8px; background:#fff; }
.pagina-card.on { border-color:#e0a800; background:#fdf6e3; }
.pagina-fila { display:flex; align-items:center; gap:10px; padding:11px 13px; }
.pagina-txt { flex:1; min-width:0; }
.pagina-txt strong { display:block; font-size:13.5px; color:#333; }
.pagina-sub { font-size:11px; color:#999; }
.pagina-ver { font-size:12px; color:#3d7ab5; white-space:nowrap; text-decoration:none; }
.pagina-ver:hover { text-decoration:underline; }
.pagina-sw { width:38px; height:22px; border-radius:100px; background:#ccc; position:relative; flex:none; cursor:pointer; transition:background .15s; }
.pagina-sw::after { content:""; position:absolute; top:2px; left:2px; width:18px; height:18px; border-radius:50%; background:#fff; transition:left .15s; box-shadow:0 1px 2px rgba(0,0,0,.25); }
.pagina-sw.on { background:#e0a800; } .pagina-sw.on::after { left:18px; }
.pagina-hijos { padding:0 13px 11px 26px; display:flex; flex-direction:column; gap:7px; }
.pagina-hijos .pagina-card { background:#faf9f6; }
.pagina-hijos .pagina-fila { padding:8px 11px; }
.accesos-cargando-tarjetas { color:#aaa; font-size:13px; padding:14px; }

/* Toggle de secciones colapsables (Acciones / Ventanas) y su tabla */
.accesos-toggle { color:#333; text-decoration:none; }
.accesos-toggle:hover { color:#e0a800; text-decoration:none; }
.accesos-toggle span { font-size:11px; color:#999; margin-left:4px; }
.accesos-tabla-html table { font-size:12.5px; }

/* Acordeon (Acciones / Ventanas): cabecera clicable evidente */
.accesos-acordeon { padding:0 !important; }
.acordeon-cab { display:flex; align-items:center; gap:12px; padding:14px 18px; cursor:pointer; transition:background .12s; }
.acordeon-cab:hover { background:#faf9f6; }
.acordeon-cab.abierto { background:#fdf6e3; border-bottom:1px solid #f0e4c0; }
.acordeon-txt { flex:1; min-width:0; }
.acordeon-txt strong { display:block; font-size:14px; color:#333; }
.acordeon-txt span { font-size:12.5px; color:#777; }
.acordeon-mas { width:26px; height:26px; border-radius:6px; border:1px solid #ddd; background:#fff; display:grid; place-items:center; color:#888; flex:none; }
.acordeon-cab:hover .acordeon-mas { border-color:#e0a800; color:#e0a800; }
.acordeon-cab.abierto .acordeon-mas { background:#e0a800; border-color:#e0a800; color:#fff; }
.accesos-acordeon .accesos-tabla-html { margin:14px 18px; }

/* Contadores "cuanto tiene marcado este rol" */
.cont-badge { display:inline-block; font-size:11px; font-weight:600; color:#e0a800; background:#fdf6e3; border:1px solid #f0e4c0; border-radius:100px; padding:1px 9px; margin-left:6px; vertical-align:middle; }
.cont-acordeon { font-size:12px; color:#e0a800; background:#fdf6e3; border-radius:100px; padding:2px 10px; white-space:nowrap; flex:none; }
.cont-acordeon.cont-cero { color:#aaa; background:#f2f2f2; }

/* Perfiles como chips de color en la tabla de usuarios */
.perfil-chip { display:inline-block; font-size:11px; font-weight:600; padding:2px 9px; border-radius:100px; margin:1px 2px; white-space:nowrap; }
.perfil-chip.chip-int { background:#eaf3ec; color:#4a8b5c; }
.perfil-chip.chip-ext { background:#eaf1f8; color:#3d7ab5; }

/* Resumen de usuarios (cabecera de gestion-usuarios) */
.usuarios-resumen { display:flex; gap:14px; margin-bottom:16px; flex-wrap:wrap; }
.ur-card { background:#fff; border:1px solid #e5e5e5; border-radius:8px; padding:12px 20px; min-width:120px; text-align:center; }
.ur-num { font-size:24px; font-weight:700; color:#333; line-height:1; }
.ur-lbl { font-size:12px; color:#888; margin-top:4px; text-transform:uppercase; letter-spacing:.5px; }
.ur-activos .ur-num { color:#4a8b5c; }
.ur-inactivos .ur-num { color:#c0563f; }

/* Tabla de Acciones/Ventanas: encabezado y primera columna FIJOS al hacer scroll.
   Asi al desplazarse abajo/al lado siempre se ve que estado y que accion se marca. */
.accesos-tabla-html { max-height:60vh; overflow:auto; border:1px solid #e5e5e5; border-radius:6px; }
.accesos-tabla-html table.main-table,
.accesos-tabla-html table.main-table2 { margin:0; border-collapse:separate; border-spacing:0; }
/* encabezado fijo arriba */
.accesos-tabla-html table.main-table thead th,
.accesos-tabla-html table.main-table2 thead th {
    position:sticky; top:0; z-index:3;
    background:#f5f3ee; border-bottom:2px solid #ddd; font-size:11px; padding:8px 6px; text-align:center; vertical-align:bottom;
}
/* primera columna fija a la izquierda (nombres de acciones/campos) */
.accesos-tabla-html table.main-table .fixed-side,
.accesos-tabla-html table.main-table2 .fixed-side {
    position:sticky; left:0; z-index:2;
    background:#fff; border-right:2px solid #ddd; font-weight:600; font-size:12.5px; white-space:nowrap; padding:6px 12px; text-align:left;
}
/* la esquina (cruce encabezado + primera columna) por encima de todo */
.accesos-tabla-html table.main-table thead th.fixed-side,
.accesos-tabla-html table.main-table2 thead th.fixed-side { z-index:4; background:#f5f3ee; }
/* filas alternas y hover, respetando el fondo de la columna fija */
.accesos-tabla-html table.main-table tbody tr:nth-child(even) td,
.accesos-tabla-html table.main-table2 tbody tr:nth-child(even) td { background:#fafafa; }
.accesos-tabla-html table.main-table tbody tr:nth-child(even) .fixed-side,
.accesos-tabla-html table.main-table2 tbody tr:nth-child(even) .fixed-side { background:#fafafa; }
.accesos-tabla-html table.main-table tbody tr:hover td,
.accesos-tabla-html table.main-table2 tbody tr:hover td { background:#fdf6e3; }
.accesos-tabla-html table.main-table tbody tr:hover .fixed-side,
.accesos-tabla-html table.main-table2 tbody tr:hover .fixed-side { background:#fdf6e3; }
.accesos-tabla-html table.main-table td,
.accesos-tabla-html table.main-table2 td { padding:5px 6px; text-align:center; border-bottom:1px solid #f0f0f0; }
.accesos-tabla-html table.main-table input[type=checkbox],
.accesos-tabla-html table.main-table2 input[type=checkbox] { cursor:pointer; width:16px; height:16px; }

/* Estado de subpaginas en las tarjetas de "Paginas que puede abrir" */
.pagina-sub.sub-todas { color:#4a8b5c; font-weight:600; }
.pagina-sub.sub-algunas { color:#e0a800; font-weight:600; }
.pagina-ver { font-size:12px; color:#3d7ab5; white-space:nowrap; text-decoration:none; cursor:pointer; }
.pagina-ver:hover { text-decoration:underline; }

/* Descripcion de cada ventana en "Ventanas que ve" (a que pantalla corresponde) */
.ventana-desc { display:block; font-size:10.5px; color:#999; font-weight:400; margin-top:1px; white-space:normal; max-width:180px; }

/* Celda de campo sin efecto real en esa ventana (checkbox deshabilitado) */
.campo-sin-efecto { background:#f2f2f2; opacity:0.5; }
.campo-sin-efecto input[type="checkbox"] { cursor:not-allowed; }

/* Modal de vista previa de un perfil (resumen en texto) */
.vp-seccion { margin-bottom:14px; }
.vp-seccion:last-child { margin-bottom:0; }
.vp-seccion h5 { font-size:13px; font-weight:600; margin:0 0 6px; color:#555; }
.vp-lista { list-style:disc; margin:0; padding-left:20px; font-size:13px; color:var(--gris); }
.vp-lista li { margin-bottom:3px; }

/* Agrupacion por lenguaje de negocio dentro de Acciones/Ventanas */
.accesos-grupo-negocio { margin-bottom:18px; }
.accesos-grupo-negocio:last-child { margin-bottom:0; }
.accesos-grupo-cab { font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:#8a7a4a; background:#fdf6e3; border-bottom:1px solid #f0e4c0; padding:8px 12px; }

/* Badges rojos en los botones del dashboard (Rutas coordinadas, Rutas en
   camino, Coordinacion...). Bootstrap 3 define `.btn .badge` -dos clases-,
   que por especificidad le gana a `.badge-danger` del tema y los dejaba
   grises. Se iguala la especificidad para que se vean rojos. */
.btn .badge.badge-danger,
.btn-home .badge.badge-danger { background-color:#F3565D; background-image:none; color:#fff; }