/* Alarmas: los mismos paneles, controles y jerarquía visual que Variables. */
#alarmas[hidden], #alarmDock[hidden], #alarmEditorDialog[hidden], #alarmGroupEditor[hidden] { display: none !important; }
.alarm-page { margin-top: 0; }
.alarm-page .opcua-command-bar { flex-wrap: wrap; }
.alarm-heading-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.alarm-heading-actions .table-filter-clear { margin-left: 0; }
.alarm-browser { min-height: min(690px, calc(100vh - 170px)); }
.alarm-browser .opcua-hierarchy { gap: 0; }
.alarm-browser .folder-create { display: flex; justify-content: space-between; margin-bottom: 10px; }
#alarmFolderTree { min-height: 0; overflow-y: auto; flex: 1 1 auto; }
#alarmFolderTree ul { margin: 0; padding: 0; list-style: none; }
.alarm-content { display: flex; min-height: 0; flex-direction: column; overflow: hidden; }
.alarm-toolbar { display: none; }
.alarm-bulk-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin-left: auto; flex: 0 0 auto; }
#alarmas:not([data-view="definitions"]) .alarm-browser { grid-template-columns: minmax(0, 1fr); }
#alarmas:not([data-view="definitions"]) .alarm-content { margin-top: 0; }
.alarm-name-cell { display: flex; align-items: center; gap: 8px; }
.alarm-name-cell > div { min-width: 0; }
.alarm-name-cell small { display: block; margin-top: 2px; color: var(--muted); }
#alarmTable .row-actions { justify-content: center; }
#alarmas[data-view="definitions"] #alarmTable > thead > tr > th:last-child,
#alarmas[data-view="definitions"] #alarmTable > tbody > tr > td:last-child:not([colspan]) { width: 176px; min-width: 176px; max-width: 176px; padding-right: 7px; padding-left: 7px; text-align: center; }
#alarmas[data-view="active"] #alarmTable > thead > tr > th:last-child,
#alarmas[data-view="active"] #alarmTable > tbody > tr > td:last-child:not([colspan]) { width: 76px; min-width: 76px; max-width: 76px; padding-right: 7px; padding-left: 7px; text-align: center; }
#alarmTable[data-filters-mounted] .row-actions:has(.edit-alarm) { grid-template-columns: 44px 56px 44px; grid-auto-flow: row; gap: 3px; }
#alarmTable .row-actions :is(.edit-alarm, .duplicate-alarm, .delete) { padding-right: 5px; padding-left: 5px; }
#alarmTable .row-button.duplicate-alarm { color: var(--amber); border-color: var(--amber); background: transparent; }
#alarmTable .row-button.duplicate-alarm:hover { box-shadow: 0 0 8px rgba(228, 192, 76, .3); }
.alarm-table-wrap { min-height: 0; max-height: 55vh; overflow: auto; flex: 0 1 auto; }
.alarm-table-wrap table { min-width: 750px; }
.alarm-table-wrap td { vertical-align: middle; }
#alarmas[data-view="definitions"] #alarmTable > tbody > tr[data-alarm-definition-id] > td { padding-top: 4px; padding-bottom: 4px; line-height: 1.2; }
#alarmas[data-view="definitions"] #alarmTable .row-button { min-height: 24px; padding-top: 3px; padding-bottom: 3px; line-height: 1.2; }
#alarmas:is([data-view="active"], [data-view="history"]) #alarmTable > tbody > tr.alarm-episode-row > td { padding-top: 4px; padding-bottom: 4px; line-height: 1.2; }
#alarmas:is([data-view="active"], [data-view="history"]) #alarmTable .alarm-name-cell small { margin-top: 1px; }
#alarmas[data-view="active"] #alarmTable [data-alarm-ack] { min-height: 24px; padding-top: 3px; padding-bottom: 3px; line-height: 1.2; }
.alarm-table-footer { display: flex; min-height: 30px; align-items: center; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 10px; }
.alarm-empty { color: var(--muted); text-align: center; }
.alarm-severity { display: inline-flex; align-items: center; max-width: 100%; padding: 1px 6px; border: 1px solid currentColor; background: #000; font-size: 10px; font-weight: 700; line-height: 1.3; letter-spacing: .03em; vertical-align: middle; }
.alarm-severity.critical, .alarm-pending { color: var(--red); }
.alarm-severity.warning { color: var(--amber); }
.alarm-severity.info { color: var(--blue); }
#alarmsNavLink.has-alarm .nav-icon svg, .alarm-dock.has-alarm .alarm-dock-bell svg { animation: alarm-menu-pulse 2.4s ease-in-out infinite; }
@keyframes alarm-menu-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .08; } }
@media (prefers-reduced-motion: reduce) { #alarmsNavLink.has-alarm .nav-icon svg, .alarm-dock.has-alarm .alarm-dock-bell svg { animation: none; } }
body.sidebar-collapsed #alarmsNavLink > span:nth-child(2) { display: none; }
.alarm-folder-alert { color: var(--red) !important; font-weight: 700; }
.alarm-folder-active { color: var(--amber) !important; font-weight: 700; }
.alarm-page [hidden], #adminAlarmChannelsPanel [hidden] { display: none !important; }
.variable-alarm-link { display: inline-block; margin-top: 3px; color: var(--red); font-size: 10px; text-decoration: none; }
.alarm-editor-fields { min-width: 0; margin: 0; padding: 0; border: 0; }
.alarm-editor-tabs { display: flex; gap: 8px; margin-bottom: 18px; border-bottom: 1px solid var(--line); }
.alarm-editor-tabs [role="tab"] { flex: 1; min-width: 0; min-height: 42px; padding: 10px 16px; border: 0; border-bottom: 3px solid transparent; background: transparent; color: var(--muted); font: inherit; font-size: 12px; font-weight: 650; cursor: pointer; }
.alarm-editor-tabs [role="tab"][aria-selected="true"] { color: var(--focus); border-bottom-color: var(--focus); background: rgba(69, 198, 237, .06); }
.alarm-editor-tabs [role="tab"]:hover:not(:disabled) { color: var(--text); background: rgba(255, 255, 255, .04); }
.alarm-editor-tabs [role="tab"]:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.alarm-editor-tabs [role="tab"]:disabled { cursor: wait; opacity: .65; }
.alarm-variable-reading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 3px 12px; line-height: 1.4; overflow-wrap: anywhere; }
#alarmVariableReadingStatus { grid-column: 1 / -1; }
.alarm-variable-reading > time { text-align: right; }
.alarm-editor-section { padding-bottom: 14px; }
.alarm-editor-card [hidden] { display: none !important; }
.alarm-editor-error { margin: 14px 0 0; color: var(--red); font-size: 11px; }
.alarm-notification-test-status { margin: 10px 0 0; }
.alarm-notification-test-status.is-error { color: var(--red); }
.alarm-notification-progress-backdrop { z-index: 31; }
.alarm-notification-progress-card { width: min(100%, 520px); padding: 24px; }
.alarm-notification-progress-card .modal-heading { align-items: center; gap: 16px; margin-bottom: 16px; }
.alarm-notification-progress-card .section-copy { margin: 0 0 12px; line-height: 1.6; }
.alarm-notification-progress-card .form-note { line-height: 1.6; }
.alarm-notification-progress-times { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 20px 0; }
.alarm-notification-progress-times > div { min-width: 0; padding: 14px; border: 1px solid var(--line); background: rgba(0, 0, 0, .1); }
.alarm-notification-progress-times dt { color: var(--muted); font-size: 11px; line-height: 1.5; }
.alarm-notification-progress-times dd { margin: 8px 0 0; color: var(--focus); font-size: 26px; font-weight: 650; font-variant-numeric: tabular-nums; }
.alarm-notification-spinner { flex: 0 0 30px; width: 30px; height: 30px; border: 3px solid var(--line); border-top-color: var(--focus); border-radius: 50%; animation: alarm-notification-spin 1s linear infinite; }
@keyframes alarm-notification-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .alarm-notification-spinner { animation: none; } }
@media (max-width: 420px) { .alarm-notification-progress-card { padding: 20px; } .alarm-notification-progress-times { gap: 8px; } .alarm-notification-progress-times > div { padding: 10px; } }
.alarm-notification-actions { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
.alarm-notification-actions > .alarm-notify { flex: 1 1 0; min-width: 0; margin: 0; }
.alarm-notification-actions > .button { flex: 0 0 auto; }
#testAlarmNotification { color: #211b0c; border-color: #d0a632; background: #e3bc4f; }
#testAlarmNotification:hover:not(:disabled) { color: #171205; border-color: #f0cf6a; background: #f0ca5d; }
@media (max-width: 600px) {
  .alarm-notification-actions { align-items: stretch; flex-direction: column; }
  .alarm-notification-actions > .alarm-notify { flex: 0 0 auto; }
  .alarm-notification-actions > .button { align-self: flex-end; }
}
.alarm-editor-card #alarmName.alarm-suggested-name { color: var(--amber); border-color: var(--amber); }
#alarmDuplicateNameHint { color: var(--amber); }
.alarm-form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.alarm-identification-grid { grid-template-areas: "name variable folder" "recognition reading ."; row-gap: 7px; align-items: start; }
.alarm-identification-grid > .alarm-name-field { grid-area: name; }
.alarm-identification-grid > .alarm-variable-field { grid-area: variable; }
.alarm-identification-grid > .alarm-folder-field { grid-area: folder; }
.alarm-identification-grid > .alarm-checkboxes { grid-area: recognition; margin-top: 0; line-height: 1.2; }
.alarm-identification-grid > .alarm-variable-reading { grid-area: reading; margin: 0; }
.alarm-condition-grid { grid-template-columns: minmax(0, 1.5fr) minmax(0, .8fr) minmax(0, .8fr) minmax(0, 1.25fr) minmax(0, 1fr); align-items: end; }
.alarm-notification-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 901px) {
  .alarm-condition-grid > :nth-child(4) { grid-column: 4; }
  .alarm-condition-grid > :nth-child(5) { grid-column: 5; }
}
.alarm-form-grid .field { min-width: 0; }
.alarm-form-grid :is(input, select) { width: 100%; }
.alarm-checkboxes, .alarm-notify { display: flex; gap: 18px; margin-top: 14px; color: var(--text); font-size: 11px; }
.alarm-checkboxes label, .alarm-notify label { display: flex; align-items: center; gap: 5px; }
.alarm-notify { border: 1px solid var(--line); padding: 10px; flex-wrap: wrap; }
.alarm-notify legend { color: var(--muted); }
.alarm-editor-status { flex: 1 1 0; min-width: 0; grid-template-columns: 1fr; margin-top: 0; }
.alarm-editor-status .switch-label { position: relative; }
.alarm-editor-status .switch-label input { display: block; position: absolute; opacity: 0; pointer-events: none; }
.alarm-ai-report-toggle { grid-template-columns: 1fr; margin: 12px 0; }
.alarm-ai-report-toggle .switch-label { position: relative; }
.alarm-ai-report-toggle .switch { flex-shrink: 0; }
.alarm-ai-report-toggle .switch-label input { display: block; position: absolute; width: 1px; height: 1px; opacity: 0; }
.alarm-ai-report-toggle .switch-label input:focus-visible + .switch { outline: 2px solid var(--primary, #31b8e8); outline-offset: 4px; }
.alarm-editor-status input:focus-visible + .switch { outline: 2px solid var(--focus); outline-offset: 3px; }
.alarm-editor .form-actions { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); }
.alarm-editor .form-actions > .button-group { flex: 0 0 auto; }
.alarm-editor .form-actions .alarm-ai-report-toggle { margin: 0; }
.alarm-groups-browser { min-height: 420px !important; }
.alarm-groups-browser #alarmGroupList { margin-top: 10px; }
.alarm-group-detail { padding: 0; }
.alarm-group-detail > .opcua-detail-heading { flex-wrap: wrap; }
.alarm-group-body { flex: 1; }
.alarm-group-body > p { color: var(--muted); }
.alarm-group-detail form { width: 100%; max-width: none; display: grid; gap: 14px; }
.alarm-group-detail form[hidden] { display: none; }
.alarm-group-detail fieldset { border: 1px solid var(--line); }
.alarm-group-detail legend { color: var(--muted); font-size: 11px; }
#alarmGroupUsers { display: grid; max-height: 230px; overflow: auto; gap: 7px; }
#alarmGroupUsers label { display: flex; gap: 8px; align-items: center; }
.alarm-group-enabled { display: flex; gap: 7px; align-items: center; }
.alarm-dock {
  position: fixed; z-index: 7; left: calc(var(--sidebar-width) + var(--panel-gap)); right: var(--panel-gap); bottom: var(--panel-gap);
  height: var(--alarm-dock-height, min(15dvh, 280px)); min-height: 36px; display: flex; flex-direction: column; margin: 0; padding: 0; overflow: visible;
  border: 1px solid var(--line-strong); background: var(--surface); box-shadow: none; outline: var(--panel-gap) solid var(--bg);
}
.alarm-dock.collapsed { height: 27px; min-height: 27px; }
.alarm-dock.collapsed .alarm-dock-header { height: 25px; min-height: 25px; flex-basis: 25px; border-bottom: 0; }
.alarm-dock.collapsed .alarm-dock-toggle { height: 22px; min-height: 0; }
.alarm-dock.collapsed .alarm-dock-actions :is(.row-button, .button) { height: 20px; min-height: 20px; padding-top: 1px; padding-bottom: 1px; line-height: 16px; }
.alarm-dock-resize { position: absolute; z-index: 1; top: calc(-1 * var(--panel-gap) - 1px); left: -1px; right: -1px; height: var(--panel-gap); background: var(--bg); cursor: ns-resize; touch-action: none; }
.alarm-dock-resize:hover, .alarm-dock-resize:focus-visible { background: var(--line-strong); outline: none; }
.alarm-dock.collapsed .alarm-dock-resize { display: none; }
body.alarm-dock-resizing, body.alarm-dock-resizing * { cursor: ns-resize !important; user-select: none !important; }
body.alarm-dock-resizing .alarm-dock-resize { background: var(--line-strong); }
.alarm-dock-header { display: flex; height: 34px; min-height: 34px; flex: 0 0 34px; align-items: center; gap: 12px; padding: 0 10px; border-bottom: 2px solid var(--line-strong); background: var(--surface-2); }
.alarm-dock-toggle { display: inline-flex; height: 28px; align-items: center; gap: 7px; padding: 0; border: 0; background: transparent; color: var(--text); cursor: pointer; white-space: nowrap; }
.alarm-dock-toggle strong { font-size: 11px; font-weight: 650; }
.alarm-dock-toggle svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.alarm-dock.collapsed .alarm-dock-toggle > svg { transform: rotate(180deg); }
.alarm-dock-bell { display: inline-flex; flex: 0 0 14px; color: #ffc857; }
.alarm-dock-bell svg path:last-child { stroke: #4ddff1; }
.alarm-dock-toggle:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.alarm-dock-count { display: inline-grid; min-width: 19px; height: 18px; place-items: center; padding: 0 4px; border: 1px solid var(--line-strong); border-radius: var(--control-radius); color: var(--muted); background: var(--surface-3); font-size: 10px; font-weight: 600; line-height: 14px; letter-spacing: normal; }
.alarm-dock.has-pending .alarm-dock-count { color: #ff9aa3; border-color: #a94d58; background: #452e33; }
.alarm-dock-summary { min-width: 0; overflow: hidden; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.alarm-dock-actions { display: flex; align-items: center; gap: 6px; margin-left: auto; }
.alarm-dock-actions .row-button { padding: 3px 7px; font-size: 10px; text-decoration: none; }
.alarm-dock-body { --table-frame-color: var(--line); min-height: 0; overflow: auto; flex: 1; }
.alarm-dock.collapsed .alarm-dock-body, .alarm-dock.collapsed #ackDockAlarms { display: none; }
.alarm-dock-body table { width: 100%; min-width: 660px; }
.alarm-dock-body td { height: 28px; padding: 4px 10px; font-size: 10px; }
.alarm-dock-body thead tr:first-child th { height: 26px; padding: 2px 10px; font-size: 9px; background: var(--surface-2); }
.alarm-dock-body .table-column-heading { min-height: 20px; }
.alarm-dock-body .table-sort { min-height: 20px; font-size: 9px; }
.alarm-dock-body .row-button { padding: 2px 7px; font-size: 9px; }
#alarmDockBody .table-has-actions > thead > tr > th:last-child,
#alarmDockBody .table-has-actions > tbody > tr > td:last-child:not([colspan]) { width: 76px; min-width: 76px; max-width: 76px; padding-right: 7px; padding-left: 7px; text-align: center; }
.alarm-dock-body .alarm-dock-unacknowledged td:first-child { box-shadow: inset 2px 0 0 var(--red); }
.alarm-dock-body td { white-space: nowrap; }
.alarm-dock-body :is(th, td):nth-child(n+5):nth-child(-n+7) { width: 1%; }
.alarm-dock-body tbody td:nth-child(n+5):nth-child(-n+7) { white-space: normal; overflow-wrap: anywhere; }
body:has(.alarm-dock:not([hidden])) { --alarm-dock-height: 27px; --alarm-dock-space: calc(var(--alarm-dock-height) + 2 * var(--panel-gap)); }
body:has(.alarm-dock:not([hidden]):not(.collapsed)) { --alarm-dock-height: var(--alarm-dock-custom-height, min(15dvh, 280px)); }
body:has(.alarm-dock:not([hidden])) .shell { padding-bottom: var(--alarm-dock-space); }
body:has(.alarm-dock:not([hidden])) :is(.history-variable-drawer, .history-ai-drawer) { bottom: var(--alarm-dock-space); }
@media (min-width: 701px) {
  body[data-active-page="alarmas"] { height: 100dvh; overflow: hidden; }
  body[data-active-page="alarmas"] .shell { display: flex; height: 100dvh; min-height: 0; flex-direction: column; }
  body[data-active-page="alarmas"] main, #alarmas, #alarmas > .opcua-workspace { display: flex; min-height: 0; flex: 1 1 auto; flex-direction: column; }
  .panel.opcua-browser.alarm-browser { min-height: 0; flex: 1 1 auto; grid-template-rows: minmax(0, 1fr); }
  .alarm-content { flex: 1 1 auto; overflow-y: auto; }
  .alarm-table-wrap { max-height: none; }
  .alarm-table-footer { flex: 0 0 auto; }
}
@media (max-width: 900px) {
  .alarm-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .alarm-bulk-actions { flex-wrap: wrap; }
  .alarm-dock-header { gap: 8px; }
}
@media (max-width: 700px) {
  .alarm-form-grid { grid-template-columns: 1fr; }
  .alarm-identification-grid { grid-template-areas: "name" "recognition" "variable" "reading" "folder"; }
  .alarm-editor-status { width: 100%; flex: none; }
  .alarm-browser { grid-template-columns: 1fr !important; }
  .alarm-browser .opcua-hierarchy { min-height: 140px; max-height: 240px; }
  .alarm-dock { left: var(--panel-gap); }
  .alarm-dock-summary { display: none; }
  .alarm-dock-actions { gap: 4px; }
  .alarm-dock-actions .row-button { padding: 3px 5px; font-size: 9px; }
  #ackDockAlarms:disabled { display: none; }
  body:has(.alarm-dock:not([hidden]):not(.collapsed)) { --alarm-dock-height: var(--alarm-dock-custom-height, min(20dvh, 280px)); }
}

.alarm-refresh-warning { color: var(--amber) !important; font-size: 10px; }
.alarm-dock-header [hidden] { display: none; }
.alarm-dock input[type="checkbox"], .alarm-table-wrap input[type="checkbox"], .alarm-editor input[type="checkbox"], #alarmDefaultSettingsForm input[type="checkbox"], #alarmGroupUsers input[type="checkbox"], .alarm-group-enabled input[type="checkbox"] { width: 13px; height: 13px; min-height: 0; padding: 0; margin: 0; flex: 0 0 13px; accent-color: var(--primary); }

#alarmFolderDialog[hidden], #alarmFolderDialog [hidden] { display: none !important; }
#alarmFolderDialogDescription { margin: 0; color: var(--muted); font-size: 12px; }
#alarmFolderDialogDescription:empty, #alarmFolderDialogError:empty { display: none; }
#alarmFolderDialogError { margin: 0; color: var(--red); font-size: 12px; }
#alarmFolderTree .variable-folder-menu [data-alarm-folder-action="delete"] { color: var(--red); }
#alarmas[data-view="definitions"] .alarm-content { margin-top: 0; }

/* Configuración: la misma jerarquía y formularios del resto de la consola. */
#alarmConfigurationWorkspace[hidden], #alarmOperationsWorkspace[hidden], #alarmSeverityDialog[hidden], .alarm-configuration-form[hidden] { display: none !important; }
.alarm-configuration-browser { min-height: 0; }
#alarmConfigurationSections { margin-top: 13px; }
.alarm-configuration-detail { min-width: 0; min-height: 0; overflow-y: auto; }
.alarm-configuration-detail > .opcua-detail-heading { flex-wrap: wrap; }
.alarm-configuration-heading-actions { display: flex; flex: 0 0 auto; max-width: 100%; flex-wrap: wrap; justify-content: flex-end; gap: 6px; margin-left: auto; }
.alarm-configuration-heading-actions[hidden] { display: none !important; }
.alarm-configuration-form { padding: 0; display: grid; gap: var(--panel-gap); background: var(--bg); }
.alarm-configuration-form > .alarm-editor-fields { display: grid; gap: var(--panel-gap); }
.alarm-configuration-form .mapping-form-section { margin: 0; padding: 14px 16px; background: var(--surface); }
#alarmStateSettingsForm { flex: 1 0 auto; }
#alarmStateSettingsFields { grid-template-rows: auto 1fr; }
#alarmDefaultSettingsForm { flex: 1 0 auto; background: var(--surface); }
#alarmDefaultSettingsFields { align-content: start; }
.alarm-default-operational-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--panel-gap); background: var(--bg); }
@media (max-width: 760px) { .alarm-default-operational-row { grid-template-columns: minmax(0, 1fr); } }
.alarm-severity-table-panel > .mapping-section-heading { flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; }
#alarmSeverityCatalogCount { margin-left: 4px; color: var(--muted); font-size: 11px; font-weight: 400; }
#alarmSeverityTableActions { margin-left: auto; }
#alarmSeveritySettingsTable { min-width: 740px; }
#alarmSeveritySettingsTable th:first-child { width: 30%; }
#alarmSeveritySettingsTable td { padding-top: 10px; padding-bottom: 10px; vertical-align: middle; }
#alarmSeveritySettingsTable .alarm-severity { font-size: 12px; letter-spacing: normal; }
.alarm-severity-color { display: inline-flex; align-items: center; gap: 9px; font-family: Consolas, monospace; font-size: 11px; white-space: nowrap; }
.alarm-severity-color .alarm-color-swatch { width: 16px; height: 16px; margin: 0; border: 1px solid var(--line-strong); }
#alarmSeveritySettingsTable > thead > tr > th:last-child,
#alarmSeveritySettingsTable > tbody > tr > td:last-child:not([colspan]) { width: 88px; min-width: 88px; max-width: 88px; padding-right: 7px; padding-left: 7px; text-align: center; }
#alarmSeveritySettingsTable .row-actions { justify-content: center; }
.alarm-severity-table-panel > .form-note { margin: 12px 0 0; }
.alarm-severity-blink-slow, .alarm-severity-blink-normal, .alarm-severity-blink-fast { animation: alarm-severity-pulse var(--severity-blink-duration) ease-in-out infinite; }
.alarm-severity-blink-slow { --severity-blink-duration: 3.2s; }
.alarm-severity-blink-normal { --severity-blink-duration: 1.8s; }
.alarm-severity-blink-fast { --severity-blink-duration: .9s; }
@keyframes alarm-severity-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .2; } }
@media (prefers-reduced-motion: reduce) { .alarm-severity-blink-slow, .alarm-severity-blink-normal, .alarm-severity-blink-fast { animation: none; } }
.alarm-state-color-row { display: grid; grid-template-columns: minmax(150px, 190px) minmax(0, 350px) minmax(0, 270px); justify-content: start; align-items: center; gap: 18px; min-height: 48px; padding: 7px 0; border-bottom: 1px solid var(--line); }
.alarm-state-color-row > strong { font-size: 12px; }
.alarm-state-color-group + .alarm-state-color-group { border-left: 1px solid var(--line); padding-left: 18px; }
.alarm-state-color-group { display: grid; min-width: 0; gap: 6px; }
.alarm-state-color-group-heading { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; gap: 6px 12px; color: var(--muted); font-size: 10px; }
.alarm-state-color-group-heading > label { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--text); white-space: nowrap; }
.alarm-state-color-group-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; }
.alarm-state-color-row:last-child { border-bottom: 0; }
.alarm-state-color-row .field { margin: 0; }
.alarm-transparency-control { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 10px; }
.alarm-transparency-control > span:last-child { display: flex; align-items: center; border: 1px solid var(--line-strong); background: var(--surface); }
.alarm-transparency-control input { width: 58px; min-width: 0; height: 30px; min-height: 30px; margin: 0; padding: 0 4px; text-align: center; font-size: 12px; border: 0; background: transparent; }
.alarm-transparency-control > span > span { padding-right: 7px; font-size: 11px; }
.alarm-transparency-control:has(input:disabled) { opacity: .5; }
.alarm-color-control { display: flex; gap: 6px; align-items: center; }
.field > .alarm-color-control { display: flex; margin: 0; }
.alarm-configuration-form .mapping-form-grid, .alarm-severity-card .mapping-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.alarm-configuration-form .mapping-form-grid .field, .alarm-severity-card .mapping-form-grid .field { min-width: 0; margin: 0; }
.alarm-color-control input:not([type="hidden"]) { width: 112px; min-width: 0; height: 32px; min-height: 32px; margin: 0; padding: 0 8px; text-align: center; font-family: Consolas, monospace; font-size: 12px; font-weight: 500; }
.alarm-color-button { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 32px; min-height: 32px; padding: 4px; border: 1px solid var(--line-strong); background: var(--surface); cursor: pointer; }
.alarm-color-button > span { display: block; width: 100%; height: 100%; margin: 0; border: 1px solid rgba(255,255,255,.2); background: var(--control-color); }
.alarm-color-button:hover { border-color: var(--focus); }
.alarm-color-button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.alarm-color-button:disabled { opacity: .35; cursor: default; }
.application-color-palette { z-index: 110; max-height: calc(100dvh - 16px); overflow-y: auto; background: var(--surface-2); border-color: var(--line-strong); }
.application-color-palette-custom { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line-strong); }
.application-color-palette-custom > label { display: block; margin-bottom: 7px; color: var(--muted); font-size: 10px; }
.application-color-palette-custom > div { display: flex; align-items: center; gap: 8px; }
.application-color-palette-preview { flex: 0 0 28px; height: 28px; border: 1px solid var(--line-strong); background: var(--selected-color); }
.application-color-palette-custom input { flex: 1 1 0; min-width: 0; width: 100%; height: 30px; min-height: 30px; margin: 0; padding: 0 6px; text-align: center; font-family: Consolas, monospace; font-size: 12px; }
.alarm-configuration-form .alarm-default-condition-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.alarm-severity-card { width: min(760px, calc(100vw - 32px)); }
.alarm-episode-row td { background: var(--alarm-state-fill, transparent); color: var(--alarm-state-text, var(--text)); }
.alarm-episode-row .alarm-name-cell small { color: var(--alarm-state-secondary-text, var(--muted)); }
.alarm-episode-row:hover td { background: var(--alarm-state-hover, transparent); }
.alarm-episode-row td:first-child { box-shadow: inset 3px 0 0 var(--alarm-state-color, transparent); }
#alarmConfigurationError, #alarmConfigurationStale { margin: 12px 14px 0; }
@media (max-width: 1050px) {
  .alarm-state-color-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; }
  .alarm-state-color-row > strong { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .alarm-state-color-row { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .alarm-state-color-group + .alarm-state-color-group { border-left: 0; padding-left: 0; }
  .alarm-state-color-group-heading { gap: 6px 12px; }
  .alarm-state-color-group-controls { gap: 8px 12px; }
}
@media (max-width: 760px) { .alarm-configuration-form .mapping-form-grid, .alarm-severity-card .mapping-form-grid { grid-template-columns: minmax(0, 1fr); } }
.alarm-ai-related { margin: 16px 0; }
.alarm-report-settings { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.alarm-ai-related h4 { margin: 0 0 8px; font-size: 12px; }
.alarm-ai-related-heading { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; }
.alarm-ai-related-heading > h4, .alarm-ai-related-heading > .form-note { margin: 0; }
.alarm-ai-picker { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; margin: 10px 0; }
.alarm-ai-catalog, .alarm-ai-drop-zone { display: flex; flex-direction: column; gap: 8px; min-width: 0; height: 360px; padding: 12px; border: 1px solid var(--line-strong); background: var(--surface-2); }
.alarm-ai-catalog > .field { flex: 0 0 auto; }
.alarm-ai-variable-list { min-height: 0; overflow: auto; flex: 1; }
.alarm-ai-source-group { border-left: 2px solid var(--primary, #31b8e8); margin-bottom: 8px; }
.alarm-ai-source-group summary { cursor: pointer; padding: 8px; font-size: 12px; font-weight: 600; overflow-wrap: anywhere; }
.alarm-ai-source-group summary:focus-visible { outline: 2px solid var(--primary, #31b8e8); outline-offset: -2px; }
.alarm-ai-source-group summary small { color: var(--muted); }
.alarm-ai-tree-variable { display: flex; align-items: center; gap: 6px; padding: 6px; margin: 4px 4px 4px 8px; border: 1px solid var(--line-strong); background: var(--surface); }
.alarm-ai-tree-variable[draggable="true"] { cursor: grab; }
.alarm-ai-tree-variable.is-selected { border-color: var(--primary, #31b8e8); }
.alarm-ai-variable-name { min-width: 0; flex: 1; overflow-wrap: anywhere; font-size: 11px; }
.alarm-ai-drag-grip { color: var(--primary, #31b8e8); flex: 0 0 auto; }
.alarm-ai-picker .icon-button { flex: 0 0 28px; width: 28px; height: 28px; min-height: 28px; padding: 0; }
.alarm-ai-drop-zone { border-style: dashed; transition: border-color .15s, background .15s; }
.alarm-ai-drop-zone.is-drag-over { border: 2px solid var(--primary, #31b8e8); background: var(--surface); }
.alarm-ai-drop-zone > h4, .alarm-ai-drop-zone > .form-note { margin: 0; }
.alarm-ai-primary { display: grid; gap: 6px; padding: 10px; border-left: 3px solid var(--primary, #31b8e8); background: var(--surface); overflow-wrap: anywhere; }
.alarm-ai-primary small { color: var(--muted); font-size: 9px; }
.alarm-ai-primary strong { font-size: 11px; }
.alarm-ai-selected { display: grid; align-content: start; gap: 6px; min-height: 0; overflow: auto; flex: 1; }
.alarm-ai-selected-row { display: flex; gap: 8px; align-items: center; padding: 7px 8px; border: 1px solid var(--line-strong); background: var(--surface); }
.alarm-ai-selected-row > span { flex: 1; min-width: 0; font-size: 11px; overflow-wrap: anywhere; }
.alarm-ai-empty { color: var(--muted); font-size: 12px; line-height: 1.5; margin: auto 8px; text-align: center; }
@media (max-width: 700px) {
  .alarm-report-settings, .alarm-ai-picker { grid-template-columns: minmax(0, 1fr); }
  .alarm-ai-catalog { height: 260px; }
  .alarm-ai-drop-zone { height: auto; min-height: 220px; max-height: 390px; }
}
.alarm-color-swatch { display: inline-block; width: 12px; height: 12px; margin-right: 8px; vertical-align: middle; border: 1px solid var(--border); }
@media (min-width: 701px) {
  .panel.opcua-browser.alarm-configuration-browser { min-height: 0; grid-template-rows: minmax(0, 1fr); }
  #alarmSeveritySettingsPanel { display: flex; min-height: 0; flex: 1 1 auto; flex-direction: column; }
  #alarmSeveritySettingsPanel > .alarm-severity-table-panel { display: flex; min-height: 0; flex: 1 1 auto; flex-direction: column; }
  .alarm-severity-table-panel > .mapping-section-heading,
  .alarm-severity-table-panel > .form-note { flex: 0 0 auto; }
  .alarm-severity-table-panel > .table-wrap { min-height: 0; flex: 0 1 auto; overflow: auto; }
}
.table-has-actions > tbody > tr.alarm-episode-row > td:last-child:not([colspan]) { background: var(--alarm-state-fill, transparent); }
.table-has-actions > tbody > tr.alarm-episode-row:hover > td:last-child:not([colspan]) { background: var(--alarm-state-hover, transparent); }
#alarmas[data-view="active"] #alarmTable > tbody > tr.alarm-episode-row > td:last-child:not([colspan]),
#alarmDockTable > tbody > tr.alarm-episode-row > td:last-child:not([colspan]) { background: inherit; }
.alarm-state-color-row input[type="checkbox"] { width: 13px; height: 13px; min-height: 0; padding: 0; margin: 0; flex: 0 0 13px; accent-color: var(--primary); }
.notification-channel-detail > [data-notification-detail]:not([hidden]) { display: flex; min-height: 100%; flex-direction: column; }
.notification-channel-body { flex: 1 1 auto; container-type: inline-size; }
.notification-channel-body > p { margin: 0 0 18px; color: var(--muted); font-size: 12px; }
.notification-channel-list { margin-top: 10px; }
.notification-channel-list .opcua-source-item { min-height: 60px; }
#administracion .client-notifications-panel { display: flex; min-height: 0; flex: 1; flex-direction: column; gap: var(--panel-gap); }
#administracion .client-notification-tabs { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: 20px; padding: 0 18px; background: var(--surface); border-bottom: 1px solid var(--line); }
#administracion .client-notification-tabs button { padding: 12px 0; color: var(--muted); background: transparent; border: 0; border-bottom: 2px solid transparent; font-size: 12px; }
#administracion .client-notification-tabs button[aria-selected="true"] { color: #f1d36b; border-bottom-color: #e3bc4f; }
#administracion .client-notification-section { display: flex; min-height: 0; flex: 1; flex-direction: column; }
#administracion .client-notification-section > .admin-browser { flex: 1; grid-template-columns: var(--panel-sidebar-width, 160px) minmax(0, 1fr); }
#clientNotificationGroupsPanel .alarm-groups-browser { min-height: 0 !important; }
#clientNotificationsPanel .form-actions { position: static; padding-top: 0; background: var(--surface); border: 0; }
#clientNotificationsPanel .notification-channel-list .opcua-source-item.active,
#clientNotificationsPanel #alarmGroupList .opcua-source-item.active { border-color: #e3bc4f; box-shadow: inset 2px 0 #e3bc4f; }
@media (max-width: 700px) {
  #administracion .client-notification-section > .admin-browser { grid-template-columns: minmax(0, 1fr); }
  #administracion .client-notifications-panel, #administracion .client-notification-section { flex: 0 0 auto; }
}
.notification-smtp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 18px 0; }
.notification-smtp-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.notification-smtp-meta .form-note { margin: 0; }
.notification-smtp-password-note { display: grid; gap: 4px; }
.notification-channel-detail form { width: 100%; max-width: none; }
.smtp-test-mail-card { width: min(100%, 560px); }
.smtp-test-mail-card form { display: grid; gap: 16px; }
.smtp-test-mail-card textarea { width: 100%; min-height: 150px; resize: vertical; padding: 10px 12px; color: var(--text); border: 1px solid var(--line-strong); background: var(--surface-2); font: inherit; }
.smtp-test-mail-error { margin: 0; color: var(--red); }
#smtpClearPasswordRow[hidden] { display: none !important; }
@container (min-width: 780px) {
  .notification-smtp-grid, .notification-smtp-meta { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .notification-smtp-password-note { grid-column: span 2; }
}
@container (max-width: 520px) {
  .notification-smtp-grid, .notification-smtp-meta { grid-template-columns: minmax(0, 1fr); }
}