/* IDNT Support Widget styles */

/* ── Drawer theme reset ── */
/* MudDrawer sets color: var(--mud-palette-drawer-text) which cascades to ALL children.
   We reset the content area so MudBlazor components use their normal palette colors. */
.sw-drawer {
    color: var(--mud-palette-text-primary) !important;
}
.sw-drawer .mud-button-text.mud-button-text-primary {
    color: var(--mud-palette-primary) !important;
}
.sw-drawer .mud-button-text.mud-button-text-primary:hover {
    background-color: var(--mud-palette-primary-hover) !important;
}
.sw-drawer .mud-input,
.sw-drawer .mud-input-label,
.sw-drawer .mud-text {
    color: inherit;
}

/* ── Intro banner ── */
.sw-intro-banner {
    text-align: center;
    padding: 24px 20px 20px;
    margin: -12px -12px 16px -12px;
    position: relative;
}
.sw-intro-icon-ring {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--mud-palette-primary, #1976d2), var(--mud-palette-primary-darken, #1565c0));
    color: #fff !important;
    margin-bottom: 12px;
    box-shadow: 0 4px 12px rgba(25, 118, 210, 0.25);
}
.sw-intro-icon-ring .mud-icon-root {
    color: #fff !important;
}
.sw-intro-headline {
    font-weight: 600 !important;
    color: var(--mud-palette-text-primary) !important;
    margin-bottom: 6px;
}
.sw-intro-body {
    color: var(--mud-palette-text-secondary) !important;
    line-height: 1.55;
    max-width: 340px;
    margin: 0 auto;
}

/* ── Markdown editor ── */

