:root{
    --label-primary-color : #006DD2;
    --label-primary-color-table: #B0D0F5;
    --label-primary-color-empty-value: #99c7e4 ;
    --label-primary-color-error-background: #da4f49 ;
    --label-primary-color-error-background-color:  #FFFF00 ;
    --color-red: red;
    --color-blue: #006DD2;
    --color-yellow: yellow;
    --font-size-standar :11px;
    --color-background-gray: #f5f5f5;
    --white-color: #fff;
    --primary-text-color: black;
    --secondary-text-color: white;
    --autocomplete-text-color: #006DD2;
    --primary-background-color:#337ab7;
    --primary-background-color-hover: #204d74;
    --primary-border-color:#2e6da4;
    --primary-border-color-hover:#122b40;
    --primary-info-box: rgb(52, 152, 219); /* Color base del tooltip */
    --primary-info-box-shadow-light: rgba(52, 152, 219, 0.2); /* Sombra más ligera */
    --primary-info-box-shadow-medium: rgba(52, 152, 219, 0.3); /* Sombra media */
    --primary-info-box-shadow-dark: rgba(52, 152, 219, 0.4); /* Sombra más intensa */
    --box-error-background: #ffecec;
    --box-error-border-color: #f5aca6;
    --box-success-background: #e9ffd9 ;
    --box-success-border-color: #a6ca8a;
    --box-success-background-hover: #398439 ;
    --box-success-border-color-hover: #255625;
    --box-warning-background: #fff8c4 ;
    --box-warning-border-color: #f2c779;
    --warning-color: #d91010;
    --box-notice-background: #e3f7fc ;
    --box-notice-border-color: #8ed9f6;
    --color-pns-gray :#afafb3;;
    --color-pns-dark-gray: #313131;
    --color-pns-light-blue: #0BC6F4;
    --color-pns-dark-blue: #001bc9;
    --color-pns-dark-yellow: #c4c23b;
    --color-pns-yellow:#ffee33;
    --color-pns-orange:orange;
    --color-pns-black: black;
    --color-pns-brown: #421f00;
    --color-pns-purple: #6b0068;
    --color-pns-red: red;
    --color-pns-green: #00ff48;
    --max-width-block : 1600px;
    --color-text-navbar : white;
    --color-text-menu-navbar: black;
    --select-text-color : white;
    --color-error-text :  yellow ; /* Color de texto amarillo más visible */
    --background-error : rgba(218, 79, 73, 0.7) ; /* Fondo con más opacidad */
    --default-box-icon:16px;
    --color-check-ok: darkgreen;
    --color-check-not-ok: darkred;
    --color-check-warn: #cd7d1d;
    --color-check-not-set: gray;
    --highlight-border:#4CAF50;
    --shadow-glow: rgba(72, 239, 128, 0.8);
    --shadow-no-glow: rgba(72, 239, 128, 0);
    --is-adr-color: red;
    --is-express-color: red;
    --is-pns-color :blue;
    --is-stackable-color: green;
    --is-not-stackable-color: red;
    --is-overweight-color : red;
    --is-connected-color: red;
    --is-liftgate-color:red;
    --base-consigment-color: darkolivegreen;
    --container-type-color:red;
    --primary-link-color: #006DD2;
    --background-color-block-shipment: darkred;
    --color-text-block-shipment: white;
    --background-color-activate-shipment: #04b542;
    --color-text-activate-shipment: black;


}


* {
    margin: 0px;
    border: 0px;
    font-family: tahoma, sans-serif;
    font-size: var(--font-size-standar);
    /*
    font-family:verdana,sans-serif;
    font-size:10px;
    */
}

.dafault-font{
    font-family: tahoma, sans-serif;
    font-size: 11px;
}

img {
    border: 0px;
}

sup {
    line-height: 0px;
    font-size: 8px;
}

.no_visible {
    display: none;
}

ul {
    padding: 0px;
    margin: 0px;
    list-style-type: none;
}

ul, ul li {
    float: left;
    display: inline;
    width: auto;
}

p {
    margin: 0 0 8px 0;
}

.left {
    float: left;
    display: inline;
    width: 100%;
}

.right {
    float: right;
    display: inline;
}

.div_message {
    opacity: 0.85;
    background: #d33031;
    color: white;
    padding: 10px;
    text-align: center;
}

.backgroundErrorColor {
    background-color: var(--background-error) !important;
    color: var(--color-error-text) !important; /* Color de texto amarillo más visible */
    /*background-image: linear-gradient(to right, red , yellow)!important;*/
}

.backgroundErrorColor a {
    color: var(--color-error-text) !important; /* Color del texto del enlace <a> */
    text-decoration: none; /* Opcional: para eliminar el subrayado */
}

.backgroundErrorColor a:hover {
    text-decoration: none; /* Opcional: para eliminar el subrayado */
}

.backgroundEmptyColor {
    background-color: var(--label-primary-color-empty-value) !important;
    /*background-image: linear-gradient(to right, red , yellow)!important;*/
}

.backgroundSelectColor {
    background-color: #90EE90 !important;
}

.shadowSelectColor {
    text-shadow: 1px 1px 4px #90EE90;
}


.col50Detall {
    width: 50%;
}


.barra {
    background-image: url('img/fons_barra.png');
    background-position: top center;
}

.barra_usuari {
    background-color: var(--label-primary-color);
    display: none;
}

.barra_menu {
    background-color: #000;
    border-top: 1px solid #aaa;
}

.barra_menu ul li a {
    padding: 5px 20px;
    border-left: 1px solid #777;
    border-right: 1px solid #444;
    color: #ddd;
    display: block;
    font-family: verdana, sans-serif;
    font-size: 10px;
}

.barra_menu ul li a:hover {
}

.barra_usuari ul {
    float: right;
    margin: 2px 16px 0;
}

.barra_menu ul li.active a {
    background: #fff url('img/fons_marcat.png') top left;
    color: #666;
}

.submenu {
    border: 0px;
    background: #fff url('img/fons_submenu.png') top left;
    height: 33px;
    position: fixed;
    top: 40px;
    left: 0px;
    z-index: 500000;
}

.submenu ul {
    float: left;
    display: inline;
    width: auto;
    margin: 10px 0 0 10px;
}

.submenu ul li {
    background: url('img/li_submenu.png') no-repeat scroll 0 4px;
    margin: 0 10px;
    padding: 0 0 0 10px;
}

.submenu ul li a {
    color: #666;
    font-family: verdana, sans-serif;
    font-size: 10px;
}

.submenuInterior {
    float: right;
    width: auto;
    display: inline;
    margin: -42px 0 0 0;
}

.submenuInterior li {
    border-left: 1px solid #ccc;
    margin: 0 0 0 10px;
    padding: 0 0 0 10px;
}

