/**** Colores Restyling 2022 ****/
/* verde seco = #8b7f36 */
/* amarillo = #fdd306 */

/*@font-face{
    font-family: 'frutiger';    
    src: url('../fonts/frutiger/frutiger-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/frutiger/frutiger-webfont.woff') format('woff'),
         url('../fonts/frutiger/frutiger-webfont.ttf') format('truetype');         
    font-weight: 500;
    font-style: italic;
}*/

@font-face {
    font-family: 'FrutigerNormalRegular';
    src: url('../fonts/frutiger-webfont.eot');
    src: url('../fonts/frutiger-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/frutiger-webfont.woff') format('woff'),
        url('../fonts/frutiger-webfont.ttf') format('truetype'),
        url('../fonts/frutiger-webfont.svg#FrutigerNormalRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FrutigerItalicRegular';
    src: url('../fonts/fri_____-webfont.eot');
    src: url('../fonts/fri_____-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/fri_____-webfont.woff') format('woff'),
        url('../fonts/fri_____-webfont.ttf') format('truetype'),
        url('../fonts/fri_____-webfont.svg#FrutigerItalicRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FrutigerBoldItalicRegular';
    src: url('../fonts/frbii__r-webfont.eot');
    src: url('../fonts/frbii__r-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/frbii__r-webfont.woff') format('woff'),
        url('../fonts/frbii__r-webfont.ttf') format('truetype'),
        url('../fonts/frbii__r-webfont.svg#FrutigerBoldItalicRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'FrutigerBoldRegular';
    src: url('../fonts/frb_____-webfont.eot');
    src: url('../fonts/frb_____-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/frb_____-webfont.woff') format('woff'),
        url('../fonts/frb_____-webfont.ttf') format('truetype'),
        url('../fonts/frb_____-webfont.svg#FrutigerBoldRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'open_sans';
    src: url('../fonts/open-sans/OpenSans-Bold-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/open-sans/OpenSans-Bold-webfont.woff') format('woff'),
         url('../fonts/open-sans/OpenSans-Bold-webfont.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;

}

@font-face {
    font-family: 'open_sans';
    src: url('../fonts/open-sans/OpenSans-BoldItalic-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/open-sans/OpenSans-BoldItalic-webfont.woff') format('woff'),
         url('../fonts/open-sans/OpenSans-BoldItalic-webfont.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;

}

@font-face {
    font-family: 'open_sans';
    src: url('../fonts/open-sans/OpenSans-Italic-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/open-sans/OpenSans-Italic-webfont.woff') format('woff'),
         url('../fonts/open-sans/OpenSans-Italic-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;

}

@font-face {
    font-family: 'open_sans';
    src: url('../fonts/open-sans/OpenSans-Light-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/open-sans/OpenSans-Light-webfont.woff') format('woff'),
         url('../fonts/open-sans/OpenSans-Light-webfont.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;

}

@font-face {
    font-family: 'open_sans';
    src: url('../fonts/open-sans/OpenSans-LightItalic-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/open-sans/OpenSans-LightItalic-webfont.woff') format('woff'),
         url('../fonts/open-sans/OpenSans-LightItalic-webfont.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;

}

@font-face {
    font-family: 'open_sans';
    src: url('../fonts/open-sans/OpenSans-Regular-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/open-sans/OpenSans-Regular-webfont.woff') format('woff'),
         url('../fonts/open-sans/OpenSans-Regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'open_sans';
    src: url('../fonts/open-sans/OpenSans-Semibold-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/open-sans/OpenSans-Semibold-webfont.woff') format('woff'),
         url('../fonts/open-sans/OpenSans-Semibold-webfont.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;

}

@font-face {
    font-family: 'open_sans';
    src: url('../fonts/open-sans/OpenSans-SemiboldItalic-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/open-sans/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
         url('../fonts/open-sans/OpenSans-SemiboldItalic-webfont.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;

}

html, body {
    font-family: 'open_sans', sans-serif;
    /*font-size: 16px;*/
    /*line-height: 1.5;*/
    background: white;
    font-weight: normal;
}

p, li {
    font-family: 'open_sans', sans-serif;
    /*font-size: 16px;*/
    /*line-height: 1.5;*/
    font-weight: normal;
}

:focus-visible {
    outline: solid 2px #F1C241;
}

.w-auto {
    width: auto !important;
}

strong {
    font-family: inherit;
    font-weight: 700;
}

/************** Agregado por José ***************/
#header {
    background: none;
}
#wrapper{margin:20px auto;width:90%;}
#contenido {width: 80%; margin: 0px auto; background-color: inherit; }
#contenido .central {width: 96%;}
fieldset.fieldset {border: #8b7f36 solid 1px; padding: 15px;}
fieldset.fieldset legend { border-left: 1px solid #8b7f36;border-right: 1px solid #8b7f36;color: #8b7f36;margin-bottom: 10px;padding: 10px;}
#contenido .central h3, #contenido .centralBig h3 {color: #8b7f36;}
#contenido .centralWide h3 {color: #8b7f36!important;}
#contenido .central h2, #contenido .centralBig h2, #contenido .centralWide h2 {
   color: #8b7f36!important; 
   border-bottom: none;
   font-size: 1.3em;    
}

#contenido .central h2, #contenido .centralBig h2, #contenido .centralWide .myCard h2{   
   font-size: 1.1em;
}

form fieldset div { margin-bottom: 4px; }
table th { background-color: #c8b881; }
table tr.odd { background-color: #fff;} 
table tr.even { background-color: #edebeb;} 
.table th { background-color: #c8b881} 

.encabezado {box-shadow: var(--shd,0 0 5px rgba(0,0,0,.7));  right: 0; text-align: center; width: 100%;}
.row {margin-left: -15px;margin-right: -15px;}
.ui-megamenu-root-list {margin-bottom: 0px;}
.imgdgr{height:95px;left:0;object-fit:cover;width:328px;margin:10px 0;}
.facebook,.instagram,.twitter{height:39px;object-fit:cover;width:39px;vertical-align:initial;}
.ticketon,.app_ticketon {object-fit:contain;position:relative;cursor:pointer}
.ticketon{left:0;width:88px;vertical-align:initial;border-radius: 5px}
.app_ticketon{left:0;top:2px;width:225px;vertical-align:initial;}
.img-holder {object-fit:contain;position:relative}
.redes-sociales{ margin-top:52px;text-align:right;}
a,abbr,acronym,address,applet,b,big,blockquote,body,button,caption,center,cite,code,dd,del,dfn,div,dl,dt,em,fieldset,font,footer,form,h1,h2,h3,h4,h5,h6,header,html,i,iframe,img,ins,kbd,label,legend,li,nav,object,ol,p,pre,q,s,samp,section,small,span,strike,strong,sub,sup,table,tbody,td,tfoot,th,thead,title,tr,tt,u,ul,var{background:transparent;border:0;margin:0;outline:0;padding:0;vertical-align:initial}
.titulo-opciones { background-color: #f3e9c1; box-shadow: var(--shd,0 1px 4px rgba(0,0,0,.6)); padding: 6px 0 8px 0; position: relative; width: 100%}
.titulo-span-opciones{font-size:22px;font:normal normal normal 22px Open Sans,sans-serif;left:0;position:relative;vertical-align:middle; }
.color_footer { align: center; background-color: #5f5e61; }
.cuadro-footer{left:20px;position:relative;margin-top:50px; margin-bottom: 40px;}
.titulo_h5{color:#fff;font-size:18px;font:normal normal normal 20px/1.2em Open Sans,sans-serif;width:200px}
.label_h6{color:#fff; font-size:15px;}
a.register:link, a.register:visited { color: #000; font-weight: 400; text-decoration: none;}
.group-items{margin-top:10px;text-align:left}
.footer-item {margin: 10px 0;}
.logodgr{text-align:left;}

table {
  border:1px solid gray;
  border-collapse: separate;
  border-spacing: 1px;
}
table td {
  border-left: 1px solid white;
  border-right: 1px solid white;
}
table tr:first-child td {
  border-top: 0;
}
table tr td:first-child {
  border-left: 0;
}
table tr:last-child td {
  border-bottom: 0;
}
table tr td:last-child {
  border-right: 0;
}
table th {
  border: 1px solid white; 
}
table.custom_table tr:nth-child(even) { background-color: #edebeb;}
table.custom_table tr:nth-child(odd) { background-color: #fff;}

.button { text-align: center; text-decoration: none; text-transform: none; font-family: Helvetica Neue,Helvetica,Arial,sans-serif; }
.btn-primary{background-color:#fdd306!important;;border-color:#fdd306!important;color:#333!important}
.btn-primary.focus,.btn-primary:focus{background-color:#f4cb64;border-color:#122b40;color:#5f5e61!important}
.btn-primary:hover{background-color:#f4cb64!important;border-color:#f4cb64!important;color:#5f5e61!important}
.btn-primary.active,.btn-primary:active,.open>.dropdown-toggle.btn-primary{background-color:#f4cb64!important;background-image:none;border-color:#f4cb64!important;color:#fff}
.btn-primary.active.focus,.btn-primary.active:focus,.btn-primary.active:hover,.btn-primary:active.focus,.btn-primary:active:focus,.btn-primary:active:hover,.open>.dropdown-toggle.btn-primary.focus,.open>.dropdown-toggle.btn-primary:focus,.open>.dropdown-toggle.btn-primary:hover{background-color:#204d74;border-color:#122b40;color:#fff}
.btn-primary.disabled.focus,.btn-primary.disabled:focus,.btn-primary.disabled:hover,.btn-primary[disabled].focus,.btn-primary[disabled]:focus,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary.focus,fieldset[disabled] .btn-primary:focus,fieldset[disabled] .btn-primary:hover{background-color:#337ab7;border-color:#2e6da4}
.btn-primary .badge{background-color:#fff;color:#337ab7}


/************** Fin Agregado por José ***************/
body {
   display: flex;
   flex-direction: column;
   min-height: 100vh;
 }
 #wrapper {
   flex-grow: 1;
 }

#contenido .margin-auto {
    margin: auto;
}
#contenido .central {
    padding-top: 0;
    margin-left: auto;
    width: auto;
    float: none;
}

#contenido .centralWide {
    padding: 0;
    float: none;
}

#contenido .central h2 {
    border-bottom: none;
}

#contenido h3,
#contenido .centralWide h3 {
    font-family: "open_sans", sans-serif;
    font-size: 20px;
    color: #1E1E1F;
    margin-bottom: 20px;
}

#contenido .central h4, 
#contenido .centralBig h4, 
#contenido .centralWide h4 {
    font-family: "open_sans", sans-serif;
    font-size: 18px;
    line-height: 1.5;
    color: #1E1E1F;
}

#contenido .central h2:first-child, 
#contenido .centralBig h2:first-child, 
/*#contenido .centralWide h2:first-child {
    display: none;
}*/

#contenido .no-border {
    border: none;
}

#contenido .top-space {
    margin-top: 10px;
}

.bloque_datos {
    clear: none;
    padding-bottom: 20px;
    margin: 0;
    /*border-bottom: solid 1px #5F5E61; */
}

.bloque_datos_fix {
    padding-bottom: 10px;
    padding-top: 10px;
}
.custom_bloque_datos .bloque_datos {
    border: none!important;
}

.bloque_datos:after {
    clear: both;
    content: "";
    display: block;
}
fieldset .bloque_datos {
    border-bottom: none;
}

.body_reporte .bloque_datos {
    padding-bottom: 10px;
    padding-top: 10px;
}
.body_reporte th {
    font-size: 12px;
}

.button_flex_text, .btn, button:not(.btn-close) {
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    margin-bottom: 0;
    padding: 6px 12px;
    text-align: center;
    touch-action: manipulation;
    -webkit-user-select: none;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    background-color: #ffc107!important;
    border-color: #ffc107!important;
    color: #333!important;
    height: auto;
    font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
}

.button_flex_text:hover, .btn:hover, button:not(.btn-close):hover {
    background-color: #ffca2c!important;
    border-color: #ffc720!important;
    color: #5f5e61!important;
}

.button_flex_text_cancel, .btn_cancel{
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    margin-bottom: 0;
    padding: 6px 12px;
    text-align: center;
    touch-action: manipulation;
    -webkit-user-select: none;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    background-color: #dc3741!important;
    border-color: #dc3741!important;
    color: #fff!important;
    height: auto;
    font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
}

.button_flex_text_cancel:hover, .btn_cancel:hover {
    background-color: #c6313a!important;
    border-color: #c6313a!important;
    color: #fff!important;
}


table th {
    color: #1E1E1F;
    font-size: 16px;
    font-family: Tahoma, sans-serif;
    text-align: left;
    font-weight: 500;
}

table td {
    color: #1E1E1F;
    font-size: 12px!important;
    font-family: Tahoma, sans-serif;
    text-align: left;
    font-weight: 500;
}

table td p {
    margin-bottom: 0;
}

table .tbody td .button_flex_text {
    padding: 5px;
    line-height: 1;
    font-size: 10px;
}

.tabla-resultados td {
    background-color: white;
}

.tabla-resultados tr.even td {
    background-color: #EDEDED;
    padding: 10px 30px;
}

.tabla-resultados td {
    padding: 10px 30px;
}

input[type=text]:not(.calendars-month-year),
input[type=email],
input[type=number]:not(.calendars-month-year),
input[type=password],
select:not(.calendars-month-year), 
textarea {
    background: #fff;
    color: #1E1E1F;
    font-size: 14px;
    transition: border-color .2s,box-shadow .2s;
    border-radius: 4px;
    /* appearance: none; */
    border: 1px solid #a6a6a6 !important;
    padding: 5px 10px;
    transition: border-color .2s,box-shadow .2s;
}

#message_box .error_text {
    box-shadow: none;
    border-radius: 4px;
    padding: 20px;
    font-size: 18px;
}

#message_box .error_text p {
    margin-bottom: 0;
    font-size: 18px;
}

#message_box .warning_text {
    box-shadow: none;
    border-radius: 4px;
    padding: 20px;
    font-size: 18px;
    background-color: #EDEDED;
    color: #1E1E1F;
}

#message_box .warning_text p {
    margin-bottom: 0;
    font-size: 18px;
}

#message_box .novedades { background-color: #8B7F36; color: #000;}
#message_box .novedades { box-shadow: 0 0 5px #8B7F36;-khtml-box-shadow: 0 0 5px #8B7F36; -webkit-box-shadow: 0 0 5px #8B7F36; -moz-box-shadow: 0 0 5px #8B7F36;}

input[type=text]:not(.calendars-month-year),
input[type=email],
input[type=number]:not(.calendars-month-year),
input[type=password],  
textarea {
    padding: 5px 10px;
}

input[type=text]:not(.calendars-month-year),
input[type=email],
input[type=number]:not(.calendars-month-year),
input[type=password], 
select:not(.calendars-month-year) {
    height: 34px !important;
    line-height: 1.5;
    width: 100%;
}
.custom_fix fieldset td input {
    //width: 90%;
}

.curve {
    border-radius: 4px !important;
}

select:not(.calendars-month-year) {
    width: 100%;
}

input[type=text]:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=password]:focus,
select:focus,
textarea:focus {
    border-color: #e8d689;
    box-shadow: 0 0 0 0.2em #F1C241;
}

input[type=text]:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=password]:focus,
select:hover,
textarea:hover {
    border-color: #e8d689;
    box-shadow: 0 0 0 0.2em #f3e9c1;
}

input[type=text],
input[type=email],
input[type=number],
input[type=password] {
    width: 100%;
}

.itemListado {
    padding: 10px 0;
    display: flex;
    align-items: center;
}

.itemListado .celda .button {
    margin-left: 5px;
    margin-right: 5px;
}

#contenido .central #menu_interno ul li {
    color: #1E1E1F;
    font-family: "open_sans", sans-serif;
    font-size: 18px;
    line-height: 1.5;
    padding: 0;
    background: none;
    position: relative;
    padding-left: 40px;
}

#contenido .central #menu_interno ul li a {
    color: #000000!important;
}

#contenido .central #menu_interno ul li:before {
    content: "";
    background-image: url(../images/icon__play.svg);
    width: 27px;
    height: 27px;
    background-size: cover;
    position: absolute;
    left: 0;
}

#contenido .central #menu_interno ul li a:hover {
    text-decoration: underline;
    color: #000000;
}

#contenido .central #menu_interno {
    margin: 50px 0 30px;
    padding-left: 0;
    padding-right: 0;
}

#contenido .central #menu_interno ul.left {
    float: none;
    margin: 0;
    list-style-image: none;
}

#contenido .central #menu_interno:after { 
    content: "";
    clear: both;
    display: block;
}
#contenido .centralWide #menu_interno ul li{
    color:#000;
    /*color:#a44641;*/
    font-family: FrutigerNormalRegular;
    font-size:0.93rem;
    line-height:18px;
    padding:15px;
    background: url("../images/linea_division_servicios.png") repeat-x bottom; 
}
#contenido .centralWide #menu_interno ul li a{
    color:#000
}
#contenido .centralWide #menu_interno ul.left{
    list-style-image:url("../images/bullet_negro.png")
}
#contenido .centralWide #menu_interno ul.right{
    list-style-image:url("../images/bullet_negro.png")
}
#wrapper #contenido .centralWide #menu_interno ul li a{
    text-decoration: none;    
}


#wrapper #contenido .centralWide #menu_interno ul li a:hover{
   text-decoration: none;
   color: #555;
}

#contenido a {
    color: #F1C241;
}
#contenido input[type=file] {
    border: none
}

