.oh-work-page {
    display: grid;
    gap: 12px;
    min-width: 0;
    padding: 4px 2px 18px;
    color: #1b2230;
}

.oh-work-push-control {
    display: grid;
    justify-items: end;
    gap: 3px;
    min-width: 170px;
}

.oh-work-push-toggle {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: 7px;
    padding: 0 12px;
    border: 1px solid #d5dae1;
    border-radius: 6px;
    background: #fff;
    color: #a51c2b;
    font: inherit;
    cursor: pointer;
}

.oh-work-push-toggle:hover:not(:disabled) {
    background: #f8e9ec;
    border-color: #a51c2b;
}

.oh-work-push-toggle:focus-visible {
    outline: 2px solid #a51c2b;
    outline-offset: 2px;
}

.oh-work-push-toggle:disabled {
    cursor: not-allowed;
    opacity: .65;
}

.oh-work-push-control small,
.oh-work-push-unavailable {
    color: #5b6475;
    font-size: 11px;
}

.oh-work-reminder-toast {
    position: fixed;
    z-index: 1400;
    right: 16px;
    bottom: 20px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 10px;
    width: min(390px, calc(100vw - 24px));
    padding: 12px;
    border: 1px solid #d5dae1;
    border-left: 3px solid #a51c2b;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(14, 39, 64, .2);
}

.oh-work-reminder-toast-icon {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 50%;
    background: #f8e9ec;
    color: #a51c2b;
    font-size: 14px;
}