.submenuInterior li.primer {
    border: 0px;
}

.submenuInterior a.exportaXLSIco {
    background: url('img/page.png');
    display: block;
    float: left;
    height: 16px;
    width: 16px;
    margin: -4px 0 0 0;
}

.submenuInterior a.exportaXLSIco span {
    display: none;
}

.barra_usuari ul li a {
    font-size: 10px;
    display: block;
    padding: 2px 8px;
    margin: 4px 0 0;
    color: #fff;
}

.barra_usuari ul li.missatges a {
    background-image: url('img/mail.png');
    background-repeat: no-repeat;
    padding-left: 20px;
}

.barra_usuari ul li.logout a {
    background-image: url('img/shut_down.png');
    background-repeat: no-repeat;
    padding-left: 20px;
}


a, a span {
    color: var(--label-primary-color);
    text-decoration: none;
}

.form .valor a{
    color: var(--primary-text-color);
    font-style: italic;
    text-decoration: none;
}

.form .valor a:hover{
    color: var(--primary-link-color);
    text-decoration: underline;
}

a:hover {
    text-decoration: underline;
}

h1 {
    width: auto !important;
    margin: 4px 0 3px 14px;
}

h2 {
    font: 16px/24px Arial, sans-serif;
    letter-spacing: -1px;
    font-weight: normal;
    color: #666;
    padding: 0 0 4px;
    margin: 0 0 20px 0;
    border-bottom: 1px dotted #999;
}

h2 a {
    font: inherit;
}

h2 a.anchor {
    color: #666;
}

h2 span {
    font: 12px/14px Arial, sans-serif;
    letter-spacing: 0px;
    font-weight: normal;
    color: var(--label-primary-color);
}

h2.h2_vermell {
    color: red;
}


h3 {
    font: 14px/18px Arial, sans-serif;
    letter-spacing: -1px;
    font-weight: normal;
    color: #666;
    padding: 0 0 4px;
    margin: 0 0 14px 0;
    border-bottom: 1px dotted #999;
}




.zona {
    padding: 0 0 65px;
    margin: 65px 0 0;
}

.centrar {
    width: var(--max-width-block);
    margin: 20px auto;
}

.summary {
    color: var(--label-primary-color);
    margin: 12px 0 5px !important;
    text-align: left !important;
}

.ui-widget-header {
    background: url("img/fons_barra.png") repeat scroll left top #000000 !important;
    color: #DDDDDD;
}

