/* 
	STILE DELLA STRUTTURA GENERALE DELLE PAGINE
	ver 1.00 del 08/11/2024
*/

@charset "utf-8";

/* CSS RESET */
    html, body, p, ul ,li, div, header, nav, section, article, aside, footer, hgroup, span, h1, h2, h3, h4, h5, h6, a{
        margin: 0;
        padding: 0;
        font-family: 'Calibri', sans-serif;
        font-size: 14px;
        box-sizing: border-box;
        color: #C8C8C8;
    }

/* IMPOSTAZIONI GENERALI DELLA PAGINA */
    body{
        width: 100%;
        min-width: 1334px;
        background-color: #444444;
    }
    img{
        border: 0;
        margin: 0;
        padding: 0;
    }
    ul, ol{
        list-style: none;
    }
    a{
        text-decoration: none;
    }
    a:hover{
        text-decoration: underline;
    }
    b{
        color: #eee;
    }
    hr{
        margin: 15px 0;
    }

    .clearfix::after {
        content: "";
        clear: both;
        display: table;
    }

    /* Scollbar */
    * {
        scrollbar-width: thin;
        scrollbar-color: #656565 #4e4e4e;
    }
    /* Works on Chrome/Edge/Safari */
    *::-webkit-scrollbar {
        width: 12px;
    }
    *::-webkit-scrollbar-track {
        background: #4e4e4e;
    }
    *::-webkit-scrollbar-thumb {
        background-color: #656565;
        border-radius: 20px;
        border: 3px solid #4e4e4e;
    }

    .not_visible{
        display: none;
    }

/* MESSAGGI */
    .msg_errore{
        font-size: .8em;
        color: #fc4f24;
        margin: 0px 4px 5px 2px;
    }
    .msg_ok{
        font-size: .8em;
        color: #e9c62a;
        margin: 0px 4px 5px 2px;
    }
    .msg_info{
        font-size: .9em;
        color: #a0a0a0;
    }
    

/* SPAZIO INTESTAZIONE */
    #spazio_intestazione{
        position: fixed;
        z-index: 10;
        top: 0;
        width: 100%;
        border-top: 10px solid #444444;
        margin-top: 0;
        height: 60px;
        background-color: #2a2a2a;
        padding: 0 20px;
    }

    /* Nome Azienda */
    #nome_azienda{
        padding-top: 7px;
        width: 350px;
        float: left;
    }

    /* Menu Principale */
    #menu_principale{
        position: absolute;
        right: 0;
        text-align: right;
        top: 15px;
    }
    #menu_principale ul{
        margin-right: 20px;
    }
    #menu_principale li{
        font-size: 16px;
        color: #999
    }
    #menu_principale a{
        font-size: 14px;
        color: #fff;
    }

    /* Menu Inline */
    .menu_inline li{
        font-size: 12px;
        display: inline;
        padding-right: .8em;
    }
    .menu_inline li:last-of-type{
        padding-right: 0;
    }
    .menu_inline a:hover{
        text-decoration: underline;
        cursor: pointer;
    }
    .menu_inline li:hover{
        cursor: default;
    }

    /* Riferimento per il calcolo delle dimensioni delle griglie */
    #ref_page_bg{
        width: 100%;
        height: 100%;
        left: 0px;
        top: 0px;
        position: absolute;
        opacity: 0;
        display: block;
    }

/* CORPO DELLA PAGINA */
    #corpo_pagina{
        min-width: 280px;
        margin: 7px auto 0 auto;
        padding: 65px 20px 0px 20px;	
        position: relative;
    }
    .spazio_dx{
        float: right;
        text-align: right;
    }
    .spazio_dx button{
        margin-left: 20px;
    }
    .spazio_dx input[type="text"]{
        margin-left: auto;
    }

    .spazio_sx{
        float: left;
        text-align: left;
    }
    .spazio_sx button{
        margin-right: 20px;
    }

/* MENU PRINCIPALE */
    #spazio_centrale_menu{
        margin: 0 auto;
        padding-top: 20px;
    }
    .colonna_menu {
        width: 230px;
        position: relative;
        float: left;
        border-right: 1px solid #808080;
        min-height: 250px;
        margin-left: 25px;
    }
    .colonna_menu:first-of-type {
        margin-left: 0px; 
        border-left: 1px solid #808080; 
        padding-left: 25px;
    }
    .colonna_menu h2{
        font-size: 12px;
        margin-top: 15px;
        margin-bottom: 10px;
        color: #808080;
        text-decoration: underline;
        text-transform: uppercase;
    }
    .colonna_menu ul{
        margin-bottom: 35px;
    }
    .colonna_menu li {
        font-size: 1.1em;
        margin-bottom: 5px;
    }

    .link_disabilitato li{
        color: #555555; 
        cursor: default;
    }
    .link_disabilitato:hover{
        text-decoration: none;
    }