a:hover {
    color: #E4AC11;
}

#menu_interno {
    margin: 70px 0;
}

#periodos_form {
  padding: 20px;  
}

#periodos_form input {
  width: auto;
}

#wrapper_popup form {
    background-color: white;
}

#wrapper_popup #contenido {
    width: auto;
}

#dialog-confirmacion-fecha-pago-central-pago-se, 
#dialog-notificacion-cbu-pago-central-pago-se {
    font-family: 'open_sans', sans-serif;
    font-size: 16px;
    line-height: 1.5;
    font-weight: normal;
    color: white;
    border-radius: 4px;
    padding: 20px;
    font-size: 18px;
    background-color: #a44641;
    margin: 10px 20px;
}


p.botonera {
    display: flex;
    align-items: center;
    justify-content: center;
}

p.botonera .button {
    margin: 0 10px;
}

#wrapper_popup {
    margin: 0;
    min-height: 500px;
    background: white;
}

form fieldset div label {
    text-transform: none;
}

#forma_pago_message {
    color: #777;
    margin-top: 10px;
    font-style: none;
}
#footer {
    text-align: left;
    padding-top: 0;
    background: none;
}

/************** Login ***************/

.login .bigBtns li .itemBtnOuter:hover{
    background-color: #f3e9c1;
    color: #000;
    text-decoration: none;
}
.login .bigBtns li .itemBtnOuter:hover .textoBtn{
    color: #000!important;
    text-decoration: none;
}
.login h1 {
    color: #8b7f36;
}