.llista {
    clear: both;
    width: 100%;
    margin: 0 0 14px 0;
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.grid-view {
    padding: 0 !important;
}



/*.flash-error{font-size:14px;color:red;}
.flash-succsess{font-size:14px;color:green;}*/

.llista tr.cerca td {
    padding: 8px 4px;
    text-align: center;
}

.llista tr.desar td {
    background: var(--label-primary-color-table) url('img/fons_th.png') top left;
}

.llista tr.cerca input {
    width: 95%;
    border: 1px solid #ccc;
    padding: 2px 0;
}

tr.fila_concepte_vermella * {
    color: red;
    font-weight: normal;
}

tr.fila_vermella, tr.fila_vermella * {
    color: red;
    text-decoration: line-through;
    font-weight: normal;
}

tr.fila_resaltada, tr.fila_resaltada * {
    color: var(--label-primary-color);
    font-weight: bold;
}

tr.fila_verda, tr.fila_verda * {
    color: #0fb202;
}

td.defectes_sense_imatge {
    background-color: coral !important;
}

a.missatgeMarcat {
    color: red;
    background-image: url('img/estats_mail.png');
    background-position: 0px 16px;
    width: 16px;
    height: 16px;
    display: block;
}

a.missatgeNoMarcat {
    color: blue;
    background-image: url('img/estats_mail.png');
    width: 16px;
    height: 16px;
    display: block;
}

input.autocomplete , input.ui-autocomplete-input{
    color: var(--autocomplete-text-color) !important;
    border-color: var(--primary-border-color) !important;
}

input.autocomplete:hover,
input.ui-autocomplete-input:hover {
    color: var(--autocomplete-text-color) !important;
    border-color: var(--primary-background-color-hover) !important;
}

.ac_results {
    /*text-align:center;
    border:1px solid #ccc;
    overflow:visible;
    */
    overflow: visible;
    border: 0px;
    background: #fff;
}

.ac_results ul {
    /*overflow:hidden!important;*/
    /*padding:0;
    display:block;
    float:none;
    text-align:center;
    margin:0 auto;
    width:100%;*/
    z-index: 1;


    display: block;
    float: left;
    list-style-image: none;
    list-style-position: outside;
    list-style-type: none;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    padding-bottom: 2px;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 2px;


    cursor: default;
    position: absolute;


    -moz-border-radius-bottomleft: 4px;
    -moz-border-radius-bottomright: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;


    -moz-background-clip: border;
    -moz-background-origin: padding;
    -moz-background-size: auto auto;
    background-attachment: scroll;
    background-color: #FFFFFF;
    background-image: url("images/ui-bg_flat_75_ffffff_40x100.png");
    background-position: 50% 50%;
    background-repeat: repeat-x;

    border: 1px solid #ccc;
    color: #222222;


    font-family: Verdana, Arial, sans-serif;
    font-size: 1em;
    overflow: visible;
    background: #fff;
}

.ac_results ul li {
    clear: left;
    float: left;
    margin: 0px;
    padding: 0px;
    width: 100%;
    overflow: visible;
    background: #fff;
    padding: 0.2em 0;
}

.ac_results ul li.ac_odd, .ac_results ul li.ac_even {
    display: block;
    line-height: 1.5;
    text-decoration: none;
    outline-color: -moz-use-text-color;
    outline-style: none;
    outline-width: medium;
    background: #fff;
}

.ac_results ul li.ac_over {
    font-weight: normal;
    display: block;
    line-height: 1.5;
    text-decoration: none;
    background: #efefef !important;
    border-color: #ccc !important;
    color: var(--label-primary-color) !important;
}

.ac_results ul li b, .ac_results ul li strong {
    font: menu !important;
    font-size: 12px !important;
    font-weight: bold;
}

.ui-menu-item {
    padding: 0 !important;
    border: 0 !important;
    margin: 0px !important;
}

.ui-menu-item a {
    color: #000 !important;
    padding: 0.2em 0;
    border: 0 !important;
    margin: 0px !important;
    font: menu !important;
    font-size: 12px !important;
}

.ui-menu-item a b, .ui-menu-item a strong {
    font: menu !important;
    font-size: 12px !important;
    font-weight: bold;
}

.ui-state-focus {
    background: #efefef !important;
    border-color: #ccc !important;
    color: var(--label-primary-color) !important;
}

a.ui-state-focus {
    color: var(--label-primary-color) !important;
    cursor: pointer !important;
    padding: 0.2em 0;
    margin: 0px !important;
}

.ui-widget-content {
    border-color: #ccc !important;
}


.llista th {
    text-align: left;
    background: #000 url('img/fons_barra.png') top left;
    padding: 5px 3px 5px;
    font-weight: normal;
    color: #ddd;
    border-left: 1px solid #777;
    border-right: 1px solid #444;
}

.llista th a {
    font-weight: normal;
    color: #ddd;
}

.llista tr td {
    background: #fff url('img/fons_th.png') top left;
    padding: 3px 3px 2px;
    border-left: 1px solid #fff;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #fff;
    border-top: 1px solid #ccc;
    cursor: default;
}

.llista tr td.button-column {
    width: 120px;
}

.llista tr td.button-column a {
    margin: 0 2px;
}

.llista tr.even td {
    background: #efefef url('img/fons_th.png') top left;
}

.llista tr:hover td {
    background: #fff887 url('img/fons_th.png') top left;
    border-left: 1px solid #fcf8bd;
}

.llista tr.desar:hover td {
    background: var(--label-primary-color-table) url('img/fons_th.png') top left;
    border-left: 1px solid #fcf8bd;
}

.llistaEspai tr td {
    padding-top: 6px;
    padding-bottom: 5px;
}


.llista tr td.opcio, .llista tr th.opcio {
    width: 25px;
    text-align: center;
}

.llista tr.categories td {
    background: var(--label-primary-color) url('img/fons_barra.png') top left;
    color: #fff;
    padding: 5px 2px;
    border-bottom: 0px;
    font-weight: normal;
}

.totals_llistat {
    padding: 4px 0pt;
    -moz-border-radius: 8px 8px 8px 8px;
    margin: 0pt 0pt 18px;
    background: #efefef;
    width: auto;
}

.totals_llistat * {
    color: #666;
    letter-spacing: -1px;
    font: 12px/20px Arial, sans-serif;
}

.totals_llistat td {
    padding: 0 15px 0 8px;
    font: 14px/22px Arial, sans-serif;
    vertical-align: top;
    min-width: 80px;
}

.totals_llistat td label {
    font: 10px/14px Arial, sans-serif;
    letter-spacing: 0px;
    color: #000;
    float: left;
    width: 100%;
}

.totals_llistat td label sup {
    font: 8px/6px Arial, sans-serif;
    letter-spacing: -1px;
}

.totals_llistat_facturacio {
    padding: 4px 0pt;
    -moz-border-radius: 8px 8px 8px 8px;
    margin: 0pt 0pt 18px;
    background: #efefef;
    width: auto;
    float: right;
}

.totals_llistat_facturacio * {
    color: #666;
    letter-spacing: -1px;
    font: 12px/20px Arial, sans-serif;
}

.totals_llistat_facturacio td {
    padding: 0 15px 0 8px;
    font: 14px/22px Arial, sans-serif;
    vertical-align: top;
    text-align: right;
}

.totals_llistat_facturacio td label {
    font: 10px/14px Arial, sans-serif;
    letter-spacing: 0px;
    color: #000;
    float: left;
    width: 100%;
    clear: left;
    text-align: right;
}

.totals_llistat_facturacio td label sup {
    font: 8px/6px Arial, sans-serif;
    letter-spacing: -1px;
}

.caixa_cont {
    background: #fff887 url('img/caixa_fons.png') top left;
    height: 150px;
}

.caixa_peu {
    background: #fff887 url('img/caixa_peu.png') top left;
    height: 11px;
    margin: 0 0 12px 0;
}

.caixa_cap {
    background: #fff887 url('img/caixa_cap.png') top left;
    height: 11px;
}

.detall_dialog {
    width: 560px;
    padding: 10px;
}

.detall_dialog_gran {
    width: 1160px;
}

.detall_dialog div.label, .form div.label {
    border-bottom: 1px dotted #999999;
    color: var(--label-primary-color);
    margin: 0 0 8px 0;
    padding: 0 0 3px;
}

.detall_dialog div.col_30 {
    width: 173px;
}

.detall_dialog div.col_60 {
    width: 367px;
}

.detall_dialog div.col_50 {
    width: 260px;
}

.detall_dialog div.col_100 {
    width: 540px;
}

.detall_dialog div.valor, .form div.valor {
    margin: 0 0 12px 0;
}

.detall_dialog a {
    color: var(--label-primary-color) !important;
}

.form input:read-only {
    background-color: #f5f5f5;
    color: #aaa;
}

.enviar, .form input, .detall_dialog div input, tr.bultos input {
    border: 1px solid #ccc;
    padding: 4px 0px;
    font-size: 12px;
    color: #777;
    width: 98%;
}

td input[type="checkbox"] {
    width: auto !important;
}

.enviar:hover {
    text-decoration: none;
}

.form select {
    border: 1px solid #ccc;
    width: 100%;
}

.form select option {
    font-size: 12px;
    color: #777;
    padding: 2px 4px;
}

a.enviar, input.enviar, .detall_dialog div input.enviar, .form input.enviar {
    -moz-border-radius: 4px;
    width: auto;
    padding: 3px 6px;
    cursor: pointer;
    color: var(--label-primary-color);
    backround: #efefef;
}

.login-send{
    -moz-border-radius: 4px;
    width: 100% !important;
    padding: 3px 6px;
    cursor: pointer;
    color: var(--label-primary-color);
    background: #0A246A;
}

.errorMessage {
    color: #ff0000;
    padding: 2px 0 0 0;
}

.form textarea {
    border: 1px solid #ccc;
    padding: 4px 2px;
    font-size: 12px;
    color: #777;
    width: 99%;
}

.form div.buttons input {
    width: auto;
    cursor: pointer;
}

.detall_dialog table {
    width: 100%;
}

.detall_dialog table td, .detall_dialog table th {
    text-align: left;
    /*padding:2px;*/
}

.detall_dialog table span {
    color: var(--label-primary-color);
}

.col_radio {
    width: 43px;
}

.col_radio_input {
    width: 310px;
}

.col_25 {
    width: 285px;
}

.col_20 {
    width: 224px;
}

.col_15 {
    width: 182px;
}

.col_10 {
    width: 102px;
}

.col_8 {
    width: 80px;
}

.col_5{
    width: 60px;
}

.col_25.rol input, .col_25.rol label {
    float: left;
    width: auto;
    display: inline;
    margin: 0 5px 5px 0;
}

.col_25.rol.tarifes input, .col_25.rol.tarifes label {
    float: left;
    width: 40%;
    display: inline;
    margin: 0 5px 5px 0;
}

.col_25.rol.tarifes input[type="checkbox"] {
    float: left;
    width: 40%;
    display: inline;
    margin: 5px;
}

.espaiInf {
    margin: 0 0 14px;
}

.col_30_20 {
    width: 345px;
}

.col_30_15 {
    width: 372px;
}

.col_30 {
    width: 386px;
}
.col_40 {
    width: 472px;
}

.col_50 {
    width: 590px;
}

.col_60 {
    width: 794px;
}

.col_75 {
    width: 895px;
}

.espai {
    margin-right: 20px;
}

.espai_inferior {
    margin-bottom: 30px;
}

.espai_superior {
    margin-top: 30px;
}

.clear {
    clear: left;
}

.pager {
    text-align: left;
}

.pager ul, .pager ul li {
    float: none;
}

.pager a {
    font-weight: normal !important;
}

.pager li.selected a {
    background-color: var(--label-primary-color);
    border-color: #cccccc;
    color: #ffffff !important;
}

ul.yiiPager a:link, ul.yiiPager a:visited {
    background-image: url("img/fons_barra.png");
    background-position: left top;
    border: 1px solid #CCCCCC;
    color: var(--label-primary-color);
    font-weight: bold;
    padding: 3px 6px;
    text-decoration: none;
    -moz-border-radius: 4px;
}

ul.yiiPager a:hover {
    background-color: #efefef;
}

.pager li.selected a:hover {
    background-color: var(--label-primary-color);
}

ul.yiiPager .hidden a {
    border: 1px solid #DEDEDE;
    color: #888888;
}

.note {
    margin: 0 0 20px 0;
}

.errorSummary {
    /*
    float: left;
    display: inline;
    width: 100%;
    color: #ff0000;
    margin: 0 0 12px;*/
    font-size: 16px;
    padding: 10px 10px 10px 10px;
    margin-top: 15px;
    margin-bottom: 15px;
    border-radius: 6px;
    /*box-shadow: inset 0px 0px 15px #b9c1cb, 0px 0px 5px #adb8c4;*/
    box-shadow: inset 0px 0px 15px white, 0px 0px 5px #adb8c4;
    overflow: auto;
    background:var(--box-error-background);
    border:1px solid var(--box-error-border-color);
    min-width: 100px;
}

.errorSummary li {
    float: none;
    display: block;
    margin: 4px 0 0;
    list-style-type: circle;
}

td.subTaula {
    background: transparent;
}

td.subTaula:hover {
    background-color: #FFF887 !important;
    background-image: none !important;
}

.subTaula table {
    margin: 0px;
    margin: 10px 0 10px 20px;
    width: 1150px;
}

.subTaula table th {
    background-color: var(--label-primary-color);
    color: #FFF;
    border-right: 1px solid #ccc;
    border-left: 1px solid #999;
}


/*JQUERY UI CSS*/
.demoHeaders {
    margin-top: 2em;
}

#dialog_link {
    padding: .4em 1em .4em 20px;
    text-decoration: none;
    position: relative;
}