.oh-work-reminder-toast-content { display: grid; min-width: 0; gap: 5px; }
.oh-work-reminder-toast-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #a51c2b; font-size: 12px; }
.oh-work-reminder-toast-heading button { width: 24px; height: 24px; border: 0; border-radius: 4px; background: transparent; color: #5b6475; font-size: 20px; line-height: 1; cursor: pointer; }
.oh-work-reminder-toast-heading button:hover { background: #f3f4f6; }
.oh-work-reminder-toast-title { overflow-wrap: anywhere; color: #1b2230; font-size: 13px; font-weight: 600; }
.oh-work-reminder-toast-content p { margin: 0; color: #5b6475; font-size: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.oh-work-reminder-toast-content small { color: #7b8492; font-size: 10.5px; }
.oh-work-reminder-toast-complete { justify-self: start; margin-top: 3px; padding: 5px 9px; border: 1px solid #a51c2b; border-radius: 4px; background: #a51c2b; color: #fff; font: inherit; font-size: 11px; cursor: pointer; }
.oh-work-reminder-toast-complete:hover { background: #8e1624; }
.oh-work-reminder-toast-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 3px; }
.oh-work-reminder-toast-open { padding: 5px 0; border: 0; background: transparent; color: #a51c2b; font: inherit; font-size: 11px; cursor: pointer; }
.oh-work-reminder-toast-open:hover { color: #8e1624; text-decoration: underline; }
.oh-work-reminder-toast button:focus-visible { outline: 2px solid #a51c2b; outline-offset: 2px; }

/* After 8 s the reminder shrinks to its title; hover or keyboard focus shows the full card again. */
.oh-work-reminder-toast { animation: oh-toast-daralt .3s ease 8s forwards; }
.oh-work-reminder-toast-content p,
.oh-work-reminder-toast-content small,
.oh-work-reminder-toast-actions { max-height: 200px; overflow: hidden; animation: oh-toast-icerik-gizle .3s ease 8s forwards; }
.oh-work-reminder-toast:hover,
.oh-work-reminder-toast:focus-within,
.oh-work-reminder-toast:hover .oh-work-reminder-toast-content p,
.oh-work-reminder-toast:hover .oh-work-reminder-toast-content small,
.oh-work-reminder-toast:hover .oh-work-reminder-toast-actions,
.oh-work-reminder-toast:focus-within .oh-work-reminder-toast-content p,
.oh-work-reminder-toast:focus-within .oh-work-reminder-toast-content small,
.oh-work-reminder-toast:focus-within .oh-work-reminder-toast-actions { animation: none; }
@keyframes oh-toast-daralt { to { width: min(280px, calc(100vw - 24px)); padding-top: 8px; padding-bottom: 8px; } }
@keyframes oh-toast-icerik-gizle { to { max-height: 0; margin: 0; opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
    .oh-work-reminder-toast,
    .oh-work-reminder-toast-content p,
    .oh-work-reminder-toast-content small,
    .oh-work-reminder-toast-actions { animation-duration: .01s; }
}

.oh-work-header,
.oh-work-panel-heading,
.oh-work-thread-header,
.oh-work-calendar-toolbar,
.oh-work-modal-header,
.oh-work-modal-footer,
.oh-work-inline-actions,
.oh-work-thread-actions,
.oh-work-month-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.oh-work-header {
    min-height: 88px;
    padding: 13px 17px;
    border: 1px solid #d5dae1;
    border-left: 3px solid #a51c2b;
    border-radius: 6px;
    background: #fff;
}

.oh-work-header h1,
.oh-work-panel-heading h2,
.oh-work-thread-header h2,
.oh-work-calendar-toolbar h2,
.oh-work-modal-header h2 {
    margin: 0;
    color: #1b2230;
    font-size: 17px;
    font-weight: 600;
}

.oh-work-header p {
    margin: 4px 0 0;
    color: #5b6475;
    font-size: 13px;
}

.oh-work-eyebrow {
    display: block;
    margin-bottom: 4px;
    color: #a51c2b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0;
}

.oh-work-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid #d5dae1;
    border-radius: 6px;
    background: #fff;
}

.oh-work-summary > div {
    display: grid;
    gap: 5px;
    min-height: 66px;
    align-content: center;
    padding: 9px 15px;
    background: #fff;
}

.oh-work-summary > div + div { border-left: 1px solid #e3e6eb; }

.oh-work-metric-title {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.oh-work-metric-title > .dx-icon { color: #7b8492; font-size: 13px; }
.oh-work-metric:nth-child(1) .oh-work-metric-title > .dx-icon { color: #31764a; }
.oh-work-metric:nth-child(2) .oh-work-metric-title > .dx-icon { color: #b17318; }
.oh-work-metric:nth-child(3) .oh-work-metric-title > .dx-icon { color: #a51c2b; }
.oh-work-metric:nth-child(4) .oh-work-metric-title > .dx-icon { color: #163450; }

.oh-work-summary .oh-work-metric-title > span:last-child,
.oh-work-panel-heading > div > span,
.oh-work-thread-header > div > span {
    color: #687386;
    font-size: 12px;
}

.oh-work-summary strong {
    overflow: hidden;
    color: #1b2230;
    font-size: 18px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.oh-work-tabs {
    display: flex;
    min-height: 42px;
    gap: 6px;
    border-bottom: 1px solid #d5dae1;
}

.oh-work-tabs button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 132px;
    justify-content: center;
    padding: 9px 15px;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: #4f596a;
    font-size: 13px;
    font-weight: 500;
}

.oh-work-tabs button:hover { background: #f6f7f9; }
.oh-work-tabs button.is-active { border-bottom-color: #a51c2b; color: #a51c2b; }
.oh-work-tab-count { color: #687386; font-size: 11px; }
.oh-work-unread-badge { display: inline-grid; min-width: 18px; height: 18px; place-items: center; padding: 0 5px; border-radius: 999px; background: #a51c2b; color: #fff; font-size: 10px; font-weight: 600; }

.oh-work-messages-layout {
    display: grid;
    grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
    gap: 12px;
    height: calc(100vh - 390px);
    height: calc(100dvh - 390px);
    min-height: 420px;
    max-height: 760px;
}

.oh-work-page .panel {
    min-width: 0;
    margin: 0;
    border: 1px solid #d5dae1;
    border-radius: 6px;
    background: #fff;
    box-shadow: none;
}

.oh-work-conversations {
    display: flex;
    min-height: 0;
    flex-direction: column;
}

.oh-work-panel-heading {
    min-height: 58px;
    padding: 10px 13px;
    border-bottom: 1px solid #e3e6eb;
}

.oh-work-panel-heading > div,
.oh-work-thread-header > div:first-child {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.oh-work-panel-heading h2 { font-size: 15px; }
.oh-work-panel-heading > div > span { font-size: 11px; }

.oh-work-conversation-tools {
    display: grid;
    gap: 7px;
    padding: 9px 12px;
    border-bottom: 1px solid #eef0f3;
}

.oh-work-conversation-search {
    display: flex;
    min-height: 34px;
    align-items: center;
    gap: 8px;
    padding: 0 9px;
    border: 1px solid #d5dae1;
    border-radius: 5px;
    background: #fff;
    color: #a51c2b;
}

.oh-work-conversation-search:focus-within {
    border-color: #a51c2b;
    box-shadow: 0 0 0 2px #f8e9ec;
}

.oh-work-conversation-search .dx-icon { font-size: 14px; }

.oh-work-conversation-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: #1b2230;
    font: inherit;
    font-size: 12px;
}

.oh-work-conversation-search input::placeholder { color: #8a93a3; }
.oh-work-conversation-search input:focus-visible { outline: 2px solid #a51c2b; outline-offset: 2px; }

.oh-work-conversation-filter-row {
    display: flex;
    min-height: 22px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.oh-work-unread-filter { cursor: pointer; }
.oh-work-clear-filters { padding: 2px 0; border: 0; background: transparent; color: #a51c2b; font-size: 11px; }
.oh-work-clear-filters:hover { color: #8e1624; text-decoration: underline; }
.oh-work-clear-filters:focus-visible { outline: 2px solid #a51c2b; outline-offset: 2px; }

.oh-work-conversation-list {
    min-height: 0;
    overflow: auto;
}

.oh-work-conversation {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    width: 100%;
    gap: 10px;
    padding: 11px 12px;
    border: 0;
    border-bottom: 1px solid #eef0f3;
    background: #fff;
    color: inherit;
    text-align: left;
}

.oh-work-conversation:hover { background: #f8f9fb; }
.oh-work-conversation.is-selected { background: #f8e9ec; box-shadow: inset 3px 0 #a51c2b; }

.oh-work-avatar {
    display: grid;
    width: 36px;
    aspect-ratio: 1;
    place-items: center;
    border-radius: 50%;
    background: #e9edf2;
    color: #163450;
    font-size: 12px;
    font-weight: 600;
}

.oh-work-conversation-copy,
.oh-work-conversation-meta {
    display: grid;
    min-width: 0;
    gap: 4px;
}

.oh-work-conversation-copy strong {
    overflow: hidden;
    font-size: 12.5px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.oh-work-conversation-copy > span {
    overflow: hidden;
    color: #687386;
    font-size: 11.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.oh-work-conversation-meta { justify-items: end; white-space: nowrap; }
.oh-work-conversation-meta time,
.oh-work-conversation-meta small { color: #7b8492; font-size: 10px; }
.oh-work-unread-count { display: inline-grid; min-width: 18px; height: 18px; place-items: center; padding: 0 5px; border-radius: 9px; background: #a51c2b; color: #fff; font-size: 10px; font-weight: 600; }

.oh-work-thread {
    display: flex;
    min-height: 0;
    flex-direction: column;
}

.oh-work-thread-header {
    min-height: 68px;
    padding: 12px 15px;
    border-bottom: 1px solid #e3e6eb;
}

.oh-work-thread-header h2 { overflow-wrap: anywhere; font-size: 16px; }
.oh-work-thread-header > div > span { font-size: 11px; }
.oh-work-thread-actions { justify-content: flex-end; }

.oh-work-message-list {
    display: flex;
    min-height: 300px;
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    gap: 11px;
    overflow: auto;
    padding: 15px;
    background: #f7f8fa;
}

.oh-work-load-older {
    align-self: center;
    flex: 0 0 auto;
    padding: 6px 11px;
    border: 1px solid #d5dae1;
    border-radius: 5px;
    background: #fff;
    color: #a51c2b;
    font-size: 12px;
    cursor: pointer;
}

.oh-work-load-older:hover:not(:disabled) { background: #f8e9ec; border-color: #e5bcc4; }
.oh-work-load-older:focus-visible { outline: 2px solid #a51c2b; outline-offset: 2px; }
.oh-work-load-older:disabled { color: #7b8492; cursor: wait; }

.oh-work-message {
    width: min(82%, 680px);
    padding: 10px 12px 7px;
    border: 1px solid #e0e4ea;
    border-radius: 6px;
    background: #fff;
}

.oh-work-message.is-own {
    align-self: flex-end;
    border-color: #e9c7cd;
    background: #fff7f8;
}

.oh-work-message-meta { display: flex; justify-content: space-between; gap: 10px; }
.oh-work-message-meta strong { color: #163450; font-size: 11.5px; font-weight: 600; }
.oh-work-message-meta time { color: #7b8492; font-size: 10px; white-space: nowrap; }
.oh-work-message p { margin: 7px 0 2px; color: #303949; font-size: 13px; white-space: pre-wrap; overflow-wrap: anywhere; }
.oh-work-message-read { display: flex; justify-content: flex-end; align-items: center; gap: 4px; margin: 2px 0 3px; color: #8e1624; font-size: 10.5px; }
.oh-work-message-read .dx-icon { font-size: 11px; }

.oh-work-compose {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    padding: 12px;
    border-top: 1px solid #e3e6eb;
    background: #fff;
}

.oh-work-compose-input { flex: 1; min-width: 0; }
.oh-work-thread-empty { display: grid; flex: 1; align-content: center; justify-items: center; gap: 9px; padding: 35px; color: #687386; text-align: center; }
.oh-work-thread-empty-icon { display: grid; width: 48px; aspect-ratio: 1; place-items: center; border-radius: 50%; background: #f8e9ec; color: #a51c2b; font-size: 20px; }
.oh-work-thread-empty-label { color: #8a93a3; font-size: 10px; font-weight: 600; }
.oh-work-thread-empty strong { color: #1b2230; font-size: 14px; }
.oh-work-thread-empty span:last-child { font-size: 12px; }

.oh-work-empty {
    display: grid;
    justify-items: center;
    gap: 6px;
    padding: 30px 16px;
    color: #687386;
    text-align: center;
    font-size: 12px;
}
.oh-work-empty strong { color: #1b2230; font-size: 13px; font-weight: 600; }
.oh-work-empty > .dx-icon { display: grid; width: 36px; aspect-ratio: 1; place-items: center; border-radius: 50%; background: #f1f3f6; color: #687386; font-size: 15px; }
.oh-work-empty-conversations { flex: 1; align-content: center; padding: 28px 18px; }
.oh-work-empty-conversations > .dx-icon { width: 42px; font-size: 17px; }
.oh-work-empty-data { min-height: 190px; align-content: center; }

.oh-work-task-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(300px, .9fr);
    align-items: start;
    gap: 12px;
    min-width: 0;
}

.oh-work-task-filters { padding: 8px 12px; border-bottom: 1px solid #eef0f3; }
.oh-work-data-panel { overflow-x: auto; overflow-y: hidden; }
.oh-work-inline-actions { justify-content: flex-end; }
.oh-work-check { display: inline-flex; align-items: center; gap: 7px; color: #5b6475; font-size: 12px; }
.oh-work-check input { accent-color: #a51c2b; }
.oh-work-task-grid { width: 100%; }
.oh-work-grid-actions { display: flex; align-items: center; gap: 5px; }
.oh-work-task-title { max-width: 100%; overflow: hidden; padding: 0; border: 0; background: transparent; color: #163450; font: inherit; text-align: left; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.oh-work-task-title:hover { color: #a51c2b; text-decoration: underline; }
.oh-work-task-title:focus-visible { outline: 2px solid #a51c2b; outline-offset: 2px; }
.oh-work-record-reference { color: #163450; font-size: 11px; }
.oh-work-muted { color: #8992a0; }
.oh-work-status-badge,
.oh-work-priority-badge { display: inline-flex; min-height: 22px; align-items: center; padding: 3px 8px; border-radius: 11px; font-size: 10.5px; font-weight: 600; white-space: nowrap; }
.oh-work-status-badge.is-new { background: #edf0f4; color: #5b6475; }
.oh-work-status-badge.is-in-progress { background: #e8f2fa; color: #245d8a; }
.oh-work-status-badge.is-waiting { background: #fff4dd; color: #805600; }
.oh-work-status-badge.is-complete { background: #e9f5ed; color: #31764a; }
.oh-work-status-badge.is-cancelled { background: #f1f2f4; color: #7b8492; }
.oh-work-priority-badge.is-low { background: #edf2f7; color: #5b6475; }
.oh-work-priority-badge.is-normal { background: #f1f3f6; color: #4f596a; }
.oh-work-priority-badge.is-high { background: #fff1df; color: #995000; }
.oh-work-priority-badge.is-urgent { background: #fae8eb; color: #a51c2b; }
.oh-work-task-deadline { display: inline-flex; flex-direction: column; gap: 2px; color: #303949; font-size: 11.5px; white-space: nowrap; }
.oh-work-task-deadline small { color: #687386; font-size: 10px; }
.oh-work-task-deadline.is-overdue { color: #a51c2b; font-weight: 600; }
.oh-work-task-deadline.is-overdue small { color: #a51c2b; }

.oh-work-reminder-tools { display: grid; gap: 7px; padding: 9px 12px; border-bottom: 1px solid #eef0f3; }
.oh-work-reminder-search { display: flex; min-height: 34px; align-items: center; gap: 8px; padding: 0 9px; border: 1px solid #d5dae1; border-radius: 5px; background: #fff; color: #a51c2b; }
.oh-work-reminder-search:focus-within { border-color: #a51c2b; box-shadow: 0 0 0 2px #f8e9ec; }
.oh-work-reminder-search input { width: 100%; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; color: #1b2230; font: inherit; font-size: 12px; }
.oh-work-reminder-search input::placeholder { color: #8a93a3; }
.oh-work-reminder-search input:focus-visible { outline: 2px solid #a51c2b; outline-offset: 2px; }
.oh-work-reminder-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.oh-work-reminder-filter { display: inline-flex; min-height: 28px; align-items: center; justify-content: center; gap: 5px; padding: 3px 8px; border: 1px solid #d5dae1; border-radius: 4px; background: #fff; color: #5b6475; font: inherit; font-size: 10.5px; white-space: nowrap; cursor: pointer; }
.oh-work-reminder-filter > span { display: inline-grid; min-width: 17px; height: 17px; place-items: center; padding: 0 4px; border-radius: 9px; background: #edf0f4; color: #5b6475; font: 10px "IBM Plex Mono", monospace; }
.oh-work-reminder-filter:hover { background: #f6f7f9; color: #163450; }
.oh-work-reminder-filter.is-active { border-color: #a51c2b; background: #a51c2b; color: #fff; }
.oh-work-reminder-filter.is-active > span { background: rgba(255, 255, 255, .18); color: #fff; }
.oh-work-reminder-filter:focus-visible,
.oh-work-reminder-filter-reset:focus-visible { outline: 2px solid #a51c2b; outline-offset: 2px; }
.oh-work-reminder-filter-reset { min-height: 28px; margin-left: auto; padding: 3px 7px; border: 0; border-radius: 4px; background: transparent; color: #a51c2b; font: inherit; font-size: 10.5px; cursor: pointer; }
.oh-work-reminder-filter-reset:hover { background: #f8e9ec; }
.oh-work-reminder-list { display: grid; }
.oh-work-reminder {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 12px 15px;
    border-bottom: 1px solid #eef0f3;
}
.oh-work-reminder:last-child { border-bottom: 0; }
.oh-work-reminder-icon { color: #a51c2b; font-size: 17px; }
.oh-work-reminder strong { font-size: 12.5px; font-weight: 600; }
.oh-work-reminder p { margin: 3px 0; color: #5b6475; font-size: 12px; white-space: pre-wrap; }
.oh-work-reminder small { color: #7b8492; font-size: 10.5px; }
.oh-work-reminder.is-complete { opacity: .65; }
.oh-work-complete-label { color: #31764a; font-size: 11px; font-weight: 600; }

.oh-work-calendar-panel { padding: 0 14px 14px; }
.oh-work-calendar-toolbar { min-height: 58px; }
.oh-work-month-nav { justify-content: flex-start; }
.oh-work-calendar-toolbar h2 { min-width: 145px; color: #163450; text-align: center; text-transform: capitalize; font-size: 15px; }
.oh-work-calendar-filter-group { display: flex; align-items: center; gap: 3px; padding: 3px; border: 1px solid #e3e6eb; border-radius: 6px; background: #f8f9fb; }
.oh-work-calendar-filter { display: inline-flex; min-height: 30px; align-items: center; justify-content: center; gap: 6px; padding: 4px 9px; border: 0; border-radius: 4px; background: transparent; color: #5b6475; font: inherit; font-size: 11px; white-space: nowrap; cursor: pointer; }
.oh-work-calendar-filter > span { display: inline-grid; min-width: 18px; height: 18px; place-items: center; padding: 0 4px; border-radius: 9px; background: #e9edf2; color: #5b6475; font: 10px "IBM Plex Mono", monospace; }
.oh-work-calendar-filter:hover { background: #f1f3f6; color: #163450; }
.oh-work-calendar-filter.is-active { background: #a51c2b; color: #fff; }
.oh-work-calendar-filter.is-active > span { background: rgba(255, 255, 255, .18); color: #fff; }
.oh-work-calendar-filter:focus-visible { outline: 2px solid #a51c2b; outline-offset: 2px; }
.oh-work-calendar-filter-total { flex: 0 0 auto; color: #687386; font-size: 11px; white-space: nowrap; }
.oh-work-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    overflow: hidden;
    border-top: 1px solid #d5dae1;
    border-left: 1px solid #d5dae1;
    border-radius: 4px;
}
.oh-work-calendar-weekday,
.oh-work-calendar-day { min-width: 0; border-right: 1px solid #d5dae1; border-bottom: 1px solid #d5dae1; }
.oh-work-calendar-weekday { padding: 8px 5px; background: #f1f3f6; color: #5b6475; text-align: center; font-size: 11px; font-weight: 600; }
.oh-work-calendar-day { min-height: 104px; padding: 6px; background: #fff; }
.oh-work-calendar-day.is-outside { background: #f8f9fb; color: #9aa2ae; }
.oh-work-calendar-day.is-today { background: #fff9fa; box-shadow: inset 0 2px #a51c2b; }
.oh-work-calendar-day-header { display: flex; min-height: 22px; align-items: center; justify-content: space-between; margin-bottom: 2px; }
.oh-work-day-number { display: inline-grid; width: 22px; aspect-ratio: 1; place-items: center; border-radius: 50%; color: #4f596a; font-size: 11px; }
.oh-work-calendar-add { display: inline-grid; width: 22px; height: 22px; place-items: center; border: 0; border-radius: 4px; background: transparent; color: #687386; font-size: 12px; cursor: pointer; }
.oh-work-calendar-add:hover { background: #f1f3f6; color: #a51c2b; }
.oh-work-calendar-add:focus-visible { outline: 2px solid #a51c2b; outline-offset: 1px; }
.oh-work-calendar-day.is-today .oh-work-day-number { background: #a51c2b; color: #fff; }
.oh-work-calendar-event { display: block; width: 100%; overflow: hidden; margin-top: 4px; padding: 3px 5px; border: 0; border-left: 2px solid; border-radius: 3px; font: inherit; font-size: 10px; line-height: 1.35; text-align: left; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.oh-work-calendar-event:hover { filter: brightness(.97); }
.oh-work-calendar-event:focus-visible { outline: 2px solid #a51c2b; outline-offset: 1px; }
.oh-work-calendar-event span { font-weight: 600; }
.oh-work-calendar-event.is-task,
.oh-work-calendar-legend .is-task { border-color: #31764a; background: #edf6ef; color: #285e3d; }
.oh-work-calendar-event.is-reminder,
.oh-work-calendar-legend .is-reminder { border-color: #b17318; background: #fff5e5; color: #80540f; }
.oh-work-more-events { display: block; margin: 4px 2px; padding: 2px 4px; border: 0; border-radius: 3px; background: transparent; color: #687386; font: inherit; font-size: 10px; text-align: left; cursor: pointer; }
.oh-work-more-events:hover { background: #f1f3f6; color: #163450; }
.oh-work-more-events:focus-visible { outline: 2px solid #a51c2b; outline-offset: 1px; }
.oh-work-calendar-day-list { width: min(640px, 100%); }
.oh-work-calendar-create { width: min(440px, 100%); }
.oh-work-calendar-create-body { gap: 9px; }
.oh-work-calendar-create-body p { margin: 0 0 3px; color: #5b6475; font-size: 12px; }
.oh-work-calendar-create-body > .dxbl-btn { width: 100%; justify-content: flex-start; }
.oh-work-calendar-day-list-body { gap: 6px; }
.oh-work-calendar-day-item { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; min-height: 54px; padding: 8px 10px; border: 1px solid #e3e6eb; border-left: 3px solid; border-radius: 5px; background: #fff; color: #1b2230; text-align: left; cursor: pointer; }
.oh-work-calendar-day-item:hover { background: #f8f9fb; }
.oh-work-calendar-day-item:focus-visible { outline: 2px solid #a51c2b; outline-offset: 1px; }
.oh-work-calendar-day-item.is-task { border-left-color: #31764a; }
.oh-work-calendar-day-item.is-reminder { border-left-color: #b17318; }
.oh-work-calendar-day-item-time { color: #5b6475; font: 11.5px "IBM Plex Mono", monospace; }
.oh-work-calendar-day-item-main { display: grid; min-width: 0; gap: 3px; }
.oh-work-calendar-day-item-main strong { overflow: hidden; color: #1b2230; font-size: 12.5px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.oh-work-calendar-day-item-main small { overflow: hidden; color: #687386; font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.oh-work-calendar-day-item-status { color: #5b6475; font-size: 10.5px; white-space: nowrap; }
.oh-work-calendar-legend { display: flex; gap: 8px; margin-top: 11px; }
.oh-work-calendar-legend span { padding: 4px 8px; border-radius: 4px; font-size: 10px; }
.oh-work-calendar-detail-body { gap: 0; }
.oh-work-calendar-detail-footer { justify-content: flex-end; gap: 8px; }
.oh-work-detail-body { gap: 0; }
.oh-work-calendar-detail-row { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid #eef0f3; }
.oh-work-detail-row { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid #eef0f3; }
.oh-work-calendar-detail-row span,
.oh-work-detail-row span,
.oh-work-calendar-detail-description > span { color: #687386; font-size: 11.5px; }
.oh-work-detail-description > span { color: #687386; font-size: 11.5px; }
.oh-work-calendar-detail-row strong { color: #1b2230; font-size: 12.5px; font-weight: 500; text-align: right; }
.oh-work-detail-row strong { color: #1b2230; font-size: 12.5px; font-weight: 500; text-align: right; }
.oh-work-calendar-detail-description { padding-top: 13px; }
.oh-work-detail-description { padding-top: 13px; }
.oh-work-calendar-detail-description p { margin: 6px 0 0; color: #303949; font-size: 12.5px; white-space: pre-wrap; overflow-wrap: anywhere; }
.oh-work-detail-description p { margin: 6px 0 0; color: #303949; font-size: 12.5px; white-space: pre-wrap; overflow-wrap: anywhere; }

.oh-work-alert { padding: 10px 12px; border: 1px solid #ebc4ca; border-radius: 5px; background: #fff5f6; color: #8e1624; font-size: 12px; }
.oh-work-overlay { position: fixed; z-index: 1300; inset: 0; display: grid; place-items: center; padding: 18px; background: rgba(14, 26, 39, .42); }
.oh-work-task-edit-overlay { z-index: 1310; }
.oh-work-modal { display: flex; width: min(620px, 100%); max-height: min(88vh, 820px); flex-direction: column; overflow: hidden; border: 1px solid #d5dae1; border-radius: 7px; background: #fff; box-shadow: 0 18px 50px rgba(14, 39, 64, .25); }
.oh-work-modal-header { min-height: 68px; padding: 13px 17px; border-bottom: 1px solid #e3e6eb; }
.oh-work-modal-header h2 { font-size: 17px; }
.oh-work-modal-close { width: 34px; height: 34px; border: 0; border-radius: 5px; background: transparent; color: #687386; font-size: 25px; line-height: 1; }
.oh-work-modal-close:hover { background: #f1f3f6; color: #1b2230; }
.oh-work-modal-body { display: grid; gap: 8px; overflow: auto; padding: 16px 17px; }
.oh-work-modal-body label { margin-top: 4px; color: #4f596a; font-size: 11.5px; font-weight: 600; }
.oh-work-form-hint { margin-top: -5px; color: #5b6475; font-size: 11.5px; line-height: 1.4; }
.oh-work-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.oh-work-form-grid > div { display: grid; gap: 7px; min-width: 0; }
.oh-work-form-wide { grid-column: 1 / -1; }
.oh-work-modal-footer { justify-content: flex-end; padding: 12px 17px; border-top: 1px solid #e3e6eb; background: #fbfbfc; }

.oh-work-page :focus-visible,
.oh-work-overlay :focus-visible { outline: 2px solid #a51c2b; outline-offset: 2px; }

@media (max-width: 900px) {
    .oh-work-messages-layout { grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); }
    .oh-work-task-layout { grid-template-columns: minmax(0, 1fr); }
    .oh-work-conversation { grid-template-columns: 34px minmax(0, 1fr); }
    .oh-work-avatar { width: 32px; }
    .oh-work-conversation-meta { grid-column: 2; grid-template-columns: auto auto; justify-items: start; }
    .oh-work-thread-actions { flex-wrap: wrap; }
    .oh-work-calendar-day { min-height: 90px; }
}

@media (max-width: 1100px) {
    .oh-work-task-layout { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 680px) {
    .oh-work-reminder-toast { right: 10px; bottom: 10px; width: calc(100vw - 20px); }
    .oh-work-page { gap: 10px; padding: 0 0 14px; }
    .oh-work-header { align-items: flex-start; padding: 12px; }
    .oh-work-header h1 { font-size: 17px; }
    .oh-work-header p { max-width: 260px; font-size: 11.5px; }
    .oh-work-header-actions .dxbl-btn { min-width: 38px; padding-inline: 8px; }
    .oh-work-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .oh-work-summary > div { min-height: 56px; padding: 7px 10px; }
    .oh-work-summary > div:nth-child(3) { border-left: 0; border-top: 1px solid #e3e6eb; }
    .oh-work-summary > div:nth-child(4) { border-top: 1px solid #e3e6eb; }
    .oh-work-summary strong { font-size: 15px; }
    .oh-work-tabs { min-height: 40px; }
    .oh-work-tabs button { min-width: 0; flex: 1; padding: 8px 5px; font-size: 12px; }
    .oh-work-messages-layout { grid-template-columns: minmax(0, 1fr); height: auto; min-height: 0; max-height: none; }
    .oh-work-conversations { max-height: 250px; }
    .oh-work-conversation-list { max-height: 190px; }
    .oh-work-thread { min-height: 62vh; }
    .oh-work-thread-header { align-items: flex-start; flex-direction: column; }
    .oh-work-thread-actions { width: 100%; justify-content: flex-start; }
    .oh-work-message-list { min-height: 260px; max-height: 52vh; padding: 10px; }
    .oh-work-message { width: min(92%, 680px); }
    .oh-work-compose { align-items: stretch; flex-direction: column; }
    .oh-work-panel-heading { align-items: flex-start; flex-direction: column; }
    .oh-work-inline-actions { width: 100%; justify-content: space-between; flex-wrap: wrap; }
    .oh-work-data-panel { overflow-x: auto; }
    .oh-work-task-layout { gap: 10px; }
    .oh-work-task-grid { min-width: 760px; }
    .oh-work-calendar-panel { padding-inline: 7px; }
    .oh-work-calendar-toolbar { align-items: flex-start; flex-direction: column; padding: 10px 0; }
    .oh-work-month-nav { width: 100%; gap: 6px; }
    .oh-work-calendar-toolbar h2 { min-width: 0; flex: 1; font-size: 14px; }
    .oh-work-calendar-filter-group { width: 100%; box-sizing: border-box; }
    .oh-work-calendar-filter { flex: 1; gap: 4px; padding-inline: 5px; font-size: 10px; }
    .oh-work-calendar-filter-total { align-self: flex-end; }
    .oh-work-calendar-grid { border-radius: 3px; }
    .oh-work-calendar-weekday { padding: 7px 1px; font-size: 9px; }
    .oh-work-calendar-day { min-height: 72px; padding: 3px; }
    .oh-work-day-number { width: 19px; font-size: 10px; }
    .oh-work-calendar-event { padding: 2px 3px; font-size: 9px; }
    .oh-work-calendar-event span { display: none; }
    .oh-work-more-events { font-size: 9px; }
    .oh-work-calendar-day-item { grid-template-columns: 40px minmax(0, 1fr); gap: 7px; padding: 8px; }
    .oh-work-calendar-day-item-status { grid-column: 2; }
    .oh-work-reminder { grid-template-columns: 22px minmax(0, 1fr); align-items: start; padding: 10px; }
    .oh-work-reminder > .dxbl-btn,
    .oh-work-complete-label { grid-column: 2; justify-self: start; }
    .oh-work-reminder-tools { padding: 8px; }
    .oh-work-reminder-filters { gap: 3px; }
    .oh-work-task-filters { padding: 8px; }
    .oh-work-reminder-filter { flex: 1 1 auto; padding-inline: 6px; font-size: 10px; }
    .oh-work-reminder-filter-reset { margin-left: 0; }
    .oh-work-overlay { align-items: end; padding: 0; }
    .oh-work-modal { width: 100%; max-height: 92dvh; border-radius: 8px 8px 0 0; }
    .oh-work-form-grid { grid-template-columns: minmax(0, 1fr); }
    .oh-work-form-wide { grid-column: auto; }
}