/************** Header con Clave Fiscal ***************/

.header-con-clave-fiscal {
    display: flex;
    align-items: center;
    height: 10vh;
    text-align: right;
    justify-content: flex-end;
}
.header-con-clave-fiscal a, .header-con-clave-fiscal a:hover {
    color: #8b7f36;
}

/************** Menu ***************/

#contenido .centralWide #online_services ul li{
    color:#000
}
#contenido .centralWide #online_services ul li a{
    color:#000
}
#contenido .centralWide #online_services ul.left{
    list-style-image:url("../images/bullet_negro.png")
}
#contenido .centralWide #online_services ul.right{
    list-style-image:url("../images/bullet_negro.png")
}

/************** Tooltip ***************/

.tipsy-arrow {
    border-top-color: #f4cb64!important;
}
.tipsy-inner {
    background-color: #f4cb64!important;
    color: #000000!important;
}

/************** popups search bar ***************/

#header_reporte .right #titulos_principales {
    margin-top: 30px;
    padding-right: 0;
}
.popup_search_bar {
    padding: 10px;
}
.popup_search_bar .curve {
    width: auto!important;
    margin-left: 10px;
}
.popup_search_bar .center {
    text-align: left;
    display: inline-block;
    font-size: 1.5em;
}

/************** picker adjustment ***************/