#dialog_link span.ui-icon {
    margin: 0 5px 0 0;
    position: absolute;
    left: .2em;
    top: 50%;
    margin-top: -8px;
}

ul#icons {
    margin: 0;
    padding: 0;
}

ul#icons li {
    margin: 2px;
    position: relative;
    padding: 4px 0;
    cursor: pointer;
    float: left;
    list-style: none;
}

ul#icons span.ui-icon {
    float: left;
    margin: 0 4px;
}

.ui-button-icon-only .ui-button-text {
    padding: 0.35em;
}

.ui-autocomplete-input {
    margin: 0;
    padding: 4px 4px 4px 4px;
    border-color: #ccc;
}

.error_td_vermell {
    color: #ff0000 !important;
    font-weight: bold;
}

.error_td_ambar {
    color: #ff6600 !important;
    font-weight: bold;
}

.error_vermell {
    color: #ff0000;
    cursor: help;
    font-weight: bold;
}

.error_ambar {
    color: #ff6600;
    cursor: help;
    font-weight: bold;
}

.pastilla_entrada_inactiva {
    background: var(--background-color-block-shipment);
    bottom: 0;
    float: left;
    position: fixed;
    width: 100%;
    opacity: 0.85;
    color: var(--color-text-block-shipment)
}

.pastilla_entrada_inactiva .centrar {
    margin: 0 auto;
}

.pastilla_entrada_inactiva p {
    padding: 12px 0;
    font: 14px/22px Arial, sans-serif;
    margin: 0px;
}

.check-shipment-activation-messages-list  {
    display: grid;
    list-style-type: disc;
    font: 14px/22px Arial, sans-serif;
    padding-bottom: 10px;
}

.check-shipment-activation-messages-list a{
    text-decoration: none; /* Elimina el subrayado */
    font-weight: bold; /* Aplica negrita */
    color: inherit; /* Mantiene el color original del texto */
}

.pastilla_entrada_inactiva a.enviar {
    background: #EFEFEF;
    display: block;
    margin: 11px 0 0;
}

.pastilla_entrada_inactiva input.enviar {
    background: #EFEFEF;
    display: block;
    margin: 11px 0 0;
}

.pastilla_entrada_avis {
    background: #ddba15;
    bottom: 0;
    float: left;
    position: fixed;
    width: 100%;
    opacity: 0.85;
}

.pastilla_entrada_avis .centrar {
    margin: 0 auto;
}

.pastilla_entrada_avis p {
    padding: 12px 0;
    font: 14px/22px Arial, sans-serif;
    color: #333;
    margin: 0px;
}

.pastilla_entrada_avis a.enviar {
    background: #EFEFEF;
    display: block;
    margin: 11px 0 0;
}

.pastilla_entrada_avis input.enviar {
    background: #EFEFEF;
    display: block;
    margin: 11px 0 0;
}

.pastilla_entrada_activa {
    background: var(--background-color-activate-shipment);
    bottom: 0;
    float: left;
    position: fixed;
    width: 100%;
    opacity: 0.85;
}

.pastilla_entrada_activa .centrar {
    margin: 0 auto;
}

.pastilla_entrada_activa input.enviar {
    background: #EFEFEF;
    display: block;
    margin: 11px 0 0;
}

.pastilla_entrada_activa a.enviar {
    background: #EFEFEF;
    display: block;
    margin: 11px 0 0;
}

.pastilla_entrada_activa p {
    padding: 12px 0;
    margin: 0px;
}

.pastilla_entrada_activa p, .pastilla_entrada_activa span, .pastilla_entrada_activa p * {
    font: 14px/22px Arial, sans-serif;
    color:var(--color-text-activate-shipment)
}

tr.bultos_partida td {
    background-image: none;
}

.ui-tabs {
    float: left !important;
    position: static !important;
    border-radius: 0px !important;
    padding: 0 !important;
    width: 100%;
}

