.clairety-notification-nav-link { position: relative; }
.clairety-notification-nav-link svg { width: 18px; height: 18px; }
.clairety-notification-badge { align-items: center; background: #d85454; border: 2px solid #fff; border-radius: 999px; color: #fff; display: inline-flex; font-size: 9px; font-weight: 700; justify-content: center; line-height: 1; min-height: 16px; min-width: 16px; padding: 1px 3px; position: absolute; right: -5px; top: -5px; }
.clairety-notification-badge[hidden] { display: none; }
.clairety-notification-panel { background: #fff; border: 1px solid #dce5e8; border-radius: 14px; box-shadow: 0 18px 55px rgba(23, 47, 58, .18); color: #243840; max-height: min(720px, calc(100vh - 40px)); overflow: hidden; position: fixed; right: 24px; top: 72px; width: min(430px, calc(100vw - 32px)); z-index: 10000; }
.clairety-notification-panel[hidden] { display: none; }
.clairety-notification-panel-header { align-items: flex-start; border-bottom: 1px solid #e7eef0; display: flex; justify-content: space-between; padding: 18px 20px 14px; }
.clairety-notification-panel-header-actions { align-items: center; display: flex; gap: 12px; }
.clairety-notification-eyebrow { color: #35aeb3; display: block; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.clairety-notification-panel h2 { font-size: 20px; margin: 4px 0 0; }
.clairety-notification-close { background: transparent; border: 0; color: #6d7e84; cursor: pointer; font-size: 25px; line-height: 1; }
.clairety-notification-delete-all { background: transparent; border: 0; color: #a13e3e; cursor: pointer; font-size: 11px; font-weight: 700; padding: 4px 0; }
.clairety-notification-delete-all:disabled { cursor: wait; opacity: .55; }
.clairety-notification-list { max-height: calc(min(720px, 100vh - 40px) - 78px); overflow: auto; padding: 8px; }
.clairety-notification-item { border-bottom: 1px solid #edf2f3; padding: 14px 12px; }
.clairety-notification-item.is-clickable { cursor: pointer; }
.clairety-notification-item.is-clickable:hover { background: #f7fbfb; border-radius: 9px; }
.clairety-notification-item:last-child { border-bottom: 0; }
.clairety-notification-item.is-unread { background: #f1fbfb; border-radius: 9px; }
.clairety-notification-item-top, .clairety-notification-item-actions { align-items: center; display: flex; gap: 9px; }
.clairety-notification-item-top { justify-content: space-between; }
.clairety-notification-item time { color: #809097; font-size: 11px; }
.clairety-notification-priority { border-radius: 999px; font-size: 10px; font-weight: 700; padding: 4px 7px; text-transform: uppercase; }
.priority-urgent { background: #fde8e8; color: #a93434; }
.priority-today { background: #fff4dc; color: #94620b; }
.priority-routine { background: #e8f5f5; color: #287c81; }
.clairety-notification-item h3 { font-size: 14px; margin: 10px 0 4px; }
.clairety-notification-item p { color: #53666d; font-size: 13px; line-height: 1.45; margin: 0 0 10px; }
.clairety-notification-item-actions button, .clairety-notification-action { background: transparent; border: 0; color: #238f96; cursor: pointer; font-size: 12px; padding: 0; text-decoration: none; }
.clairety-notification-empty { color: #60737a; display: grid; gap: 5px; padding: 42px 20px; text-align: center; }
.clairety-notification-empty strong { color: #29434b; }
.clairety-gap-review { padding: 14px 12px 20px; }
.clairety-gap-review-back { background: transparent; border: 0; color: #238f96; cursor: pointer; font-size: 12px; margin-bottom: 18px; padding: 0; }
.clairety-gap-review h3 { font-size: 17px; margin: 6px 0 8px; }
.clairety-gap-review p { color: #53666d; font-size: 13px; line-height: 1.45; }
.clairety-gap-review-instructions { color: #29434b !important; font-size: 13px !important; line-height: 1.5 !important; }
.clairety-gap-requester, .clairety-gap-review-instructions { color: #53666d !important; font-size: 13px !important; line-height: 1.5 !important; margin: 0 0 16px !important; }
.clairety-gap-requester strong { color: #53666d; font-size: 13px; }
.clairety-gap-review-help { font-size: 12px !important; margin: 12px 0 0 !important; }
.clairety-gap-review label { color: #29434b; display: block; font-size: 12px; font-weight: 700; margin: 16px 0 6px; }
.clairety-gap-review textarea, .clairety-gap-review input { border: 1px solid #ccdadd; border-radius: 8px; box-sizing: border-box; color: #243840; font: inherit; font-size: 13px; padding: 9px 10px; width: 100%; }
.clairety-gap-review textarea { min-height: 110px; resize: vertical; }
.clairety-gap-example-toggle { background: transparent; border: 0; color: #238f96; cursor: pointer; display: block; font-size: 12px; margin: 8px 0 14px; padding: 0; }
.clairety-gap-example { background: #f7fbfb; border-left: 3px solid #35aeb3; color: #53666d !important; font-size: 12px !important; margin: 8px 0 0 !important; padding: 9px 10px; }
.clairety-gap-review-submit { background: #238f96; border: 0; border-radius: 8px; color: #fff; cursor: pointer; font-size: 13px; font-weight: 700; margin-top: 18px; padding: 10px 14px; }
.clairety-gap-review-submit:disabled { cursor: wait; opacity: .65; }
.clairety-gap-review-status { color: #a13e3e !important; margin-top: 10px !important; }
.clairety-gap-review-status.is-success { color: #277b62 !important; }
.clairety-gap-situation { background: #f7fbfb; border-radius: 8px; padding: 10px; }
.clairety-gap-conflict { background: #fff8e8; border-radius: 8px; display: grid; gap: 4px; margin: 12px 0; padding: 10px; }
.clairety-gap-conflict strong { color: #6f5318; font-size: 12px; }
.clairety-gap-conflict span, .clairety-gap-conflict small { color: #53666d; font-size: 12px; }
@media (max-width: 600px) { .clairety-notification-panel { right: 16px; top: 60px; width: calc(100vw - 32px); } }
@media (max-width: 820px) {
  body.clairety-app .clairety-notification-nav-link {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    margin-left: 8px;
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.08);
  }
  body.clairety-app .clairety-notification-nav-link svg { color: #ffffff; }
}