.myPicker .calendars-ctrl {
    background-color: #8b7f36
}
.myPicker .calendars-ctrl .calendars-cmd:hover {
    background-color: #f4cb64
}
.calendars-month td .calendars-today {
    background-color: #f4cb64!important
}
.calendars-month td .calendars-highlight {
    background-color: #f5dfa7!important
}

/************** picker adjustment ***************/

#contenido .input_fix input, #contenido .input_fix select {
    width: inherit
}

/************** menu tabs ***************/

#contenido .ui-widget-header {
   border: 1px solid #b1b0b1;
   background: #d3d3d3;
}
#contenido .ui-tabs-selected {
    background: #F1C241;
    border: 1px solid #9f9f9f;
}
#contenido .pestania {
    color: #FFF;
    font-weight: bold;
    border: 1px solid #9f9f9f;
    background: #9f9f9f
}
#contenido .ui-tabs-selected .pestania {
    background: #F1C241;
    color: #000;
    border: none
}
.ui-dialog .ui-dialog-titlebar-close {
    background: #000;
}
.ui-dialog .ui-icon-closethick {
    background-position: -96px -130px;
}

.btn-chat {
  position: fixed;
  bottom: 15px;
  right: 15px;
  z-index: 9;
}

.btn-chat:hover {
  cursor:pointer;
}