.ui-tabs-nav {
    float: none;
    height: auto;
    border-radius: 0px !important;
    border: 0px !important;
    border-bottom: 1px solid #ccc !important;
    padding: 6px 0 0 2px !important;
}

.cercadorAvancat {
    width: var(--max-width-block);
    padding: 10px 10px;
    background: #efefef;
    border-radius: 10px;
    margin: 0 0 10px;
}

.cercadorAvancat .col_25 {
    width: 188px;
}

.cercadorAvancat .espai {
    margin-right: 10px;
}

.cercadorDataVenciment {
    width: var(--max-width-block);
    padding: 10px 10px;
    background: #efefef;
    border-radius: 10px;
    margin: 0 0 10px;
}

.cercadorDataVenciment .col_25 {
    width: 188px;
}

.cercadorDataVenciment .espai {
    margin-right: 10px;
}

.submenuInterior a.cercaAvancadaIco {
    background: url('img/lupaPlus.png');
    display: block;
    float: left;
    height: 16px;
    width: 16px;
    margin: -4px 0 0 0;
}

.submenuInterior a.cercaAvancadaIco span {
    display: none;
}

.submenuInterior i {
    display: block;
    float: left;
    height: 16px;
    width: 16px;
    margin: -4px 0 0 0;
}

.acordion {
}

.acordion .titolAcordion {
    background: #efefef url('img/accordion_dw.png') no-repeat 6px 10px;
    width: var(--max-width-block);
    float: left;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin: 0 0 1px 0;
}

.acordion .titolAcordion h3 {
    border: 0px;
    float: left;
    display: inline;
    width: 665px;
    margin: 1px 0 0 16px;
    padding: 2px 0;
    cursor: pointer;
    font-size: 12px;
}

.acordion .titolAcordion ul {
    float: right;
    display: inline;
    width: auto;
    margin: 5px 5px 0;
}

.acordion .titolAcordion li {
    float: left;
    display: inline;
    width: auto;
    margin: 0 0 0 5px;
    padding: 0 0 0 5px;
    border-left: 1px solid #ccc;
}

.acordion .titolAcordion dl {
    float: right;
    display: inline;
    width: auto;
    margin: 5px 0 0 0;
}

.acordion .titolAcordion dt {
    float: left;
    display: inline;
    width: auto;
    margin: 0 0 0 5px;
    padding: 0 0 0 5px;
    border-left: 1px solid #ccc;
}

.acordion .titolAcordion dt.primer {
    border: 0px;
}

.acordion .titolAcordion dd {
    float: left;
    display: inline;
    width: auto;
    margin: 0 0 0 5px;
    padding: 0 0 0 5px;
    width: 23px;
    text-align: right;
}

.acordion .titolAcordion dd.gran {
    width: 88px;
}

.acordion .contentAcordion {
    float: left;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin: 0 0 1px 0;
    width: var(--max-width-block);
    /*padding: 10px;*/
}

.acordion .marcatTitol {
    border-bottom: 0px;
    background: #fff url('img/accordion_up.png') no-repeat 6px 10px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.acordion .marcatTitol:hover {
    background: #FFF887 url('img/accordion_up.png') no-repeat 6px 10px;
}

.acordion .titolAcordion:hover {
    background: #FFF887 url('img/accordion_dw.png') no-repeat 6px 10px;
}

.acordion .marcatContent {
    margin-top: -1px;
    border-top: 0px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.loadingPagina {
    width: 128px;
    height: 15px;
    position: fixed;
    margin: auto auto;
    background: url('img/ajax-loader.gif') no-repeat;
    z-index: 100004;
}


.navbar {
    color: #fff;
}

.navbar {
    margin-bottom: 18px;
    overflow: visible;
    position: fixed;
    width: 100%;
    z-index: 500003;
}

.navbar-inner {
    background-color: #2C2C2C;
    background-image: -moz-linear-gradient(center top, #333333, #222222);
    background-repeat: repeat-x;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.1) inset;
    min-height: 40px;
    padding-left: 20px;
    padding-right: 20px;
    background-image: url('img/fons_barra.png');
    background-position: top center;
    background-color: #006dd2;

}


.navbar-inner .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
    width: 940px;
}

.navbar-inner .container:before, .navbar-inner container:after {
    content: "";
    display: table;
}

.navbar-inner .container:after {
    clear: both;
}

.navbar-inner .container:before, .navbar-inner .container:after {
    content: "";
    display: table;
}

.navbar .container {
    width: auto;
}

.navbar-inner .container {
    margin-left: auto;
    margin-right: auto;
}