/* PIE' DI PAGINA */
    #spazio_pie_pagina{
        width: 100%;
        height: 105px;
        background-color: #2a2a2a;
        border-top: 5px solid #3a3a3a;
        padding: 10px 20px;
        margin-top: 80px;
    }
    /* Pie di Pagina */
    #pie_pagina{
        width: 100%;
        height: 63px;
        margin: 0 auto;
    }
    #pie_pagina p{
        font-size: .9em;
    }
    /* Colonna SX */
    #colonna_sx{
        float: left;
    }
    #colonna_sx h2{
        font-size: 1.1em;
        margin-bottom: 8px;
    }

    /* Colonna DX */
    #colonna_dx{
        float: right;
        text-align: right;
        position: relative;
    }
    #colonna_dx p{
        margin-bottom: 8px;
    }
    #colonna_dx span{
        font-size: .8em;
        color: #838383;
    }


/* PULSANTI */
    button[type="button"]{
        height: 29px;
        padding: 0 16px;
        background: linear-gradient(#606060, #515151);
        border: 1px solid #1d1d1d;
        border-radius: 4px;
        margin-bottom: 5px;
        color: #c8c8c8;
        width: fit-content;
        cursor: pointer;
        padding-bottom: 3px;
    }
    button[type="button"]:hover{
        color: #3399ff;
    }
    button:disabled, button[disabled]{
        background: #303030;
        color: #606060;
        cursor: default;
    }
    button:disabled:hover, button[disabled]:hover{
        color: #606060;
    }
    button[type="button"]:active, button[type="button"]:focus{
        border: 1px solid #c09412;
    }

/* INPUTBOX */
    /* Label */
    label{
        font-size: 12px;
        color: #aaa;
        position: relative;
        display: block;
        font-weight: normal;
        margin-bottom: 4px;
        padding-left: 5px;
    }

    label.lab_input_inline{
        font-size: 12px;
        color: #aaa;
        display: inline-block;
        font-weight: normal;
        margin-right: 6px;
    }

    /* Testo libero sotto una label */
    p.lab_info_input{
        color: #eee;
        position: relative;
        display: block;
        font-weight: normal;
        margin-bottom: 10px;
        padding-left: 5px;
    }
    
    .annotazione{
        font-size: 11px;
        color: #838383;
    }

    /* Inputbox */
    input:focus, select:focus, textarea:focus, button:focus {
        outline: none;
    }
    input {
        outline: none;
    }
    input[type="text"], input[type="password"], textarea{
        font-family: 'Calibri', sans-serif;
        font-size: 14px;
        display: block;
        margin-bottom: 10px;
        padding: 4px 8px 6px 8px;
        border: 1px solid #505050;
        background-color: #2a2a2a;
        border-radius: 4px;
        transition: all 0.2s linear;
        box-sizing: border-box;
        width: 100%;
        color: #c8c8c8;
    }
    input[type="text"]:active, input[type="password"]:active, textarea:active,
    input[type="text"]:focus, input[type="password"]:focus, textarea:focus{
        border: 1px solid #c09412;
    }
    textarea{
        resize: none;
        font-family: 'Calibri', sans-serif;
        font-size: 14px;
    }
    .testo_centrato{
        text-align: center;
    }
    input[type="text"].riga_doppia{
        margin-bottom: 3px;
    }

    /* Lunghezza dei Campi */
    .inputbox_testo_breve{
        max-width: 140px;
    }
    .inputbox_testo_medio{
        max-width: 250px;
    }
    .inputbox_data, .inputbox_data_ora{
        max-width: 125px;
        text-align: center;
    }
    .inputbox_int, .inputbox_dec, .inputbox_4dec{
        max-width: 120px;
        text-align: center;
    }


/* SPAZIO PER CASELLE DI INPUT CON L'ICONA (I) DI INFO */
    .inputbox_con_info{
        position: relative;
    }
    .inputbox_con_info img{
        position: absolute;
        top: 20px;
        right: -25px;
    }


/* COMBOBOX */
    select{
        font-family: 'Calibri', sans-serif;
        font-size: 14px;
        padding: 4px 25px 4px 8px;
        font-size: 14px;
        display: block;
        min-width: 55px;
        width: 100%;
		max-width: max-content;

        border: 1px solid #505050;
        border-radius: 4px;
        transition: all 0.2s linear;
        color: #c8c8c8;
        box-sizing: border-box;

        background: url('../_images/ic_expand_more_white_18dp.png') no-repeat 100% 1px #2a2a2a;

        -webkit-appearance: none; /* gets rid of default appearance in Webkit browsers*/
        -moz-appearance: none; /* Get rid of default appearance for older Firefox browsers */
        -ms-appearance: none; /* get rid of default appearance for IE8, 9 and 10*/
        appearance: none;
        margin-bottom: 10px;
    }
    select:active, select:focus{
        border: 1px solid #c09412;
    }

/* TABELLE DI DATI */
    .spazio_tbl_elenco{
        position: relative;
    }
    .intestazione_griglia{
        text-transform: uppercase;
        margin-bottom: 10px;
        color: #808080;
        font-size: 12px;
        display: inline-block;
        padding-right: 20px;
    }

    .tbl_container_title{
        border: 1px solid #846a1e;
        overflow-y: scroll;
        border-bottom: 0;
        padding-bottom: 1px;
    }
    .tbl_container_title tr{
        background-color: #444444;
    }

    .tbl_container{
        border: 1px solid #846a1e;
        overflow-y: scroll;
        border-top: 0;
        position: relative;
    }
    .tbl_container tbody{
        color: #c8c8c8;
    }
    .loader_contenuti_griglia{
        position: absolute;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        text-align: center;
        margin-top: 100px;
    }
    .loader_contenuti_griglia_voci{
        position: absolute;
        top: 0;
        right: 20px;
        display: none;
    }

    table, th, td {
        border: 1px solid black;
        border-collapse: collapse;
        text-align: left;
        padding: 4px 6px;
        
        -webkit-touch-callout: none; /* iOS Safari */
        -webkit-user-select: none; /* Safari */
        -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
        user-select: none; 
    }
    table{
        width: 100%;
        color: #aaa;
    }
    th, td{
        max-width: 0px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    tr{
        background-color: #2a2a2a;
    }
    tr:hover{
        background-color: #4e4e4e;
    }
    .td-right{
        text-align: right;
    }
    .td-center{
        text-align: center;
    }

    .item_sotto_target{
        color: #f00;
    }
    .item_sotto_scorta{
        color: #f00;
    }
    .item_dentro_qt_virtuale{
        color: rgb(230, 226, 18);
    }

    .riga_sel{
        background-color: #a5831e;
        color: #000 !important;
    }
    .riga_sel:hover{
        background-color: #c09412;
    }

    .info_items_su_griglia{
        margin-top: 6px;
    }
    .info_items_su_griglia span{
        font-weight: bold;
        color: #fff;
    }


/* FOOTER PAGINE */
    #footer_fisso{
        position: fixed;
        z-index: 20;
        bottom: 0px;
        width: 100%;
        border-bottom: 12px solid #444444;
        height: 60px;
    }
    .footer_pag{
        border-top: 1px solid #1a1a1a;
        border-bottom: 1px solid #1a1a1a;
        background-color: #2a2a2a;
        padding: 7px 20px 2px 20px;
        height: 45px;
        position: relative;
        z-index: 20;
    }
    .footer_pag p{
        font-size: .8em;
    }
    .footer_elenco{
        position: absolute;
        width: 100%;
        bottom: 10px;
    }
    .footer_edit{
        position: relative;
        margin-top: 10px;
    }    
    .spazio_footer_dx{
        width: auto;
        float: right;
        text-align: right;
    }
    .spazio_footer_sx{
        width: auto;
        float: left;
        text-align: left;
    }
    .spazio_footer_sx button{
        margin-right: 10px;
    }


/* ELEMENTI DEI FORM DI INSERIMENTO */
    .intestazione_form{
        text-transform: uppercase;
        margin-bottom: 10px;
        color: #808080;
        font-size: 12px;
        border-bottom: 1px solid #808080;
        display: inline-block;
        padding-right: 20px;
        cursor: default;
    }
    .spazio_su_giu{
        margin-top: 20px;
    }
    .flex_column_container {
        display: flex;
        flex-wrap: nowrap;
        gap: 30px;
    }
    .flex_container {
        display: flex;
        flex-wrap: nowrap;
        gap: 16px;
    }
    .flex_col{
        flex: 1 1 0;
    }

    
/* PAGINE DI ELENCO */
    /* AREA ELENCO ITEM */
    #corpo_griglie{
		margin-right: 235px;
	}
    .spazio_info_griglia{
		margin-top: 10px;
		position: relative;
		height: 35px;
	}
	.spazio_info{
		float: left;
        text-align: left;
	}
    .spazio_comandi_griglia{
        margin-top: 10px;
		position: relative;
    }

    /* Spostaemnto tra le Pagine */
	.pag_griglia{
		width: 150px;
		float: right;
	}
    .pag_griglia p{
		padding-top: 6px;
		text-align: center;
		margin-left: 40px;
	}

	#btn_pag_indietro{
		width: 30px;
		float: left;
		padding: 0;
	}
	#btn_pag_avanti{
		width: 30px;
		float: right;
		padding: 0;
	}
	#num_pag_griglia{
		width: 35px;
		float: left;
		margin-left: 5px;
	}
	#num_pag_componenti{
		width: 35px;
		float: left;
		margin-left: 5px;
	}
    #num_pag_caschi{
		width: 35px;
		float: left;
		margin-left: 5px;
	}

    .linea_tra_griglie{
        width: 40%;
        margin: 0px;
        height: 1px;
        border: 0;
        border-top: 1px solid #666;
        margin: 15px 0;
    }


	/* COLONNA FILTRI */
    #spazio_cmd_e_filtri{
		float: right;
		height: 600px;
		width: 215px;
		margin-left: 20px;
        padding-right: 10px;
		position: relative;
		overflow-y: auto;
	}
    #spazio_cmd_e_filtri button[type="button"]{
        width: 100%;
    }
    #spazio_cmd_e_filtri .flex_container{
		gap: 16px;
	}
	#spazio_cmd_e_filtri .select{
		width: 100%;
        max-width: 100%;
	}

    #titolo_spazio_filtri{
		cursor: pointer;
		display: inline;
	}
	#titolo_spazio_filtri:hover{
		color: #3399ff;
	}
	#icona_spazio_filtri{
		display: inline-block;
		width: 36px;
		height: 8px;
		overflow: hidden;
		background-image: url("../_images/ic_filtro_apri_chiudi.png");
  		background-repeat: no-repeat;
		background-position: left top;
	}
	.ajax_loader{
		position: absolute; 
		top: 7px; 
		right: 8px; 
		display: none;
	}
	
	#spazio_filtri{
		transition: all 5.5s linear;
		overflow-y: hidden;
        height: auto;
	}


