/*--------------------------elements generals----------------------------------------------*/
/*oolor fons pantalla( box-body): #FCF6EE*/
/*separacions interiors(legends,voreres....) :#f5c586
/*oolor taronja oscur (borders warning,...): #f39c12;)*/

a {
    color: #02466c;
}

fieldset {
    margin: 0 0 20px;
}

/*color required: rgb(255, 245, 215)   FFF5D7*/

::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px #808080; /*grey*/
    border-radius: 7px;
}

::-webkit-scrollbar-thumb {
    background: #3c8dbc;
    border-radius: 7px;
}

::-webkit-scrollbar-thumb:hover {
    background: #335d83;
}
/* contenidor de cada pàgina que carregam dins el contenidorIframe  */
.contenidorPrincipal{padding-top:40px;}

.fotoPersona {
    margin: 10px auto 10px auto;
    border: 1px solid #91a7b4;
    width: 112px;
    height: 150px
}

.contenidorPrincipal div.box.box-warning  {
    box-shadow:none ;
}
.contenidorPrincipal div.box.box-warning .box-header.with-border  {
    border-bottom: none;
}


.contenidorWindow {padding: 0}
/* contenidor principal de base.jsp  */
#contenidorIframe  {
    position:relative;
    padding: 20px 0 0;
    height:95%;
}
#divMenu {
    padding-top:60px;
    width:100%;
}
.dadesCapcelera {float:left;color: #fff;padding-top: 15px;padding-bottom: 15px;line-height: 20px;}
.jqmOverlay{background-color:#ece9d8;}
.selectpicker {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: white;
}

select.selectpicker[required]{
    background-color: rgb(255, 245, 215);
}

select.selectpicker[disabled], select.selectpicker[readonly]{
    background-color: #eee;
    opacity: 0.65;
}



.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    border-bottom:  1px solid #eee;     /* Vora horitzontal més suau */
    border-right:  none;                /* Eliminam les vores verticals */
    padding: 6px 10px;
    text-overflow: ellipsis;
    font:normal 14px 'Source Sans Pro','Helvetica Neue',Helvetica,Arial,sans-serif;
    vertical-align: middle;
}

table tbody tr.selected {
    color: #000!important;
    background-color: #fdeec9!important;
}

.tdBotoMenuPrincipal{ padding :0 !important ;border:none !important;}      /* td contenidors dels buttons del menu principal*/


.table-hover > tbody > tr:hover {
    background-color: #fff9f0; /* Un color de fons molt suau en passar el ratolí */
}

.table-hover > thead > tr> th:hover {
    border-color:#ddd;
    background-color:#F3BA6E;
}

.table > thead > tr > th, .table > tfoot > tr > th {
    background-color: #f5c586;
    font-weight: 600; /* Semi-negreta, més modern */
    border-bottom: 2px solid #e0a961; /* Vora inferior més marcada */
    color: #333;
    vertical-align: middle;
}

table > thead > tr > th.gridCheck {
    padding: 2px 2px 2px 2px;
    width: 18px;
}

table > tbody > tr > td.gridCheck {
    padding: 2px 2px 2px 2px;
    width: 18px;
}

table > thead > tr > th.rowNumberer {
    text-align: right;width:20px; padding:4px 3px 4px 5px
}

table > tbody > tr > td.rowNumberer {
    text-align: right;width:20px;; padding:4px 3px 4px 5px
}


.table-bordered {
    border-collapse: collapse;
}

.table-bordered > thead > tr > th{
    border:  1px solid #ddd !important;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #fbe8d0; /* Un color taronja molt suau per a més contrast a les fileres */
}
.table-striped > tbody > tr.bg-ra-senar > td { background-color: #fbe8d0 !important; }
.table-striped > tbody > tr.bg-ra-parell > td { background-color: #ffffff !important; }

.filaimpar{
    background-color: #fbe8d0; /* Un gris molt clar per a les files alternes */
}

/* --- Estils modernitzats per a botons --- */
.btn {
    margin: 5px;
    border-radius: 4px;
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 600;
    transition: all .15s ease-in-out;
    height: 34px; /* Assegura alçada consistent */
    line-height: 1.42857143; /* Alineació vertical del text */
    border: 1px solid transparent;
}

/* Restauram la mida per als botons grans (.btn-lg) per sobreescriure l'alçada fixa de .btn */
.btn.btn-lg {
    height: auto; /* Anul·la l'alçada fixa per permetre que creixi */
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px;
}
/* Restauram la mida per als botons extra-petits (.btn-xs) */
.btn.btn-xs {
    height: auto; /* Anul·la l'alçada fixa per permetre que creixi */
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

/* Els colors de fons, text i vores per a .btn-primary, .btn-default, etc., s'heretaran del tema per defecte. */
.btn-default {
    background-color: #f8f9fa; /* Un fons gris molt clar per diferenciar-lo del fons general */
    border: 1px solid #ccc;     /* Vora visible per definir clarament el botó */
    color: #333;
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active {
    background-color: #e2e6ea !important; /* Fons més fosc en interactuar */
    border-color: #adadad !important;   /* Vora més fosca en interactuar */
    color: #333 !important;
}

/* Estil per a botons deshabilitats */
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
    cursor: not-allowed;
    pointer-events: none; /* Evita que es pugui fer clic */
    opacity: 0.65;
    box-shadow: none;
    background-color: #e9ecef !important; /* Fons gris neutre */
    border-color: #ced4da !important;   /* Vora visible */
    color: #6c757d !important;          /* Text llegible però apagat */
}

/* Oculta els inputs (radio/checkbox) dins de botons-etiqueta per a un disseny net */
label.btn > input[type="radio"],
label.btn > input[type="checkbox"] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}

/* Alineació de botons en files amb camps de formulari.
 * Quan un botó està en una fila al costat de camps amb etiquetes a sobre,
 * aquest marge l'alinea verticalment amb els camps.
 */
.row > div > .btn {
    margin-top: 20px; /* Ajustat per alinear-se amb controls que tenen una etiqueta a sobre */
}

.row{margin-bottom:5px;}

.row_dashed_bottom {
    border-bottom: 1px dashed #F5C586;
}

.dashed_right{
    border-right: 1px dashed #F5C586;
}

.bottom-line{
    padding-top: 2px;
    border-bottom: 2px solid;
    border-color:  #f5c586;
}

/* --- Estils modernitzats per a controls de formulari --- */
.form-control {
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.form-control-warning {
    padding: 6px 12px;
    height: 34px;
    border-color: red
}
label{font-weight: inherit; margin-bottom: 0;}
.negreta{font-weight: bold}

.checkbox, .radio {
    margin-top: 0;
    margin-bottom: 0;
}

.checkbox+.checkbox, .radio+.radio {
    margin-top: 0;
}

.cursor-pointer{cursor: pointer;}
.cursor-not-allowed{cursor: not-allowed;}
.cursor-not-allowed-disabled{cursor: not-allowed;opacity: 0.65}
.padding-left{padding-left: 15px;}
.padding-right{padding-right: 15px;}
.padding-top{padding-top: 10px;}
.padding-bottom{padding-bottom: 10px;}
.no-padding-top{padding-top: 0;}
.no-padding-bottom{padding-bottom: 0;}
.no-padding-right{padding-right: 0;}
.no-padding-left{padding-left: 0;}
.margin-left{margin-left: 15px;}
.margin-right{margin-right: 15px;}
.margin-top{margin-top: 10px;}
.margin-bottom{margin-bottom: 10px;}
.no-margin-top{margin-top: 0;}
.no-margin-bottom{margin-bottom: 0;}
.dNone{display: none}

/*
@-moz-document url-prefix() {
    input[type="checkbox"], input[type="radio"] {
        margin-top: 2px;
    }
}*/

.panel{margin-bottom: 10px;}


.panel-warning > .panel-heading {
    padding: 10px 15px; /* Més espai per a un aspecte més net */
    color: #333333; /* Text fosc per a bona llegibilitat i un aspecte més neutre */
    background-color: #f5c586; /* Color taronja suau, consistent amb les capçaleres de les taules */
    border: none; /* Eliminam la vora per defecte per controlar-la nosaltres */
    border-bottom: 1px solid #e0a961; /* Vora una mica més fosca per donar profunditat */
    font-weight: 600; /* Un pes de font semi-negreta */
}
.panel-heading, .panel-body {
    padding: 2px 15px;
}
.panel-warning > .panel-body { padding: 15px; } /* Donam al cos del panell el mateix padding per a consistència */
.panel-group {
    margin-bottom: 10px;
}

.input-group .form-control {position: static;}
.input-group[disabled], .form-control[disabled], .form-control[readonly] {opacity: 0.65}

.input-group .input-group-addon {
    border-radius: 0;
    border-color: #d2d6de;
    background-color: #fff;
}

.input-group-addon {
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
}

.modal-absolute{position: absolute}
.modal-fixed{position: fixed}

/*Estils taules extjs*/
/*.x-grid3-hd{background-color: #f5c586; font-weight: bold; border: 1px solid #f4f4f4;padding: 5px}*/
/*.x-grid3-col{padding:5px; border: 1px solid #f4f4f4;}*/
/*.x-grid3-row:nth-of-type(odd) {background-color: #f9f9f9;}*/
/*.x-grid3-col:focus{outline-color:InactiveBorder;}*/
/*.x-grid3-row:hover {background-color: #f5f5f5;}*/

/*-----------------------------------------------------colors fons aplicacio-----------------------------------------------------------------------------------*/

/*color fons skin*/

.skin-yellow-light .wrapper, .skin-yellow-light .main-sidebar, .skin-yellow-light .left-side {
    background-color: white;
}

.wrapper {
    background-color: #FCF6EE;
}

.box-bordered{
    border: 2px solid #f39c12;
}

/*color fons box*/
.box-header,.box-body, .box-footer {
    background-color: #FCF6EE;
}

/* box amb apariència de legends*/

.box-legend{
    border-top-color: #f39c12;
    border:none!important;
    margin-bottom: 5px;
    box-shadow: none;
    background-color:#FCF6EE ;
}
.box-legend  div.box-header{
    padding-left: 0;
}

/* ---------------------------------------------------capçalera superior inici esquerra -----------------------------------------------------------------------------------*/
.main-header .logo { text-align:left}
.logo{position:relative;}
.contentLogo { float:left !important; width: auto !important;min-height:54px;}
span.logo.contentLogo >a> b {color:white;}
span.logo.contentLogo >a:hover b{color: #367FA9;}
.versio {font-size: xx-small;position: absolute;left:40px;top:20px;}
.contenidorDadesCentre {line-height: 20px;color:white;position:absolute;left:160px;top:18px;}

.cursAcademic {
    transition:0.2s ease all;
    -moz-transition:0.2s ease all;
    -webkit-transition:0.2s ease all;
    -o-transition: 0.2s ease all;
}

.cursAcademic.move{
    font-size:.75em;
    -ms-transform: translate(0, -20px); /* IE 9 */
    -webkit-transform: translate(0, -20px); /* Safari */
    transform: translate(0, -20px);
}

.cursAcademicNoActual {
    transition:0.2s ease all;
    -moz-transition:0.2s ease all;
    -webkit-transition:0.2s ease all;
    -o-transition: 0.2s ease all;;
}

.cursAcademicNoActual.move {
    -ms-transform: scale(0.5,0.5) translate(0, -40px); /* IE 9 */
    -webkit-transform: scale(0.5,0.5) translate(0, -40px); /* Safari */
    transform: scale(0.5,0.5) translate(0, -40px);
}
.contenidorSliderCurs{
    transition:0.2s ease all;
    -moz-transition:0.2s ease all;
    -webkit-transition:0.2s ease all;
    -o-transition: 0.2s ease all;;
}

.contenidorSliderCurs.move{
    -ms-transform: translate(0, -20px); /* IE 9 */
    -webkit-transform: translate(0, -20px); /* Safari */
    transform: translate(0, -20px);

}


/* ---------------------------------------------------menuIcon capçalera superior inici esquerra -----------------------------------------------------------------------------------*/
#menuIcon {
    width: 30px;
    cursor:pointer;
    color: white;
}

#menuIcon:hover {
    color: #0495c9;
}

a:hover #menuIcon {color: #367FA9;font-size: 1.2em; }
/* ---------------------------------------------------botons capçalera superior -----------------------------------------------------------------------------------*/

.skin-yellow-light .main-header .navbar .nav > li > a:hover
{    color: #367FA9;
    background-color:transparent;}

.skin-yellow-light .main-header .navbar .nav .open > a,
.skin-yellow-light .main-header .navbar .nav .open > a:hover,
.skin-yellow-light .main-header .navbar .nav .open > a:focus,
.skin-yellow-light .main-header .navbar .nav > .active > a {
    background: #F39C12;
}

/* estil per diferenciar els botons del menus sobre els que no es pot fer drop*/
.semitransparent {
    opacity: 0.4;
}

/*-----------------------------------------------------ruta menu a la capçalera superior----------------------------------------------------------------------*/

.rutaMenu{font-size:10px;color: white;}

/*-----------------------------------------------------barres navegacio -----------------------------------------------------------------------------------*/

/* navbar superior*/

.main-header .navbar {
    margin-left: 0;
    transition: none;
}


.sidebar-menu>li>a {
    padding: 2px 5px 7px 5px;
    display: block;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span {
    padding: 2px 5px 7px 20px;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
    top:28px;
    width:auto;
}

.sidebar-menu .treeview-menu > li > a {
    display: block;
    font-size: 14px;
    padding: 2px 5px 5px 15px;
}

.sidebar-mini.sidebar-collapse .sidebar-menu>li {
    text-align: center;
}

.sidebar-mini.sidebar-collapse .sidebar-menu>li>a>span {
    text-align: left;
}

/*separacio botons navbar superior*/

.nav>li>a {
    padding: 15px 5px;

}

/*menu principal esquerra*/

.tree {
    min-height:20px;
    padding:10px;
    margin-bottom:20px;
    background-color:#FCF6EE;
    border:0 solid #F39C12;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    -webkit-box-shadow:inset 0 0 0 rgba(0, 0, 0, 0.05);
    -moz-box-shadow:inset 0 0 0 rgba(0, 0, 0, 0.05);
    box-shadow:inset 0 0 0 rgba(0, 0, 0, 0.05)
}
.tree li {
    list-style-type:none;
    margin-bottom:2px;
    padding:1px 5px 0 5px;
    position:relative
}
.tree li::before, .tree li::after {
    content:'';
    left:-20px;
    position:absolute;
    right:auto
}
.tree li::before {
    border-left:0 solid #F39C12;
    bottom:50px;
    height:100%;
    top:0;
    width:1px
}
.tree li::after {
    border-top:0 solid #F39C12;
    height:20px;
    top:24px;
    width:25px
}
.tree li span {
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    /*border:1px solid #F39C12;*/
    border-radius:5px;
    display:inline-block;
    padding:3px 8px;
    text-decoration:none
}
.tree li.parent_li>span {
    cursor:pointer
}
.tree>ul>li::before, .tree>ul>li::after {
    border:0
}
.tree li:last-child::before {
    height:25px
}
.tree li.parent_li>span:hover, .tree li.parent_li>span:hover+ul li span {
    /*background:#fbe8d0;*/
    background-color: #fbe8d0 !important;
    /*border:1px solid #F39C12;*/
    color:#F39C12
}

/*botons menu principal*/
.btn-menu{
    margin:5px;
}


/*submenus dreta*/

.badge-submenu {
    background-color: #F39C12;
    font-size: 14px;
    font-weight: normal;
}

.badge-submenu-desplegat{
    background-color: #3c8dbc;
    font-size: 14px;
    font-weight: normal;
}

/* modals info */

.modal-info .modal-header {
    background-color:  #F39C12 !important;
    border: 1px solid #F39C12;
}
.modal-info .modal-footer {
    background-color:  #FCF6EE !important;
    border: 1px solid #F39C12;
    border-top:none;
    border-left:1px solid #F39C12;
    border-right:1px solid #F39C12;
    border-bottom: 1px solid #F39C12;
}

.modal-info .modal-body {
    background-color:  #FCF6EE !important;
    border-top:none;
    border-left:1px solid #F39C12;
    border-right:1px solid #F39C12;
    border-bottom: none;
}

.modal-danger .modal-header {
    background-color:  #DD4B39 !important;
    border: 1px solid #DD4B39;
}
.modal-danger .modal-footer {
    background-color:  #FCF6EE !important;
    border: 1px solid #DD4B39;
    border-top:none;
    border-left:1px solid #DD4B39;
    border-right:1px solid #DD4B39;
    border-bottom: 1px solid #DD4B39;
}

.modal-danger .modal-body {
    background-color:  #FCF6EE !important;
    border-top:none;
    border-left:1px solid #DD4B39;
    border-right:1px solid #DD4B39;
    border-bottom: none;
}

.modal-body p {color:#333;}


/*----------------------------------------------------- botons-----------------------------------------------------------------------------------*/

/* boto actiu de un grup de botons*/

.btn-group label.btn.btn-default.active{border-color: #CF710C;}


/* contenidor barra botons */
/*div.marcBotons{display:block;clear:both;text-align:right;padding:5px;}*/

/* botons tipus document */

.bg_excel {
    background-image: url("../form/ico_excel.png");
    background-repeat: no-repeat;
    background-position: center center;
    width: 32px;
    height:32px;
    display: inline-block;
}
.bg_calc {
    background-image: url("../form/ico_calc.png");
    background-repeat: no-repeat;
    background-position: center center;
    width: 32px;
    height:32px;
    display: inline-block;
}
.bg_html {
    background-image: url("../form/ico_html.png");
    background-repeat: no-repeat;
    background-position: center center;
    width: 32px;
    height:32px;
    display: inline-block;
}
.bg_q19 {
    background-image: url("../form/ico_q19.png");
    background-repeat: no-repeat;
    background-position: center center;
    width: 32px;
    height:32px;
    display: inline-block;
}
.bg_pdf {
    background-image: url("../form/ico_acrobat.png");
    background-repeat: no-repeat;
    background-position: center center;
    width: 32px;
    height:32px;
    display: inline-block;
}
.bg_xml {
    background-image: url("../form/ico_xml.png");
    background-repeat: no-repeat;
    background-position: center center;
    width: 32px;
    height:32px;
    display: inline-block;
}

/* notes informatives */
.nota{color:#CF710C;font:bold 0.8em Arial,Verdana;}
.notaVerda{color:#17801C;font:bold 0.8em Arial,Verdana;}
.notaVermella{color:#FF0000;font:bold 0.8em Arial,Verdana;}
.notaGris{color:#858383;font:bold 0.8em Arial,Verdana;}
.nota-petita{font-size: 0.8em;}


/*----------------------------------------------------- tabs-----------------------------------------------------------------------------------*/

/* tabs */
.tab-content {
    background-color: #FCF6EE;
    padding: 15px;
    border: 1px solid #ddd;
    border-top: none;
    border-radius: 0 0 4px 4px;
}

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

.nav-tabs > li > a {
    border-radius: 4px 4px 0 0;
    padding: 10px 15px;
    margin-right: 2px;
    color: #777; /* Un color més suau per a les pestanyes inactives */
    font-weight: 600;
    border: 1px solid transparent;
    border-top: 3px solid transparent;
}

.nav-tabs > li > a:hover {
    background-color: #f5f5f5; /* Un fons molt suau en passar el ratolí */
    border-color: #eee #eee #ddd;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    color: #333;
    background-color: #FCF6EE; /* El mateix color de fons que el contingut */
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom-color: transparent; /* Fa que la pestanya sembli unida al contingut */
    border-top: 3px solid #bf7500; /* Indicador actiu, color taronja fosc */
    font-weight: 600;
    padding-top: 8px; /* Ajust per compensar la vora superior i mantenir l'alçada */
}

/*---------------------------------UI JQUERY DATE PICKER FOR BOOTSTRAP------------------------------------*/
.ui-datepicker {
    z-index: 1100 !important;
    background-color: #fff;
    border: 1px solid #66AFE9;
    border-radius: 4px;
    box-shadow: 0 0 8px rgba(102,175,233,.6);
    display: none;
    margin-top: 4px;
    padding: 10px;
    width: 240px;
}
.ui-datepicker a,
.ui-datepicker a:hover {
    text-decoration: none;
}
.ui-datepicker a:hover,
.ui-datepicker td:hover a {
    color: #2A6496;
    -webkit-transition: color 0.1s ease-in-out;
    -moz-transition: color 0.1s ease-in-out;
    -o-transition: color 0.1s ease-in-out;
    transition: color 0.1s ease-in-out;
}
.ui-datepicker .ui-datepicker-header {
    margin-bottom: 4px;
    text-align: center;
}
.ui-datepicker .ui-datepicker-title {
    font-weight: 700;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    cursor: default;
    font-family: 'Glyphicons Halflings';
    -webkit-font-smoothing: antialiased;
    font-style: normal;
    font-weight: normal;
    height: 20px;
    line-height: 1;
    margin-top: 2px;
    width: 30px;
}
.ui-datepicker .ui-datepicker-prev {
    float: left;
    text-align: left;
}
.ui-datepicker .ui-datepicker-next {
    float: right;
    text-align: right;
}
.ui-datepicker .ui-datepicker-prev:before {
    content: "\e079";
}
.ui-datepicker .ui-datepicker-next:before {
    content: "\e080";
}
.ui-datepicker .ui-icon {
    display: none;
}
.ui-datepicker .ui-datepicker-calendar {
    table-layout: fixed;
    width: 100%;
}
.ui-datepicker .ui-datepicker-calendar th,
.ui-datepicker .ui-datepicker-calendar td {
    text-align: center;
    padding: 4px 0;
}
.ui-datepicker .ui-datepicker-calendar td {
    border-radius: 4px;
    -webkit-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
    -moz-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
    -o-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
    transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
}
.ui-datepicker .ui-datepicker-calendar td:hover {
    background-color: #eee;
    cursor: pointer;
}
.ui-datepicker .ui-datepicker-calendar td a {
    text-decoration: none;
}
.ui-datepicker .ui-datepicker-current-day{
    background-color: #4289cc;
}
.ui-datepicker .ui-datepicker-current-day a{
    color: #fff
}
.ui-datepicker .ui-datepicker-calendar .ui-datepicker-unselectable:hover {
    background-color: #fff;
    cursor: default;
}
.ui-datepicker-today{font-weight: bold;}

.ui-datepicker-month {
    border: 0;
    color: #000;
}
.ui-datepicker-year {
    border: 0;
    color: #000;
}

/*botons amb  icones al costat de icones amb texte  <span class="glyphicon glyphicon-print" aria-hidden="true" ></span>*/
.btn-icon{
    padding: 9px 12px;
    border-radius: 4px;
}

legend {
    border-color:   #f5c586;
    font-size: 16px;
    border-width: 0 0 2px;
    margin-bottom: 10px;
}

.box-title {font-size: 20px !important; padding-left:0 !important;}

.table-striped > tbody > tr > td {
    border:  1px solid #ddd;
}


.table {margin-bottom: 10px;}


/*fieldsets amb legends dins la linia*/
fieldset.scheduler-border {

    border: 1px none rgb(243, 156, 18);
    border-top-style: solid;
    padding: 0 0 1em 1.4em !important;
    /*background-color: white;*/
}

legend.scheduler-border {
    font-size: 1.2em !important;
    font-weight: normal !important;
    color: rgb(243, 156, 18);
    text-align: left !important;
    width:auto;
    padding:0 10px;
    border-bottom:none;
}

input:invalid {
    border-color: salmon;
}

textarea:invalid {
    border-color: salmon;
}

select:invalid {
    border-color: salmon;
}

input[type="number"]:focus, input[type="file"]:focus, input[type="checkbox"]:focus, input[type="radio"]:focus {
    outline: none;
}
/*no aplicam als inputs text dins grids extjs3*/
select:focus, input[type="text"]:not(.x-form-field):focus,input[type="number"]:focus,input[type="tel"]:focus,input[type="password"]:focus,input[type="search"]:focus,textarea:focus{
    border-color: #aa6600;
    box-shadow: 0 0 8px rgba(170, 102, 0, 0.4);
}

input:required, select:required, textarea:required{background-color: rgb(255, 245, 215);}
.required {background-color: rgb(255, 245, 215);}

input[type="number"], input[type="time"]{
    padding-right: 0;
    height: 34px;
}

input.input-xs{width: 25% !important;}
input.input-sm{width: 50% !important;}
input.input-md{width: 75% !important;}

input:disabled, select:disabled, textarea:disabled, input[disabled], select[disabled], input[readonly], textarea[disabled], textarea[readonly]{background-color: rgb(238, 238, 238)!important; opacity: 0.65!important;}
input[type="checkbox"][disabled] {opacity: 1 !important;}

/*input type=submit per imprimir perque quedi similar  button type="submit" */
.icon-input-btn-print{
    display: inline-block;
    position: relative;
}
.icon-input-btn-print input[type="submit"]{
    height:45px;
    width:51px;
    padding: 0;
}

.icon-input-btn-print input[type="button"]{
    height:45px;
    width:51px;
    padding: 0;
}

.icon-input-btn-print .glyphicon{
    display: inline-block;
    position: absolute;
    left: 1.1em;
    top: 30%;
    font-size: 18px;
    color: rgb(255, 255, 255);
}

.date{
    width:140px;
}

.email{
    width:300px;
}

.centrat {
    text-align: center !important;
}

html, body {height:100%}
#contenidorIframe {height:100%}
.modal-content {
    max-height: calc(100vh - 60px);
    overflow-y: auto;
    overflow-x:hidden;
    height:auto;
}
.modal-content > .box {margin-bottom:0}

.ui-autocomplete {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 2000;
    float: left;
    display: none;
    min-width: 160px;
    padding: 4px 0;
    margin: 0 0 10px 25px;
    list-style: none;
    background-color: #ffffff;
    border-color: #ccc;
    border-color: rgba(0, 0, 0, 0.2);
    border-style: solid;
    border-width: 1px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
    border-right-width: 2px;
    border-bottom-width: 2px;
}

.ui-menu-item {padding:2px 0 0 12px}
.ui-menu .ui-menu-item:hover, .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus {
    color:rgb(54, 127, 169);cursor:pointer;
}

.xestibColor {width: 60px !important; height: 25px !important; padding: 2px 2px; }

.alturaBoto {height: 34px;}

.baixa{color:red;}


/*modificacio outline botons bootstrap en estat active focus*/
.btn.active.focus, .btn.active:focus, .btn:active.focus, .btn:active:focus {
    outline: thin dotted !important;
    outline-offset: -2px !important;
}

.chosen-drop, .chosen-single, .no-results {
    background:none !important; background-color: rgb(255, 245, 215) !important;
}

hr {
    margin-top:10px;
    margin-bottom:10px;
    width: 100%;
    color: #f39c12;
    height: 1px;
    background-color:#f39c12;
}

/*deshabilitam alta d'imatges al summernote*/
.note-group-select-from-files {
    display: none;
}

.custom-file-upload {
    border: 1px solid #ccc;
    display: inline-block;
    padding: 0 3px;
    cursor: pointer;
}
.custom-file-upload:hover {
    background-color: #3c8dbc;
    border-color: #367fa9;
}

/* ===================================================================
   ESTILS PERSONALITZATS PER A JQUERY CHOSEN
   =================================================================== */

/* Contenidor principal del select Chosen */
.chosen-container-single .chosen-single {
    height: 34px !important;
    line-height: 34px !important;
    padding: 0 0 0 12px !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    background: #fff !important; /* Eliminam gradients i imatges de fons */
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075) !important;
    color: #555 !important;
    font-size: 14px;
    font-weight: normal; /* A diferència dels botons, el text del select no ha de ser negreta */
}

/* Fletxa del desplegable */
.chosen-container-single .chosen-single div {
    width: 28px !important;
    top: 0 !important;
    right: 0 !important;
}

.chosen-container-single .chosen-single div b {
    background-position: 0 7px !important; /* Ajustam la posició de la fletxa verticalment */
}

/* Estil quan el select està actiu/obert */
.chosen-container-active.chosen-with-drop .chosen-single {
    border-color: #f39c12 !important;
    box-shadow: 0 0 8px rgba(243, 156, 18, 0.4) !important;
    background-image: none !important; /* Asseguram que no hi hagi gradients */
}

/* Panell desplegable */
.chosen-container .chosen-drop {
    border: 1px solid #ccc !important;
    border-top: 0 !important;
    border-radius: 0 0 4px 4px !important;
    box-shadow: 0 6px 12px rgba(0,0,0,.175) !important;
}

/* Fila seleccionada/resaltada en el desplegable */
.chosen-container .chosen-results .highlighted {
    background-color: #f39c12 !important;
    color: #fff !important;
}

/*
 * Correcció per a .btn-group que conté botons que han de ser verticals.
 * S'utilitza la classe .clearfix (present a l'exemple) com a "hook"
 * per aplicar aquest estil sense afectar altres .btn-group.
 * La solució estàndard de Bootstrap seria usar la classe .btn-group-vertical.
*/
.btn-group > .btn.clearfix {
    float: none;
    display: block;
}


/* --- Estils modernitzats per al Menú Principal (Versió 2) --- */
/* Contenidor principal del menú, integrat amb el fons de l'aplicació */
.menu-container {
    display: flex;
    /*border-radius: 4px;*/
    flex-direction: column; /* Apila la cerca a sobre del contingut */
    min-height: 500px; /* Assegura una alçada mínima per al menú */
    background-color: #FCF6EE;
    overflow: hidden; /* Per mantenir els border-radius */
}

/* Nou contenidor per a les columnes de categories i opcions */
.menu-content-wrapper {
    display: flex;
    flex-grow: 1; /* Ocupa l'alçada restant */
    overflow: hidden; /* Evita problemes de scroll */
}

/* Columna esquerra de categories: ara sembla una llista de navegació */
.menu-categories {
    flex: 0 1 220px; /* Una mica més ample per a textos llargs */
    min-width: 55px;
    background-color: #FCF6EE;
    border-right: 1px solid #f5c586;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.menu-search-container {
    padding: 10px 15px;
    border-bottom: 1px solid #f5c586;
    position: relative;
    flex-shrink: 0;
}

.menu-search-container .form-control {
    max-width: 400px;
    padding-left: 30px; /* Espai per a la icona */
    border-color: #e0a961;
}

.menu-search-container::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f002"; /* Icona de cerca (fa-search) */
    position: absolute;
    left: 25px;
    top: 21px;
    color: #999;
    pointer-events: none;
}

.menu-categories ul {
    list-style: none;
    padding: 8px 0;
    margin: 0;
    overflow-y: auto;
    overflow-x: hidden;
    flex-grow: 1;
}

.menu-categories .btn-menu {
    width: 100%;
    text-align: left;
    box-sizing: border-box; /* Assegura que el padding s'inclogui dins l'amplada*/
    background-color: #FCF6EE;
    border: none;
    border-radius: 0;
    padding: 5px 10px; /* Més padding per a més espai */
    font-size: 14px;
    color: #444; /* Un gris una mica més fosc per a millor contrast */
    font-weight: 600; /* Semi-negreta per a més claredat */
    transition: all 0.2s ease-in-out;
    border-left: 4px solid transparent; /* Indicador actiu/hover */
    line-height: 1.4;
    /* Propietats per evitar el desbordament horitzontal i el scroll */
    /* Convertim el botó en un contenidor flex per alinear icona i text */
    display: flex;
    align-items: center;
}
/* Estil per al text dins dels botons de menú */
.menu-categories .btn-menu > span {
    margin-left: 8px; /* Espai entre la icona i el text */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0; /* Permet que el text s'encongeixi i es talli correctament */
}

/* Efecte hover més clar */
.menu-categories .btn-menu:hover {
    background-color: #fef4e7; /* Un taronja molt pàl·lid */
    color: #8c5a00;
    border-left-color: #f9d6a1; /* Una versió més suau del color principal */
}

/* Categoria activa, molt més visual */
.menu-categories .btn-menu.active {
    background-color: #fbe8d0; /* Un taronja més marcat, ja utilitzat a les taules */
    color: #8c5a00; /* Mantenim el color de text per a consistència */
    font-weight: 700; /* Fem el text negreta per destacar-lo */
    border-left-color: #bf7500; /* Color principal del tema */
}

/* Columna dreta d'opcions: més espai i millor organització */
.menu-options {
    flex-grow: 1; /* Ocupa l'espai restant */
    min-width: 228px;
    padding: 10px;
    overflow-y: auto;
    background-color: #FCF6EE; /* Fons igual que la resta de l'aplicació per a consistència visual */
}

#arbreMenus, #arbreMenus a {
    font-size: 14px; /* Mida de lletra consistent */
}
#arbreMenus.tree {
    border: none;
    padding: 0;
    margin-left: 0;
    background-color: transparent;
}

#arbreMenus .parent_li ul {
    padding-left: 25px;
    margin-top: 2px; /* Reduïm l'espai entre el pare i els fills */
}

#arbreMenus a {
    /*color: #367FA9;*/
    color: #02466c;
    text-decoration: none;
    padding: 1px 0; /* Reduïm el padding vertical per fer-lo més compacte */
    white-space: normal;
    overflow: clip;
    text-overflow: ellipsis;
}
#arbreMenus a:hover { text-decoration: underline; }

/* Estil per als submenús desplegables (els "directoris") */
#arbreMenus span[id^="pastilla_"] {
    font-size: 15px; /* Una mica més gran per destacar */
    font-weight: 600;
    padding: 2px 0;
    cursor: pointer;
    color: #333;
    display: block; /* Ocupa tota l'amplada per a un clic més fàcil */
}
#arbreMenus span[id^="pastilla_"] .far { margin-right: 8px; color: #bf7500; }
#arbreMenus label { margin-right: 8px; cursor: pointer; color: #bf7500; }
#arbreMenus li {
    margin-bottom: 2px;
    list-style: none;
    /* Convertim el 'li' en un contenidor flex per alinear icona i text */
    display: flex;
    align-items: center;
}

/*
 * Suavitzam l'estil de les "pastilles" dels submenús desplegables,
 * eliminant el fons de color per un disseny més net i modern.
 * Ara, l'estat (obert/tancat) s'indica amb el color del text i la icona.
 */
.menu-container .badge-submenu,
.menu-container .badge-submenu-desplegat {
    background-color: transparent !important;
    padding: 0;
    color: inherit !important;
}

.menu-container .badge-submenu-desplegat {
    background-color: #fbe8d0 !important;
    color: #8c5a00 !important; /* Un taronja una mica més fosc per indicar que està obert */
}

/* Sobreescrivim la regla anterior per als 'li' que són contenidors de submenús.
   Aquests han de ser 'block' per apilar la capçalera i la llista de fills verticalment. */
#arbreMenus li.parent_li {
    display: block;
}

.recents{
    margin-bottom: 8px!important;
}

.colorRecent {
    color: #bf7500;
}

/* Estils per a pantalles petites (mòbils) on el menú de categories és només d'icones */
@media (max-width: 767px) {
    .menu-categories {
        flex: 0 0 auto; /* El contenidor s'adapta a l'amplada del seu contingut */
        min-width: 0;   /* Anul·lam el min-width per permetre que s'encongeixi */
    }

    .menu-categories .btn-menu {
        justify-content: center; /* Centram la icona horitzontalment dins el botó */
        padding: 10px;            /* Ajustam el padding per a un aspecte més quadrat */
    }

    .content {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
}

/* ===================================================================
   ESTILS ESPECÍFICS PANTALLA AVALUACIÓ
   =================================================================== */
.notaNoMarcada {border: 1px solid grey;}
.notaMarcada {
    border: 1px solid orange !important;
    background-color: #F39C12 !important;
    color: white !important;
}
.notaExempta {border: 1px solid grey; background-color: #98A8A1; color: white}
.notaVella {border: 1px solid orange; background-color: #B0B0B0;}
.hiHaObservacions {background-color: #F39C12;}
.infoAvaluacio {margin-left:5px;color: #367fa9; cursor: pointer;}

/* ===================================================================
    ESTILS PER A LA TAULA D'AVALUACIÓ DE COMPETÈNCIES (TEMA GROC)
    =================================================================== */

/* Estil general de la taula */
#taulaAvaluar {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #ddd;
    border-radius: 4px;
    overflow: hidden;
}

/* Estil per a les files que actuen com a capçalera de secció */
#taulaAvaluar tr[onclick^="obriTancaApartat"] {
    background-color: #fbe8d0; /* Taronja molt suau per destacar */
    cursor: pointer;
    font-weight: bold;
}

/* Estil per a les files de dades (zebra-striping) */
#taulaAvaluar tr[class^="itemDeApartat"]:nth-of-type(even) {
    background-color: #fff9f0; /* Crema molt pàl·lid per a files parells */
}
#taulaAvaluar tr[class^="itemDeApartat"]:nth-of-type(odd) {
    background-color: white; /* Blanc per a files senars */
}

/* Estil per a totes les cel·les per assegurar consistència */
#taulaAvaluar td {
    padding: 8px 12px;
    vertical-align: middle;
    border-top: 1px solid #ddd;
}

/* Anul·lam fons i vores de les taules niuades per evitar conflictes */
#taulaAvaluar td table, #taulaAvaluar td table td {
    background-color: transparent !important;
    border: none !important;
    padding: 0 !important;
}

.aturada {
    background-color: #f3d7b2!important;
    font-weight: bold !important;
}