.keyboard-shortcuts-page {
    min-height: calc(100vh - 100px);
    min-height: calc(100dvh - 100px);
    display: flex;
    flex-direction: column;
    background: #fff;
    padding: 16px 24px 20px;
    color: #172b40;
}
.keyboard-shortcuts-page [hidden] { display: none !important; }
.keyboard-shortcuts-heading { text-align: start; }
.keyboard-shortcuts-heading .box-title { font-size: 18px; font-weight: 700; margin: 0 0 8px; color: #252525; }
.keyboard-shortcuts-heading .breadcrumb { position: static; float: none; background: transparent; padding: 0; margin: 0; font-size: 11px; text-align: start; }
.keyboard-shortcuts-content { margin: 48px 12px 24px; }
.keyboard-shortcuts-loading { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 160px; }
.keyboard-shortcuts-table-wrapper { border-radius: 5px; box-shadow: 0 3px 16px rgba(0,0,0,.10); overflow: hidden; }
.keyboard-shortcuts-page .keyboard-shortcuts-table { width: 100%; table-layout: fixed; border: 0; margin: 0; }
.keyboard-shortcuts-page .keyboard-shortcuts-table > thead > tr > th {
    background: #f1f1f4; color: #7f8da8; border: 0; padding: 7px 12px;
    font-size: 11px; font-weight: 600; text-align: center;
}
.keyboard-shortcuts-table th:first-child { width: 20%; }
.keyboard-shortcuts-table th:last-child { width: 80%; }
.keyboard-shortcuts-page .keyboard-shortcuts-table > tbody > tr > td {
    border: 0; border-bottom: 1px solid #f5f5f7; padding: 20px 12px;
    text-align: center; vertical-align: middle; background: #fff;
}
.keyboard-shortcuts-page .keyboard-shortcuts-table > tbody > tr:last-child > td { border-bottom: 0; }
.keyboard-shortcuts-page .keyboard-shortcuts-table th:last-child,
.keyboard-shortcuts-page .keyboard-shortcuts-table td:last-child { padding-inline-end: 20%; }
.keyboard-shortcuts-action { font-size: 12px; font-weight: 600; }
.keyboard-shortcuts-page .keyboard-shortcut-select {
    display: inline-block; width: 86px; height: 27px; min-height: 0;
    border: 0; border-radius: 5px; box-shadow: none; padding: 2px 10px;
    background-color: #dbeafe; color: #173655; font-size: 11px; font-weight: 700; cursor: pointer;
}
.keyboard-shortcut-select:focus-visible { outline: 2px solid #428bc1; outline-offset: 3px; }
.keyboard-shortcuts-save { margin-top: auto; padding: 35px 0 72px; }
.keyboard-shortcuts-page .keyboard-shortcuts-save .btn {
    min-width: 142px; border: 0; border-radius: 10px; background: #00964f;
    color: #fff; padding: 10px 18px; font-size: 12px; box-shadow: none;
}
.keyboard-shortcuts-page .keyboard-shortcuts-save .btn:hover { background: #008344; }
.keyboard-shortcuts-save .btn:disabled { opacity: .65; }
.keyboard-shortcuts-footer {
    display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;
    gap: 16px; color: #788cad; font-size: 11px;
}
.keyboard-shortcuts-status { display: flex; align-items: center; gap: 14px; margin-inline-start: auto; }
.keyboard-shortcuts-status::before {
    content: ""; width: 6px; height: 6px; border-radius: 50%; background: #277323; flex-shrink: 0;
}
.keyboard-shortcuts-status.is-dirty::before { background: #d49a19; }
#keyboardShortcutsDate { color: #a4b4cd; }
@media (max-width: 767px) {
    .keyboard-shortcuts-page { padding: 16px 8px; }
    .keyboard-shortcuts-content { margin: 32px 0 20px; }
    .keyboard-shortcuts-heading .box-title { font-size: 16px; }
    .keyboard-shortcuts-save { padding-bottom: 40px; }
    .keyboard-shortcuts-footer { font-size: 10px; gap: 12px; }
    .keyboard-shortcuts-table th:first-child, .keyboard-shortcuts-table th:last-child { width: 50%; }
    .keyboard-shortcuts-page .keyboard-shortcuts-table th:last-child,
    .keyboard-shortcuts-page .keyboard-shortcuts-table td:last-child { padding-inline-end: 12px; }
}