.sw-md-editor {
    border: 1px solid var(--mud-palette-lines-default, rgba(0,0,0,0.12));
    border-radius: var(--mud-default-borderradius, 4px);
    overflow: hidden;
    background-color: var(--mud-palette-surface, #fff);
    color: var(--mud-palette-text-primary, #1e293b);
}

.sw-md-toolbar {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 4px 8px;
    border-bottom: 1px solid var(--mud-palette-lines-default, rgba(0,0,0,0.12));
    background-color: var(--mud-palette-background, #f5f5f5);
    flex-wrap: wrap;
}

.sw-md-toolbar .mud-tooltip-root {
    overflow: hidden;
}

.sw-md-toolbar-group { display: flex; gap: 2px; }
.sw-md-toolbar-divider { width: 1px; height: 20px; background: var(--mud-palette-lines-default, rgba(0,0,0,0.12)); margin: 0 4px; }
.sw-md-toolbar-spacer { flex: 1; }

/* Force icon buttons to use proper text colors, overriding drawer cascade */
.sw-md-toolbar .mud-icon-button {
    color: var(--mud-palette-text-secondary, #475569) !important;
}
.sw-md-toolbar .mud-icon-button:hover {
    background-color: var(--mud-palette-action-default-hover, rgba(0,0,0,0.06)) !important;
}

.sw-md-body { display: flex; min-height: 120px; }
.sw-md-body--split { min-height: 200px; }
.sw-md-edit-pane { flex: 1; display: flex; flex-direction: column; position: relative; }
.sw-md-preview-divider { width: 1px; background: var(--mud-palette-lines-default, rgba(0,0,0,0.08)); }
.sw-md-preview-pane { flex: 1; padding: 12px 16px; overflow-y: auto; max-height: 400px; }
.sw-md-preview-content { font-size: 0.9rem; line-height: 1.6; }

.sw-md-textarea {
    width: 100%;
    min-height: 80px;
    max-height: 400px;
    border: none;
    outline: none;
    resize: none;
    padding: 12px 16px;
    font-family: 'Cascadia Code', 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--mud-palette-text-primary, #1e293b) !important;
    background-color: transparent;
    overflow-y: auto;
}
.sw-md-textarea::placeholder {
    color: var(--mud-palette-text-disabled, #94a3b8) !important;
}

.sw-md-upload-progress { position: absolute; top: 0; left: 0; right: 0; z-index: 1; }

/* ── WYSIWYG contenteditable ── */
.sw-md-wysiwyg {
    width: 100%;
    min-height: 80px;
    border: none;
    outline: none;
    padding: 12px 16px;
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--mud-palette-text-primary, #1e293b);
    background: transparent;
    overflow-y: auto;
    max-height: 500px;
    word-wrap: break-word;
    overflow-wrap: break-word;
}
.sw-md-wysiwyg:focus { outline: none; }
.sw-md-wysiwyg:empty::before {
    content: attr(placeholder);
    color: var(--mud-palette-text-disabled, #94a3b8);
    pointer-events: none;
}
.sw-md-wysiwyg.md-dragover,
.sw-md-textarea.md-dragover {
    background-color: rgba(25, 118, 210, 0.06) !important;
    outline: 2px dashed var(--mud-palette-primary, #1976d2);
    outline-offset: -2px;
}
.sw-md-wysiwyg img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin: 4px 0;
}

/* Image resize wrapper and handles */
.md-img-resize-wrapper {
    display: inline-block;
    position: relative;
    line-height: 0;
    outline: 2px solid var(--mud-palette-primary, #1976d2);
    border-radius: 4px;
}
.md-img-resize-wrapper img { margin: 0; }
.md-img-resize-handle {
    position: absolute;
    width: 10px;
    height: 10px;
    background: var(--mud-palette-primary, #1976d2);
    border: 2px solid #fff;
    border-radius: 50%;
    z-index: 10;
}
.md-img-resize-nw { top: -5px; left: -5px; cursor: nw-resize; }
.md-img-resize-ne { top: -5px; right: -5px; cursor: ne-resize; }
.md-img-resize-sw { bottom: -5px; left: -5px; cursor: sw-resize; }
.md-img-resize-se { bottom: -5px; right: -5px; cursor: se-resize; }

.sw-md-wysiwyg pre {
    background: var(--mud-palette-background-gray, #f1f5f9);
    border-radius: 6px;
    padding: 12px;
    overflow-x: auto;
    margin: 8px 0;
}
.sw-md-wysiwyg pre code { background: transparent; padding: 0; font-size: 0.85rem; }
.sw-md-wysiwyg code {
    background: rgba(0,0,0,0.06);
    padding: 2px 5px;
    border-radius: 3px;
    font-family: 'Cascadia Code', 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
    font-size: 0.85rem;
}
.sw-md-wysiwyg blockquote {
    border-left: 3px solid var(--mud-palette-primary, #1976d2);
    padding-left: 12px;
    margin: 8px 0;
    color: var(--mud-palette-text-secondary, #475569);
}
.sw-md-wysiwyg table { border-collapse: collapse; width: 100%; margin: 8px 0; }
.sw-md-wysiwyg th, .sw-md-wysiwyg td {
    border: 1px solid var(--mud-palette-lines-default, rgba(0,0,0,0.12));
    padding: 6px 10px;
    text-align: left;
}
.sw-md-wysiwyg th { background: var(--mud-palette-background-gray, #f1f5f9); font-weight: 600; }

/* Mode toggle button active state */
.sw-md-mode-toggle--active {
    background: rgba(25, 118, 210, 0.12) !important;
    color: var(--mud-palette-primary, #1976d2) !important;
}

/* Drag-drop indicator */
.sw-md-dragover {
    background-color: rgba(25, 118, 210, 0.06) !important;
    outline: 2px dashed var(--mud-palette-primary, #1976d2);
    outline-offset: -2px;
}

/* Attachments */
.sw-md-attachments {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 8px 12px;
    border-top: 1px solid var(--mud-palette-lines-default, rgba(0,0,0,0.08));
    background-color: var(--mud-palette-background, #fafafa);
}
.sw-md-attachments .mud-chip {
    max-width: 200px;
}
.sw-md-filesize {
    font-size: 0.7rem;
    opacity: 0.7;
    margin-left: 4px;
}
