/* Shared drawer surfaces follow the active application theme, including drawers
   rendered through Ant Design's body-level portal. */
:root {
    --cg-drawer-bg: var(--cg-surface, #ffffff);
    --cg-drawer-raised: var(--cg-surface-raised, var(--cg-surface, #ffffff));
    --cg-drawer-text: var(--ant-text-color, #1f2937);
    --cg-drawer-muted: var(--ant-text-color-secondary, #667085);
    --cg-drawer-border: var(--cg-border, #e5e7eb);
    --cg-drawer-backdrop: var(--grc-backdrop, rgba(15, 23, 42, .45));
}

.ant-drawer-mask {
    background: var(--cg-drawer-backdrop) !important;
}

.ant-drawer .ant-drawer-content,
.ant-drawer .ant-drawer-wrapper-body,
.ant-drawer .ant-drawer-body {
    background: var(--cg-drawer-bg) !important;
    color: var(--cg-drawer-text);
}

.ant-drawer .ant-drawer-header,
.ant-drawer .ant-drawer-footer {
    background: var(--cg-drawer-raised) !important;
    border-color: var(--cg-drawer-border) !important;
    color: var(--cg-drawer-text);
}

.ant-drawer .ant-drawer-title,
.ant-drawer .ant-drawer-body :is(h1, h2, h3, h4, h5, strong, label, .ant-descriptions-item-label) {
    color: var(--ant-heading-color, var(--cg-drawer-text));
}

.ant-drawer .ant-drawer-body :is(p, small, .ant-typography-secondary, .ant-form-item-extra, .ant-form-item-explain) {
    color: var(--cg-drawer-muted);
}

.ant-drawer .ant-drawer-close {
    color: var(--cg-drawer-muted) !important;
}

.ant-drawer .ant-drawer-close:hover {
    color: var(--cg-primary, #1677ff) !important;
    background: color-mix(in srgb, var(--cg-primary, #1677ff) 10%, var(--cg-drawer-bg)) !important;
}

.task-overview-owner-cell,
.dashboard-person {
    color: var(--cg-drawer-text, var(--ant-text-color, #1f2937));
}

.task-overview-owner-cell .ant-avatar,
.dashboard-person .ant-avatar {
    flex: 0 0 auto;
    border: 1px solid var(--cg-drawer-border, #e5e7eb);
}

.ant-drawer .ant-drawer-body :is(.ant-card, .ant-collapse, .ant-list, .ant-descriptions-view, .ant-table, .ant-table-container, .ant-table-content, .ant-table-body) {
    border-color: var(--cg-drawer-border) !important;
    background-color: var(--cg-drawer-bg);
    color: var(--cg-drawer-text);
}

.ant-drawer .ant-drawer-body :is(.ant-input, .ant-input-affix-wrapper, .ant-input-number, .ant-picker, .ant-select-selector, textarea, select) {
    border-color: var(--cg-drawer-border);
    background: var(--cg-drawer-bg);
    color: var(--cg-drawer-text);
}

@media (max-width: 640px) {
    .ant-drawer .ant-drawer-header { padding-inline: 16px; }
    .ant-drawer .ant-drawer-body { padding-inline: 16px; }
    .ant-drawer .ant-drawer-footer { padding: 12px 16px; }
}