/* ==== index OBS ==== */

/* ==== Section RECORDS ==== */
.records-card {
    width:100%;
    padding:15px;
    background:repeating-linear-gradient(
        0deg,
        #07175a,
        #07175a 2px,
        #0b267d 3px
    );
    background-size: 2px 2px;
    border:3px solid #273cff;
    border-radius:6px;
    box-shadow:
        0px 0px 9px 2.25px rgba(0, 0, 0, 0.5),
        inset 0px 50px 60px 0px rgba(0, 0, 0, 0.5),
        inset 0px 0px 21px 0px rgba(255, 255, 255, 0.13);
    color:white;
    font-family: "Jersey 25", sans-serif;
}
.record {
    width:100%;
    padding:8px;
    border-radius:6px;
    margin: 10px 10px;
}
.record table{
    width:100%;
    font-size:0.875rem;

}
.records-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0 15px 10px;
}
.source-logo img{
    height:55px;
    width:auto;
}
/* ==== Section TAB DATI ==== */
/* schede select parametri */
.tabs {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0px 8px 8px;
}
.tab-group {
    display:flex;
    gap:5px;
}
.tab {
    display:inline-block;
    padding:4px;
    margin-right:5px;
    border-radius:5px;
    cursor:pointer;
}
.tab:hover {
    border-bottom:1px solid #fff;
}
.tab.active {
    color:#ffd21f;
    border-bottom:1px solid #ffd21f;
}
.hidden {
    display:none;
}
.update-btn {
    padding:10px;
    border:none;
    border-radius:6px;
    background:#0FFF50;
    color:black;
    cursor:pointer;
    font-size:0.875rem;
}
.update-btn:hover {
    opacity:0.85;
}
table {
    width:100%;
    border-collapse:collapse;
    background:white;
}

th {
    background:#1b4f72;
    color:white;
    cursor:pointer;
}

td.time {
    color: #FFBF00;
    white-space: nowrap;
}
.temp {
    font-weight:bold;
}

.wind {
    color:#dedede;
}
.sort-icon {
    font-size:0.75rem;
    margin-left:4px;
    opacity:0.8;
}
.observations {
    width:98%;
    /*background-color: rgba(0,0,0,0) !important; */
    background:#0088ce;
    color:white;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
    text-shadow: 1px 1px 1px #000;
    font-size:0.875rem;
    margin: 0 auto;
}
.observations tr:nth-child(2n) {
  background-color: rgba(255,255,255,0.2);
}
.observations th {
    background-color: #2b3990;
    opacity: 0.8;
    background-size: 2px 2px;
    background-image: repeating-linear-gradient(0deg, #05056c, #05056c 1px, #2b3990 1px, #2b3990);
    text-align:left;
}
.observations td {
    padding: 0.05em .5em;
    border-bottom: 1px solid #D3D3D3;
}


/* --- OTTIMIZZAZIONE RESPONSIVE (SMARTPHONE) --- */
@media (max-width: 767px) {

    .observations td, .observations th {
        padding: 1px;
    }
    .tab-group {
        gap:1px;
    }
    .tabs, .tab {
        padding:2px;
    }    
    .update-btn {
        padding:2px;
    }    
}