.whatsapp {
    height: 39px;
    object-fit: cover;
    border-radius: 6px;
}

.p-grid {
    display: flex;
    flex-wrap: wrap;
    margin-left: -0.5rem;
    margin-right: -0.5rem;
    margin-top: -0.5rem;
}

.p-grid>.p-col,.p-grid>[class*=p-col]{
    box-sizing:border-box
}

.p-col {
    flex-basis: 0;
    flex-grow: 1;
    padding: 0.5rem;
}

.cuadro-footer {
    left: 20px;
    position: relative;
    margin-top: 50px;
    margin-bottom: 40px;
}
.myCard{
    background-color: #f8f9fa;
}


/* ==========================================================================
   PARCHE Nota 21359 - modal "Información Importante" (#infoModalOverlay)
   en paginaPrincipalTasaJusticia.jsp
   ========================================================================== */

:root {
    --fo-color-primary: #fdd306;
    --fo-color-primary-header: #f3e9c1;
    --fo-color-primary-dark: #8b7f36;
    --fo-color-primary-light: #f3e9c1;
    --fo-color-primary-footer: #444444;
    --fo-color-action: #d4a800;
    --fo-color-text-hover: #675E28;
    --fo-color-danger: #bd353e;
    --fo-color-success: #1ed12d;
    --fo-color-shadow-form-focus: rgba(163, 163, 163, 0.4);
    --fo-color-shadow-form-btn-hover: rgba(163, 163, 163, 1);
    --fo-color-secondary: #f3e9c1;
    --fo-color-tertiary: #cdcdcd;
    --fo-color-bg-gray: #f8f9fa;
    --fo-color-text: #2d2d2d;
    --fo-color-text-button: #2d2d2d;
    --fo-color-text-muted: #666666;
    --fo-color-border: #eeeeee;
    --fo-color-white: #ffffff;
    --fo-color-header-bg: #ebebeb;
    --fo-color-text-alt: #525252;
    --fo-color-main-bg: #F1F5F9;
    --fo-color-dark-bg: #444444;
    --fo-color-bg_sutil: #f9f9f9;
    /* Enlaces */
    --fo-color-link: #337ab7;
    --fo-color-link-hover: #23527c;
    /* Sombras */
    --fo-shadow-normal: 0 0.375rem 0.75rem rgba(0, 0, 0, 0.06);
    --fo-shadow-hover: 0 1rem 2rem rgba(189, 53, 62, 0.11);
    /*modal de Victor */
    --accent: #f4cb64;
    /*tablas y loader */
    --table-header-bg: #DBE5F4;
    --table-header-text: #2D2D2D;
    --table-border: #CDCDCD;
    --table-row-even: #FFFFFF;
    --table-row-odd: #EBECEF;
    --table-row-hover: #DBDBDB;
    --table-text: #2D2D2D;
    --spinner-color: #BD353E;
    
    /*colores del login*/
    --fo-color-aux-2: #fad935;
    --fo-color-aux-3: #f8df63;
    --fo-color-aux-4: #f5e492;
}

