/* Tema ispirato a fer.it: navy #102646, rosso #d22e1c, grigio #ECEDED, font Istok Web */
body { font-family: 'Istok Web', Arial, sans-serif; background: #ECEDED; color: #202020; padding: 0; margin: 0; }

.topbar-wrap { background: #fff; border-bottom: 4px solid #d22e1c; }
.topbar { display: flex; justify-content: space-between; align-items: center; padding: 14px 28px; background: #fff; }
.brand { display: flex; flex-direction: column; }
.brand-main { font-size: 24px; font-weight: 700; color: #102646; }
.brand-sub { font-size: 12px; color: #666; text-transform: uppercase; letter-spacing: .6px; }

.hnav { background: #102646; display: flex; flex-wrap: wrap; padding: 0 20px; }
.hnav .nav-item { display: block; color: #fff; padding: 14px 18px; font-size: 15px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; border-radius: 0; margin: 0; text-decoration: none; cursor: pointer; }
.hnav .nav-item:hover { background: #1b3a6b; }
.hnav .nav-item.active { background: #d22e1c; color: #fff; }

.layout { display: block; min-height: auto; }
.content { max-width: 1180px; margin: 0 auto; padding: 28px 20px; }

#auth-box { display: flex; align-items: center; gap: 8px; }
.login { display: flex; gap: 6px; align-items: center; }
.login input { background: #fff; color: #202020; border: 1px solid #B6BCC0; width: 130px; padding: 7px; font-size: 13px; }
.userchip { color: #102646; font-size: 14px; font-weight: 700; }
.link { color: #d22e1c; background: none; border: 0; cursor: pointer; font-size: 13px; font-weight: 700; }

h2 { color: #102646; text-transform: uppercase; font-size: 20px; border-bottom: 3px solid #d22e1c; padding-bottom: 6px; display: inline-block; margin: 8px 0 16px; }
h3 { color: #102646; text-transform: uppercase; font-size: 14px; letter-spacing: .3px; }

.card { background: #fff; border: 0; border-top: 4px solid #102646; border-radius: 0; }
.card .num { color: #102646; font-weight: 700; }
.card .lbl { text-transform: uppercase; font-size: 12px; letter-spacing: .3px; }

.btn { background: #102646; color: #fff; border-radius: 0; text-transform: uppercase; font-weight: 700; font-size: 13px; letter-spacing: .3px; padding: 10px 16px; }
.btn:hover { background: #d22e1c; }

table { border: 0; border-radius: 0; background: #fff; }
table th { background: #102646; color: #fff; font-weight: 700; text-transform: uppercase; font-size: 12px; letter-spacing: .3px; }
tbody tr:hover { background: #f1f3f6; }

.linee-grid { gap: 12px; }
.line-card { background: #fff; border: 0; border-top: 4px solid #102646; border-radius: 0; }
.line-card:hover { border-top-color: #d22e1c; }
.lc-cod { color: #d22e1c; font-weight: 700; }
.lc-cnt { color: #102646; }

.bar-fill { background: #102646; border-radius: 0; }
.bar { background: #fff; border-radius: 0; }

.modal-box { border-radius: 0; border-top: 4px solid #d22e1c; }
.login-wall { background: #fff; color: #102646; font-weight: 700; text-transform: uppercase; }
.ubicazione { background: #fff; border: 0; border-left: 4px solid #102646; border-radius: 0; }
.dif, .ver { border-radius: 0; border-left: 3px solid #102646; }
.brand { flex-direction: row; align-items: center; gap: 18px; }
.logo-fer { height: 48px; width: auto; display: block; }
.brand-text { display: flex; flex-direction: column; border-left: 2px solid #d22e1c; padding-left: 16px; }