.navbar .btn , .dropdown .dropbtn{
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: #F5F5F5;
    background-image: -moz-linear-gradient(center top, #FFFFFF, #E6E6E6);
    background-repeat: repeat-x;
    border-color: #E6E6E6 #E6E6E6 #B3B3B3;
    border-radius: 4px 4px 4px 4px;
    border-style: solid;
    border-width: 1px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 13px;
    line-height: 18px;
    margin-bottom: 0;
    padding: 4px 10px;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    vertical-align: middle;
}



.navbar .btn {
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
}


.navbar .btn, .navbar .btn-group {
    margin-top: 5px;
}

.navbar .btn {
    display: inline-block;
    line-height: 18px;
    margin: 5px 5px 6px;
    padding: 4px 10px;
}

.navbar .btn-navbar {
    background-color: #2C2C2C;
    background-image: -moz-linear-gradient(center top, #333333, #222222);
    background-repeat: repeat-x;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset, 0 1px 0 rgba(255, 255, 255, 0.075);
    display: none;
    float: right;
    margin-left: 5px;
    margin-right: 5px;
    padding: 7px 10px;
}

.navbar .brand {
    color: #fff;
    display: block;
    float: left;
    font-size: 20px;
    font-weight: 200;
    line-height: 1;
    margin-left: -20px;
    padding: 8px 20px 12px;
    cursor: default;
}

.navbar .brand {
    text-decoration: none;
}
.brand::after {
    content: '';
    color: #ffffff;
    font-size: 20px;
    display: inline-block;
    margin-left: 30px;
}

.navbar .nav {
    list-style: none outside none;
    margin-bottom: 18px;
    margin-left: 0;
    display: block;
    float: left;
    left: 0;
    margin: 0 10px 0 0;
    position: relative;
}

.navbar .nav li {
    line-height: 18px;
}


.navbar .nav.pull-right {
    margin-left: 10px;
    margin-right: 0;
}

.navbar .nav.pull-right {
    float: right;
}


.navbar .nav > li {
    display: block;
    float: left;
}


.navbar .nav > li > a {
    display: block;
}

.navbar .nav > li > a {
    color: var(--color-text-navbar);
    float: none;
    line-height: 19px;
    padding: 9px 10px 11px;
    text-decoration: none;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.navbar .nav .active > a, .navbar .nav .active > a:hover , .dropdown  .dropdown-content a:hover{
    background-color: #0560b5;
    color: #FFFFFF;
    text-decoration: none;
}

.navbar .dropup, .navbar .dropdown {
    position: relative;
}


.navbar .caret {
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #000000;
    content: "";
    display: inline-block;
    height: 0;
    opacity: 0.3;
    vertical-align: top;
    width: 0;
}

.navbar .dropdown .caret {
    margin-left: 2px;
    margin-top: 8px;
}

.navbar .nav li.dropdown .dropdown-toggle .caret, .navbar .nav li.dropdown.open .caret {
    border-bottom-color: #FFFFFF;
    border-top-color: #FFFFFF;
}


.navbar .dropdown-menu:after , .dropdown .dropdown-content:after{
    border-bottom: 6px solid #FFFFFF;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    content: "";
    display: inline-block;
    left: 10px;
    position: absolute;
    top: -6px;
}

.navbar .dropdown-menu:before , .dropdown .dropdown-content:before{
    /*border-bottom: 7px solid rgba(0, 0, 0, 0.2);*/
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    content: "";
    display: inline-block;
    left: 9px;
    position: absolute;
    top: -7px;
}

.navbar .dropdown-menu , .dropdown .dropdown-content{
    background-clip: padding-box;
    background-color: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    display: none;
    float: left;
    left: 0;
    list-style: none outside none;
    margin: 1px 0 0;
    min-width: 160px;
    padding: 4px 0;
    position: absolute;
    top: 100%;
    z-index: 1000;
}


.navbar .open .dropdown-menu {
    display: block;
}


.navbar .dropdown-menu a , .dropdown .dropdown-content a {
    clear: both;
    color: #333333;
    display: block;
    font-weight: normal;
    line-height: 18px;
    padding: 3px 15px;
    white-space: nowrap;
    min-width: 130px;
}

.navbar .nav .nav-header {
    color: #999999;
    display: block;
    font-size: 11px;
    font-weight: bold;
    line-height: 18px;
    padding: 3px 15px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
}

.navbar .nav li + .nav-header {
    margin-top: 9px;
}

.dropdown-menu li > a:hover, .dropdown-menu .active > a, .dropdown-menu .active > a:hover {
    background-color: #62a5e3;
    color: #FFFFFF;
    text-decoration: none;
}

.navbar .pull-right .dropdown-menu:after, .navbar .dropdown-menu.pull-right:after {
    left: auto;
    right: 13px;
}

.navbar .pull-right .dropdown-menu {
    left: -48px;
    width: 160px;
}

.navbar .dropdown-menu .divider {
    background-color: #E5E5E5;
    border-bottom: 1px solid #FFFFFF;
    height: 1px;
    margin: 8px 1px;
    overflow: hidden;
    width: 100%;
}


.navbar .pull-right span {
    color:var(--color-text-navbar);
}

.navbar .pull-right .dropdown-menu li span {
    color:var(--color-text-menu-navbar);
}



/* Contenedor del menú desplegable */
.dropdown {
    position: relative;
    display: inline-block;
}



.dropdown .dropbtn{
    color:var(--primary-text-color);
}

/* Contenido del menú desplegable (oculto por defecto) */
.dropdown .dropdown-content {
    display: none;
    position: absolute;

}

/* Mostrar el menú al pasar el ratón por encima */
.dropdown:hover .dropdown-content {
    display: block;
}



.ui-widget-overlay {
    z-index: 500004 !important;
}

.ui-dialog {
    z-index: 500005 !important;
}

.context-menu-item {
    display: block !important;
    float: none !important;
    width: 100% !important;
}

.menuMesInfo, .menuInfoAlbara li {
    float: left;
    width: 100%;
    display: inline;
    background: #efefef;
}

.menuMesInfo {
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    margin: -16px 0 20px -20px;
    width: 1197px;
}

.menuMesInfo li {
    width: auto;
    padding: 8px 12px;
    border-right: 1px solid #ccc;
}

.menuMesInfo li.marcat {
    background: #fff;
}

.menuMesInfo li.primer {
    border-left: 1px solid #ccc;
}

.mesInfoInterior {
    min-height: 500px;
}

.mesInfoInterior div.col_50 {
    width: 270px;
}

.mesInfoInterior .clear {
    clear: both;
}


[data-info-box] {
    position: relative;
    cursor: pointer;
}

.custom-info-box {
    position: absolute;
    top: -40px; /* Mueve el tooltip hacia arriba */
    left: 0px;
    transform: translateX(-50%);
    background: var(--primary-info-box); /* Fondo más claro con opacidad */
    color: white;
    padding: 6px 10px;
    border-radius: 5px;
    font-size: 17px;
    white-space: nowrap;
    box-shadow: 0px 4px 10px var(--primary-info-box-shadow-light), 0px 4px 15px var(--primary-info-box-shadow-dark); /* Efecto 3D */
    display: none; /* Por defecto está oculto */
    cursor: pointer;
    z-index: 9999; /* Asegura que el tooltip esté encima del contenido */
}

.tooltip {
    z-index: 1500 !important;
}

/** DOC AEREA **/
#partides-grid i.pns {
    margin: 0 2px;
    float: left;
    font-size: 15px;
}

#partides-grid i.hidden {
    display: none;
}

.llista tr.inactive td {
    background: #ec4b4b;
}

/** Botones **/
.btn {
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .25rem;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.btn-secondary {
    color: #fff;
    background-color: #6c757d;
    border-color: #6c757d;
}

.icon-gridView {
    color: #212529;
    transition: background-color 0.3s ease;
    padding: 1px;
    margin: 1px;
}

.icon-gridView:hover {
    color: var(--label-primary-color);
}

.tarifa_vinculada {
    color: #2a85d9;
}

.versio_tarifa {
    color: #000000;
    font-style: italic;
}

.preuSimulat {
    color: #0e90d2;
}

.warning_text {
    color: red;
}

.null_text {
    color: #004E96;
}

.warning-color {
    color: red;
}

.padding-top-10{
    padding-top: 10px;
}
.padding-bottom-10{
    padding-bottom: 10px;
}

.warning_div_message {
    font-size: 16px;
    padding: 5px 10px 7px 10px;
    /*box-shadow: inset 0px 0px 15px #b9c1cb, 0px 0px 5px #adb8c4;*/
    overflow: auto;
    text-align: center;
    border-radius:10px;
    padding:10px 10px 10px 36px;
    margin:10px;
    background:var(--box-error-background);
    border:1px solid var(--box-error-border-color);
}


.warning_emergent_box {
    font-size: 16px;
    padding: 2px 10px 7px 11px;
    margin-top: 15px;
    margin-bottom: 4px;
    border-radius: 6px;
    /*box-shadow: inset 0px 0px 15px #b9c1cb, 0px 0px 5px #adb8c4;*/
    box-shadow: inset 0px 0px 15px white, 0px 0px 5px #adb8c4;
    overflow: auto;
    border: 1px solid gray;
    position:fixed;
    top:50px;
    right: 20px;
    z-index:500001;
    background: linear-gradient(45deg, #007bff, #0e509e); /* Cambia los colores a tus preferencias */
    color: white; /* Cambia el color del texto a tu preferencia */
}

.warning_error_box {
    font-size: 16px;
    padding: 2px 10px 7px 11px;
    margin-top: 15px;
    margin-bottom: 4px;
    /*box-shadow: inset 0px 0px 15px #b9c1cb, 0px 0px 5px #adb8c4;*/
    overflow: auto;
    position:fixed;
    top:50px;
    right: 20px;
    z-index:500001;
    /*box-shadow: inset 0px 0px 15px #b9c1cb, 0px 0px 5px #adb8c4;*/
    overflow: auto;
    border-radius:10px;
    background:var(--box-error-background);
    border:1px solid var(--box-error-border-color);
}

.warning_error_box .closeButton {
    float: right;
    display: inline-block;
    padding-top: 5px;
}

.error-box-colors{
    background:var(--box-error-background)!important;
    border:1px solid var(--box-error-border-color)!important;
}

.success-box-colors{
    background:var(--box-success-background)!important;
    border:1px solid var(--box-success-border-color)!important;
    color:var(--primary-text-color)!important;
}

.success-box-colors-hover:hover{
    background:var(--box-success-background-hover)!important;
    border:1px solid var(--box-success-border-color-hover)!important;
    color:var(--secondary-text-color)!important;
}

.warning-box-colors{
    background:var(--box-warning-background)!important;
    border:1px solid var(--box-warning-border-color)!important;
}

.notice-box-colors{
    background:var(--box-notice-background)!important;
    border:1px solid var(--box-notice-border-color)!important;
}

div.breadcrumbs {
    font-size: 0.9em;
    padding: 5px 20px;
}

div.breadcrumbs span {
    font-weight: bold;
}

.llegenda-pns i{
    padding:1px;
}

.check-table-grid-view{
    display: flex!important;
    justify-content: center;
    align-items: center;
}

.check-table-grid-view span{
    margin-left: 5px;
}
.check-ok{
    color: var(--color-check-ok);
}

.check-not-set
{
    color: var(--color-check-not-set) !important;
}
.check-no-ok{
    color:var(--color-check-not-ok) !important;
}

.check-warning{
    color:var(--color-check-warn) !important;
}

.dark-color{
    color:black !important;
}

.pointer{
    cursor:pointer;
}

.sticky-admin{
    position: sticky;
    top: 50px;
}

.grid-view.permission-table table.items thead{
    position: sticky;
    top: 170px;
    z-index: 9999;
}

.grid-view.permission-table table.items tbody{
    z-index: 9998;
}

#permissions .header{
    z-index: 9999;
    position: sticky;
    top: 70px;
    background-color: white;
}


.icon-button i {
    margin-right: 1px; /* Adjust the spacing between the icon and the button text */
}

.centered-icon {
    display: flex;
    justify-content: center; /* Alineación horizontal al centro */
    align-items: center; /* Alineación vertical al centro */
    width: 100px; /* Ajusta el ancho del contenedor según tus necesidades */
}

/* Estilos para el modal */
.modal {
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    z-index: 1000;
    width: 100%;
    height: 100%;
    /*background-color: rgba(0, 0, 0, 0.5);*/
    overflow: auto; /* Añadir desplazamiento si el contenido es demasiado grande */
}

.modal-content {
    background-color: #fff;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    text-align: center;
    max-width: 80%; /* Establecer un ancho máximo para el contenido */
}

.m-0 {
    margin: 0 !important;
}

.m-1 {
    margin: 0.25rem !important;
}

.m-2 {
    margin: 0.5rem !important;
}

.m-l0 {
    margin-left: 0 !important;
}

.m-l1 {
    margin-left: 0.25rem !important;
}

.m-l2 {
    margin-left: 0.5rem !important;
}

.white-color{
    color:white !important;
}

/* Estilo para los labels con la clase "required" */
.form-group label.required::after {
    content: " *"; /* Agrega el asterisco después del contenido del label */
    color: red; /* Cambia el color del asterisco a rojo */
}

h3.tittle-label{
    color: var(--label-primary-color);
}

.clear-float{
    float:none !important;
}

.color-red{
    color: var(--color-red);
}

.color-blue{
    color: var(--color-blue);
}

.inline-flex{
    display: inline-flex;
}

.inline-grid{
    display: inline-grid;
}

.no-border{
    border:none !important;
}

.text-bg-yellow-marker{
    background-color: var(--color-yellow);
}

.middle-font{
    font-family: tahoma, sans-serif;
    font-size: 16px;
}

.border-color-red{
    border-color: var(--color-red) !important;
}

.sample ,.hidden{
    display: none!important;
}


.th-bold-link th a{
    font-size: calc(var(--font-size-standar) + 2px);
    font-weight: bold;
}

.th-bold-link th{
    font-size: calc(var(--font-size-standar) + 2px);
    font-weight: bold;
}


.ml-1{
    margin-left: 10px;
}

.ml-2{
    margin-left: 10px;
}

.mr-1{
    margin-right: 10px;
}
.mr-2{
    margin-right: 20px;
}

.pointer-hover{
    cursor:pointer;
}

/* Estilos para el fondo oscuro */
.overlay-prompt {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;

}

.text-align-end{
    text-align: end;
}

/* Estilos para el cuadro de diálogo */
.dialog-prompt {
    background: #fff;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    text-align: center;
    width: 50vw; /* 50% del ancho de la pantalla */
    min-height: 100px;
    max-width: 400px; /* Ajusta según tus necesidades */
    display: flex;
    flex-direction: column; /* Añade esto para manejar verticalmente */
    justify-content: center; /* Centra verticalmente */
    margin: auto; /* Centra horizontalmente */
}

.button{
    padding: 3px 6px;
    color: var(--color-blue);
    border: 1px solid #ccc;
    font-size: var(--font-size-standar);
    background-color: var(--color-background-gray);
}

.width-100{
    width: 100%!important;
}

.non-width{
    width: auto!important;
}
.m-all-1{
    margin: 10px 10px 10px 10px;
}

/* Estilo para el contenedor del select */
.div-select-inline-container {
    display: inline-block;
    white-space: nowrap; /* Evita que los elementos se rompan en nuevas líneas */
    overflow-x: auto; /* Muestra el scroll horizontal si es necesario */
}

/* Estilo para el select múltiple */
#select-items-inline {
    display: inline-block;
    vertical-align: middle; /* Alinea verticalmente con otros elementos en línea */
    height: 2em; /* Ajusta la altura según tus necesidades */
    overflow-y: hidden; /* Oculta la barra de desplazamiento vertical */
}

#select-items-inline option {
    display: inline-block;
}

