[hidden] { display: none !important; }
* { box-sizing: border-box; }
html, body { margin: 0; }
body { font: 18px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color: #1c2430; background: #eef0f3; }
a { color: #0b5cad; text-decoration: none; }
header { position: sticky; top: 0; z-index: 5; display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 14px; background: #1f2733; color: #fff; }
.hbtns { display: flex; gap: 8px; align-items: center; }
.hbtns form { margin: 0; }
.hbtn { display: inline-block; padding: 8px 12px; font: inherit; font-size: 16px; color: #fff; background: #36424f; border: 0; border-radius: 6px; cursor: pointer; }
main { padding: 14px; max-width: 800px; margin: 0 auto; }
h1 { font-size: 24px; margin: 6px 0 12px; }
h2 { font-size: 19px; margin: 0 0 10px; }
h2 small { font-size: 14px; color: #6b7684; font-weight: 400; }
.card { display: block; background: #fff; border: 1px solid #dfe3e8; border-radius: 10px; padding: 14px 16px; margin-bottom: 12px; color: inherit; }
.card.next { border: 2px solid #e8730c; }
.card.gata, .card.finalizat { opacity: .65; }
.kind { font-size: 15px; color: #6b7684; margin-bottom: 2px; }
.name { font-size: 21px; font-weight: 700; }
.note { margin-top: 6px; padding: 8px 10px; background: #fff6d6; border-radius: 6px; }
.muted { color: #6b7684; font-size: 15px; }
.row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.row form { margin: 0; }
.big { display: block; width: 100%; padding: 16px 12px; font: inherit; font-size: 20px; font-weight: 700; text-align: center; color: #1c2430; background: #fff; border: 2px solid #c4cbd3; border-radius: 10px; cursor: pointer; }
.big.primary { background: #e8730c; border-color: #e8730c; color: #fff; }
.filebtn { margin: 0; }
label { display: block; font-size: 16px; color: #6b7684; margin-bottom: 12px; }
input, textarea { display: block; width: 100%; margin-top: 4px; padding: 14px; font: inherit; font-size: 20px; border: 2px solid #c4cbd3; border-radius: 8px; }
textarea { margin-bottom: 10px; }
.st { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 14px; font-weight: 600; background: #e8ebef; color: #3d4753; }
.st-planificat { background: #dbe9fb; color: #0b4a8f; }
.st-in_curs, .st-ajuns { background: #fdebc8; color: #8a5300; }
.st-finalizat, .st-gata { background: #d5f1df; color: #0a6130; }
.st-anulat { background: #f8dcd9; color: #8f1d14; }
.badge { display: inline-block; min-width: 22px; margin-left: 6px; padding: 1px 7px; border-radius: 999px; background: #e8730c; color: #fff; font-size: 14px; text-align: center; }
.gps { margin-left: 8px; padding: 2px 9px; border-radius: 999px; font-size: 13px; font-weight: 600; }
.gps.on { background: #18b257; color: #fff; }
.gps.off { background: #b42318; color: #fff; }
.flash { padding: 12px 14px; border-radius: 8px; margin-bottom: 12px; background: #d5f1df; color: #0a6130; }
.flash.err { background: #f8dcd9; color: #8f1d14; }
.msgs { margin-bottom: 12px; }
.msg { max-width: 82%; padding: 10px 14px; border-radius: 12px; background: #fff; border: 1px solid #dfe3e8; margin-bottom: 8px; }
.msg.me { margin-left: auto; background: #fdebd6; border-color: #f5cfa5; }
.msg small { color: #6b7684; font-size: 13px; }