/* Oculto por defecto: esta es la regla clave que falta hoy en producción.
   Sin ella el navegador no sabe que el modal debe estar oculto y lo
   renderiza como un bloque normal al final de la página. */
.info-modal-overlay,
.custom-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 10001;
    display: none;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(4px);
}

.info-modal-overlay.show,
.custom-modal-overlay.show {
    display: flex;
}

.info-modal,
.custom-modal {
    background: var(--fo-color-white);
    border-radius: 6px;
    box-shadow: var(--fo-shadow-hover);
    max-width: 500px;
    width: 90%;
    padding: 0;
    position: relative;
    animation: modalSlideIn 0.3s ease-out;
}

.info-modal-header,
.custom-modal-header {
    background: var(--fo-color-header-bg);
    border-bottom: 2px solid var(--fo-color-primary);
    padding: 1rem 1.5rem;
    border-radius: 6px 6px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.custom-modal-header {
    display: block;
    text-align: center;
}

.custom-modal-header.success {
    background: var(--fo-color-header-bg);
}

.custom-modal-header.error {
    background: #f8d7da;
    border-bottom-color: #dc3545;
}

.custom-modal-header.warning {
    background: #fff3cd;
    border-bottom-color: #ffc107;
}

.info-modal-title,
.custom-modal-title {
    font-size: 1.25rem;
    font-weight: bold;
    color: var(--fo-color-primary);
    margin: 0;
}

.custom-modal-icon {
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 0.75rem;
}

.custom-modal-header.success .custom-modal-icon {
    background: rgba(255, 193, 7, 0.15);
    color: var(--fo-color-primary);
}

.info-modal-body,
.custom-modal-body {
    padding: 1.5rem;
    color: var(--fo-color-text);
    font-size: 1rem;
    line-height: 1.6;
    text-align: center;
}

.custom-modal-body .highlight {
    background: var(--fo-color-header-bg);
    padding: 0.75rem 1rem;
    border-radius: 4px;
    margin: 1rem 0;
    font-weight: bold;
    color: var(--fo-color-primary);
    border-left: 4px solid var(--fo-color-action);
}

.info-modal-footer,
.custom-modal-footer {
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--fo-color-border);
    display: flex;
    justify-content: center;
    gap: 0.75rem;
}