.color-style-button-primary{
    color:var(--white-color)!important;
    background-color: var(--primary-background-color)!important;
}

.color-style-button-primary:hover{
    background-color: var(--primary-background-color-hover)!important;
}

.no-float{
    float:none !important;
}
.mx-auto{
    margin: 0 auto;
}

.mt-0{
    margin-top: 10px!important;
}
.mb-15{
    margin-bottom: 15px!important;
}


.container-card{
    border: 1px solid #ccc;
    border-radius: 4px;
    margin: 10px 0px 10px 0px;
    padding: 10px 5px 10px 5px;
    overflow: hidden;
}

.clickable{
    cursor:pointer;
}


.mb-0{
    margin-bottom: 0px!important;
}

.mb-10{
    margin-bottom: 10px!important;
}

.default-font-size{
    font-size: var(--font-size-standar)!important;
}


.error-summary-extra-style{
    margin: 4px 0 4px 20px;
    width: 1046px;
    width: 1046px;
}


/* Define la clase para el icono */
.button-column .warning i{
    color: black; /* Color inicial del icono */
    transition: color 2s; /* Transición suave del color durante 1 segundo */
}

/* Define una clase de animación para cambiar el color */
@keyframes changeColor {
    0% { color: black; } /* Inicia con color negro */
    50% { color: var(--warning-color) } /* Cambia a color rojo a la mitad del tiempo de animación */
    100% { color: black; } /* Vuelve a color negro al final */
}