/* SPAZI GRIGLIE E FILTRI DI SELEZIONE VOCI VARIE */
    .corpo_griglie_selezione{
        margin-right: 235px;
    }
    .spazio_cmd_e_filtri_selezione{
		float: right;
		height: auto;
		width: 215px;
		margin-left: 20px;
		position: relative;
		overflow-y: auto;
	}
    .spazio_cmd_e_filtri_selezione button[type="button"]{
        width: 100%;
    }
    .spazio_cmd_e_filtri_selezione .flex_container{
		gap: 16px;
	}
	.spazio_cmd_e_filtri_selezione .select{
		width: 100%;
        max-width: 100%;
	}
	

/* PAGINE DI EDIT */
    #spazio_edit{
        margin: 0 auto;
    }
    #col_edit_sx{
        float: left;
        position: relative;
    }
    #col_edit_centro{
        float: left;
        margin-left: 20px;
        position: relative;
    }
    #col_edit_dx{
        float: right;
        position: relative;
    }

    #info_edit{
        text-align: right;
        margin-top: -10px;
    }

    .testo_info{
        font-size: 12px;
    }
    .loader_salvataggio{
        display: none;
    }
    .area_info_salvataggio{
        text-align: right;
        padding: 8px 35px 16px 35px;
    }

/* OVERLAY E SPAZI DI EDITING OVER EDIT */
    .overlay{
        position: fixed;
        z-index: 15;
        width: 100%;
        height: 100%;
        left: 0px;
        top: 0px;
        background-color: rgba(68,68,68,0.8);
        display: none;
    }
    .ajax_loader_over_edit{
        position: absolute; 
        top: 20px; 
        right: 25px; 
        display: none;
    }

    .spazio_over_edit{
        position: absolute;
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto;
        background-color: #4a4a4a;
        border-radius: 3px;
        border: 1px solid #000;
        box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);

        margin-top: 150px;
        width: 500px;
        height: auto;
        padding: 15px 15px 60px 15px;
    }
    .barra_cmd_over_edit{
        position: absolute;
        border-top: 1px solid #1a1a1a;
        border-bottom: 1px solid #1a1a1a;
        background-color: #2a2a2a;
        padding: 7px 20px 2px 20px;
        bottom: 10px;
        left: 0px;
        width: 100%;
    }
    button.btn_annulla_over_edit{
        float: left;
        width: 40%;
    }
    button.btn_salva_over_edit{
        float: right;
        width: 40%;
    }