.custom-modal-btn {
    padding: 0.75rem 1.5rem;
    border-radius: 4px;
    font-weight: bold;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
    border: none;
    min-width: 120px;
}

.custom-modal-btn.primary {
    background-color: var(--fo-color-primary);
    color: var(--fo-color-white);
}

.custom-modal-btn.primary:hover {
    background-color: var(--fo-color-action);
    transform: translateY(-2px);
    box-shadow: var(--fo-shadow-hover);
}

.custom-modal-btn.secondary {
    background: var(--fo-color-bg-gray);
    color: var(--fo-color-text-alt);
    border: 1px solid var(--fo-color-border);
}

.custom-modal-btn.secondary:hover {
    background: var(--fo-color-border);
}

@keyframes modalSlideIn {
    from {
        opacity: 0;
        transform: translateY(-20px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* ==========================================================================
   boton Novedades
   ========================================================================== */

.btn-novedades {
    background-image: none;
    border: 1px solid transparent;
    border-radius: 10px;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    margin: 14px 0px;
    padding: 6px 12px;
    text-align: center;
    touch-action: manipulation;
    -webkit-user-select: none;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    height: auto;
    font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
    text-decoration: none;
}

.btn-novedades:hover {
    text-decoration: none;
}

.btn-con-novedades {
    background-color: #98B7D6;
    border-color: #98B7D6;
    color: #007ad9 !important;
    outline: 2px solid #98B7D6;
    outline-offset: 2px;
}

.btn-con-novedades:hover {
    background-color: #007ad9;
    border-color: #007ad9;
    color: #98B7D6 !important;
    outline: 2px solid #007ad9;
    outline-offset: 2px;
}

.btn-sin-novedades {
    background-color: #CBCBCB;
    border-color: #CBCBCB;
    outline: 2px solid #CBCBCB;
    outline-offset: 2px;
}

.btn-sin-novedades:hover {
    background-color: #f3e9c1;
    border-color: #f3e9c1;
    color: #333 !important;
    outline: 2px solid #f3e9c1;
    outline-offset: 2px;
}

.blink {
    animation: blinker 2s linear infinite;
}

@keyframes blinker {
    50% {
        opacity: 0;
    }
}


.menu-corporativo {
    background: linear-gradient(135deg, var(--fo-color-primary-light) 0%, var(--fo-color-primary-light) 100%) !important;
    border: none !important;
    border-radius: 0 !important;
}

/*.btnSayges-radio {    
    margin-right: 10px;    
	color: white !important;

}
.btnSayges-radio:hover {
	color: #E0E0E0 !important;
} */

/* ==========================================================================
   Nota 21873, JSilva: estilos del modulo Compensaciones (formulario de alta
   manual de obligaciones/deudas). Estaban duplicados de forma identica en el
   <style> inline de saldoAfavor.jsp, saldoRemanente.jsp y deudaAcompensar.jsp;
   se centralizan aca. El <style> de esos 3 JSP quedo comentado (no borrado),
   con una referencia a esta seccion.
   ========================================================================== */
.msj-validacion{ font-size:smaller}

.formulario {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.formulario__label {
    display: block;
    font-weight: 700;
    padding: 10px;
    cursor: pointer;
}

.formulario__grupo-input {
    position: relative;
}

.formulario__input {
    width: 100%;
    background: var(--fo-color-white);
    border: 3px solid transparent;
    border-radius: 3px;
    height: 45px;
    line-height: 45px;
    padding: 0 40px 0 10px;
    transition: .3s ease all;
}

.formulario__input:focus {
    border: 3px solid var(--fo-color-link);
    outline: none;
    box-shadow: 3px 0px 30px var(--fo-color-shadow-form-focus);
}

.formulario__input-error {
    font-size: 12px;
    margin-bottom: 0;
    display: none;
    color: var(--fo-color-danger);
}

.formulario__input-error-activo {
    display: block;
}

.formulario__validacion-estado {
    position: absolute;
    right: 10px;
    bottom: 15px;
    z-index: 100;
    font-size: 16px;
    opacity: 0;
}

.formulario__btn {
    height: 45px;
    line-height: 45px;
    width: 30%;
    background: var(--fo-color-text);
    color: var(--fo-color-white);
    font-weight: bold;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    transition: .1s ease all;
}

.formulario__btn:hover {
    box-shadow: 3px 0px 30px var(--fo-color-shadow-form-btn-hover);
}

/* ----- -----  Estilos para Validacion ----- ----- */
.formulario__grupo-correcto .formulario__validacion-estado {
    color: var(--fo-color-success);
    opacity: 1;
}

.formulario__grupo-incorrecto .formulario__label {
    color: var(--fo-color-danger);
}

.formulario__grupo-incorrecto .formulario__validacion-estado {
    color: var(--fo-color-danger);
    opacity: 1;
}

.formulario__grupo-incorrecto .formulario__input {
    border: 3px solid var(--fo-color-danger) !important;
}

/* ----- -----  Mediaqueries ----- ----- */
@media screen and (max-width: 800px) {
    .formulario {
        grid-template-columns: 1fr;
    }
    .formulario__btn {
        width: 100%;
    }
}

/*modal de Finalizar Solicitud al 95% del ancho de pantalla*/
.modal-95 {
    max-width: 95% !important;
}
/* Fin Nota 21873, JSilva */