/* Aplica la animación al icono cada 2 segundos */
.button-column .warning i{
    animation: changeColor 4s infinite; /* Repite la animación cada 4 segundos (2 segundos para cada transición) */
}


.div-check-box{
    margin-top: 8px;
}
.div-check-box input{
    width: auto;
    margin-right: 10px;
}




.w-40-m-auto{
    width: 40%;
    margin: auto;
}

.w-45-m-auto{
    width: 45%;
    margin: auto;
}

.w-50-m-auto{
    width: 50%;
    margin: auto;
}

.input-border input{
    border:1px solid;
}

.center-icon-taula-app{
    display: flex !important;
    justify-content: center;
    align-items: center;"
}

.float-right{
    float: right;
}

.float-left{
    float: left;
}


.readonly-checkbox {
    pointer-events: none;
}

.split-text {
    display: inline-block;
    white-space: nowrap; /* Prevent line breaks when copying */
}

.split-text::after {
    content: "\A";
    white-space: pre; /* Maintain the newline in the visual rendering */
}

.copyable-text {
    position: relative;
    cursor: cell; /* Cambia el cursor al pasar el ratón */
}

.copyable-text::before {
    content: attr(data-full-text);
    position: absolute;
    left: -9999px; /* Position it off-screen */
}

.mb-10{
    margin-bottom: 10px;
}

a.btn-primary {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    user-select: none;
    border: 1px solid var(--primary-border-color);
    color: var(--primary-background-color);
    text-decoration: none;
    padding: 3px 6px;
}
a.btn-primary:hover{
    text-decoration: none;
    color: var(--select-text-color);
    background: var(--primary-background-color);
}

.custom-fa-2x{
    font-size: 1.5em;
}

.inline-input{
    display: flex;
    align-items: center;
}

.inline-input input[type="checkbox"]{
    margin-right:10px ;
}

h2 button {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: #F5F5F5;
    background-image: -moz-linear-gradient(center top, #FFFFFF, #E6E6E6);
    background-repeat: repeat-x;
    border-color: #E6E6E6 #E6E6E6 #B3B3B3;
    border-radius: 4px 4px 4px 4px;
    border-style: solid;
    border-width: 1px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
    color: var(--primary-text-color);
    cursor: pointer;
    display: inline-block;
    font-size: 13px;
    line-height: 18px;
    margin-bottom: 0;
    margin-right: 5px;
    margin-left: 5px;
    padding: 5px 10px;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    vertical-align: middle;
}


h2 button a {
    color:var(--primary-text-color);
    text-decoration: none;
}

h2 button a:hover {
    color:var(--color-blue);
    text-decoration: none;
}

/* Añadir la animación de vibración */
@keyframes shake {
    0% { transform: translateX(0); }
    25% { transform: translateX(-1px); }
    50% { transform: translateX(1px); }
    75% { transform: translateX(-1px); }
    100% { transform: translateX(0); }
}

.bellIcon.shake {
    animation: shake 0.5s; /* Duración de la vibración */
    animation-iteration-count: 10; /* Repetir la animación 4 veces (2 segundos) */
}

h2 button , .icon-button , .driver-button{
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: #F5F5F5;
    background-image: -moz-linear-gradient(center top, #FFFFFF, #E6E6E6);
    background-repeat: repeat-x;
    border-color: #E6E6E6 #E6E6E6 #B3B3B3;
    border-radius: 4px 4px 4px 4px;
    border-style: solid;
    border-width: 1px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
    color: var(--primary-text-color);
    cursor: pointer;
    display: inline-block;
    font-size: 13px;
    line-height: 18px;
    margin-bottom: 0;
    margin-right: 5px;
    margin-left: 5px;
    padding: 5px 10px;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    vertical-align: middle;
}

h2 button a {
    color:var(--primary-text-color);
    text-decoration: none;
}

h2 button a:hover {
    color:var(--color-blue);
    text-decoration: none;
}

.driver-button {
    margin-bottom: 5px;
}

.box-icon{
    width: var(--default-box-icon);
    height: var(--default-box-icon);
    color: var(--primary-text-color)!important;
}

.d-il{
    display: inline;
}


.icon-align-center-grid-view{
    display: flex!important;
    justify-content: center;
    align-items: center;
}


.highlight-border {
    border: 2px solid var(--highlight-border); /* Color del borde cuando cambia */
    transition: border-color 0.5s ease-in-out; /* Efecto de transición */
}

.glow-effect {
    box-shadow: 0 0 6px 1px var(--shadow-glow); /* Resplandor */
    transition: box-shadow 0.5s ease-in-out; /* Animación suave */
}

.no-glow-effect {
    box-shadow: 0 0 0 0 rgba(72, 239, 128, 0); /* Elimina gradualmente el resplandor */
    transition: box-shadow 0.5s ease-in-out; /* Asegura una transición suave */
}

.transport-button-update-delivery-note{
    position: absolute;
    right: -5px;
    top: -5px;
}

.warning-count-status{
    color: var(--warning-color);
}

.mx-auto{
    margin: 0 auto;
}

.spaced-box-12{
    margin: 0 12px 10px 0;
    width: auto;
}