/* ALARMAS GPS: avisos rojos a la derecha de la pantalla y bloque «Mis alarmas» dentro de la ficha del vehículo (Logística → GPS). */

.gps-alarm-toasts { position: fixed; top: 72px; right: 16px; z-index: 5000; display: flex; flex-direction: column; gap: 10px; width: min(360px, calc(100vw - 32px)); pointer-events: none; }
.gps-alarm-toast { pointer-events: auto; padding: 12px 14px; color: #fff; background: #c4172b; border: 1px solid #ff6a7c; border-radius: 3px; box-shadow: 0 8px 22px rgba(0, 0, 0, .45); animation: gps-alarm-in .3s ease-out; }
.gps-alarm-toast.is-leaving { opacity: 0; transform: translateX(24px); transition: opacity .25s, transform .25s; }
.gps-alarm-toast__title { display: block; font-size: 1rem; letter-spacing: .02em; }
.gps-alarm-toast__message { margin: 6px 0 2px; font-size: .95rem; line-height: 1.35; }
.gps-alarm-toast__meta { display: block; opacity: .85; }
.gps-alarm-toast__actions { display: flex; gap: 8px; margin-top: 10px; }
.gps-alarm-toast__button { flex: 1; padding: 7px 10px; font: inherit; font-weight: 700; color: #c4172b; background: #fff; border: 0; border-radius: 3px; cursor: pointer; }
.gps-alarm-toast__button--ghost { color: #fff; background: transparent; border: 1px solid rgba(255, 255, 255, .7); }
.gps-alarm-toast--clock { background: #c25b00; border-color: #ffb066; }
.gps-alarm-toast--clock .gps-alarm-toast__button:not(.gps-alarm-toast__button--ghost) { color: #c25b00; }
.gps-alarm-toast--message { background: #1d5fa8; border-color: #6aa7e8; }
.gps-alarm-toast--message .gps-alarm-toast__button:not(.gps-alarm-toast__button--ghost) { color: #1d5fa8; }
@keyframes gps-alarm-in { from { opacity: 0; transform: translateX(40px); } to { opacity: 1; transform: none; } }

.gps-alarms { margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(128, 128, 128, .3); }
.gps-alarms__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.gps-alarms__list { display: flex; flex-direction: column; gap: 6px; }
.gps-alarms__empty { margin: 0; opacity: .7; font-size: .85rem; }
.gps-alarm-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 5px 8px; border: 1px solid #2f8f55; border-radius: 3px; background: rgba(47, 143, 85, .12); }
.gps-alarm-row__dot { width: 10px; height: 10px; border-radius: 50%; background: #2f8f55; box-shadow: 0 0 0 2px rgba(47, 143, 85, .25); }
.gps-alarm-row__text { min-width: 0; font-size: .85rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gps-alarm-row--triggered { border-color: #c4172b; background: rgba(196, 23, 43, .12); }
.gps-alarm-row--triggered .gps-alarm-row__dot { background: #c4172b; box-shadow: 0 0 0 2px rgba(196, 23, 43, .25); }
.gps-alarm-row--paused { border-color: rgba(128, 128, 128, .5); background: transparent; }
.gps-alarm-row--paused .gps-alarm-row__dot { background: #777; box-shadow: none; }
.gps-alarm-row__buttons { display: flex; gap: 4px; }
.gps-alarms__btn { padding: 4px 9px; font: inherit; font-size: .8rem; cursor: pointer; border: 1px solid rgba(128, 128, 128, .5); border-radius: 3px; background: transparent; color: inherit; }
.gps-alarms__btn--primary { color: #fff; background: #c4172b; border-color: #c4172b; font-weight: 700; }
.gps-alarm-form { display: grid; gap: 8px; margin-top: 8px; padding: 10px; border: 1px dashed rgba(128, 128, 128, .5); border-radius: 3px; }
.gps-alarm-form[hidden] { display: none; }
.gps-alarm-form label { display: grid; gap: 3px; font-size: .8rem; }
.gps-alarm-form input, .gps-alarm-form select { padding: 6px 8px; font: inherit; border-radius: 3px; border: 1px solid rgba(128, 128, 128, .5); background: transparent; color: inherit; }
.gps-alarm-form__hint { margin: 0; font-size: .75rem; opacity: .75; }
.gps-alarm-form__actions { display: flex; gap: 8px; }

/* Interruptores de «Ntfy Usuarios»: verde = recibe, rojo = no recibe. Esquinas de 3 px. */
.ut-switch { position: relative; display: inline-block; width: 44px; height: 22px; margin: 0; cursor: pointer; vertical-align: middle; }
.ut-switch input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.ut-switch__track { position: absolute; inset: 0; background: #c4172b; border: 1px solid rgba(0, 0, 0, .25); border-radius: 3px; transition: background .15s; pointer-events: none; }
.ut-switch__track::after { content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; background: #fff; border-radius: 3px; box-shadow: 0 1px 3px rgba(0, 0, 0, .4); transition: transform .15s; }
.ut-switch input:checked + .ut-switch__track { background: #2f8f55; }
.ut-switch input:checked + .ut-switch__track::after { transform: translateX(22px); }
.ut-switch input:focus-visible + .ut-switch__track { outline: 2px solid #1d5fa8; outline-offset: 2px; }
.ut-switch input:disabled { cursor: not-allowed; }
.ut-switch input:disabled + .ut-switch__track { opacity: .45; }

/* Emojis de los iconos de aviso: tipos de letra de emoji explícitos para que se vean aunque la letra del panel no los tenga. */
.ut-emoji, .ut-emoji option { font-family: 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', 'Segoe UI Symbol', sans-serif; }

/* Selector de iconos de Ntfy Configuración: fila de botones cuadrados con el icono centrado; el elegido va resaltado. */
.ut-icon-grid { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 4px; }
.ut-icon-btn { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: 38px; height: 38px; padding: 0; border: 1px solid rgba(128, 128, 128, .45); border-radius: 3px; }
.ut-icon-btn .app-icon { display: block; margin: 0; }
.ut-icon-btn.is-active { background: rgba(47, 143, 85, .22); border-color: #2f8f55; box-shadow: 0 0 0 2px #2f8f55; }
.ut-emoji-glyph { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; overflow: hidden; font-size: 1.45rem; line-height: 1; text-align: center; font-variant-emoji: emoji; }