/* Prompt pad: a text area that slides up from the bottom of the screen. Opened from the filter bar. */

.smart-filter-search .smart-search-input { padding-right: 82px; }
.smart-filter-search .smart-search-clear { right: 46px; }

.prompt-pad-toggle {
    position: absolute;
    right: 7px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 34px;
    height: 30px;
    padding: 0;
    font-size: 15px;
    line-height: 1;
    color: #fff;
    background: linear-gradient(135deg, #6366f1, #4f46e5);
    border: none;
    border-radius: 8px;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(99, 102, 241, 0.4);
    transition: box-shadow 0.25s ease, background 0.25s ease, transform 0.25s ease;
}
.prompt-pad-toggle:hover { transform: translateY(-50%) scale(1.08); box-shadow: 0 5px 14px rgba(99, 102, 241, 0.6); background: linear-gradient(135deg, #7c7ff5, #5b52ea); }
.prompt-pad-toggle:active { transform: translateY(-50%) scale(0.97); }
.prompt-pad-toggle:focus-visible { outline: 2px solid #a5b4fc; outline-offset: 2px; }
.prompt-pad-toggle[aria-expanded="true"] { background: linear-gradient(135deg, #22c55e, #16a34a); box-shadow: 0 3px 12px rgba(34, 197, 94, 0.5); }

.prompt-pad {
    position: fixed;
    left: 50%;
    bottom: 0;
    z-index: 1200;
    width: var(--pp-width, min(1400px, calc(100vw - 16px)));
    height: var(--pp-height, min(66vh, 760px));
    min-width: min(380px, calc(100vw - 16px));
    max-width: calc(100vw - 16px);
    min-height: 200px;
    max-height: calc(100vh - 90px);
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, #17183a, #0f1026);
    border: 1px solid rgba(129, 140, 248, 0.45);
    border-bottom: 0;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -18px 50px rgba(0, 0, 0, 0.55), 0 -2px 0 rgba(129, 140, 248, 0.35);
    color: #e5e7eb;
    transform: translate(-50%, 105%);
    visibility: hidden;
    transition: transform 0.4s cubic-bezier(0.22, 0.8, 0.3, 1), visibility 0s linear 0.4s;
}
.prompt-pad.is-open {
    transform: translate(-50%, 0);
    visibility: visible;
    transition-delay: 0s;
}

.prompt-pad .pp-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 14px;
    flex: 0 0 auto;
    padding: 12px 34px 12px 16px;   /* room on the right for the resize corner */
    border-bottom: 1px solid rgba(129, 140, 248, 0.2);
}
.prompt-pad .pp-title { font-size: 0.95rem; color: #fff; white-space: nowrap; }
.prompt-pad .pp-stats { font-size: 0.78rem; color: #a5b4fc; white-space: nowrap; }
.prompt-pad .pp-saved { font-size: 0.76rem; color: #86efac; min-height: 1em; }
.prompt-pad .pp-spacer { flex: 1; }
.prompt-pad .pp-btn {
    padding: 7px 14px;
    font: inherit;
    font-size: 0.82rem;
    font-weight: 600;
    color: #e0e7ff;
    background: rgba(99, 102, 241, 0.18);
    border: 1px solid rgba(129, 140, 248, 0.4);
    border-radius: 9px;
    cursor: pointer;
    transition: background 0.2s;
}
.prompt-pad .pp-btn:hover { background: rgba(99, 102, 241, 0.38); }
.prompt-pad .pp-btn:focus-visible, .prompt-pad .pp-undo:focus-visible { outline: 2px solid #a5b4fc; outline-offset: 2px; }
.prompt-pad .pp-btn-warn { color: #fecaca; background: rgba(239, 68, 68, 0.12); border-color: rgba(248, 113, 113, 0.45); }
.prompt-pad .pp-btn-warn:hover { background: rgba(239, 68, 68, 0.3); }
.prompt-pad .pp-btn.is-done { color: #052e16; background: #4ade80; border-color: #4ade80; }
.prompt-pad .pp-undo {
    margin-left: 6px; padding: 2px 10px; font: inherit; font-size: 0.76rem; font-weight: 700;
    color: #fde68a; background: rgba(251, 191, 36, 0.14); border: 1px solid rgba(251, 191, 36, 0.5); border-radius: 999px; cursor: pointer;
}

.prompt-pad .pp-editor { position: relative; flex: 1 1 auto; min-height: 0; background: #0a0b1d; border-radius: 0; }
.prompt-pad .pp-editor > .pp-text {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 14px 18px;
    resize: none;
    font-family: 'JetBrains Mono', 'Consolas', 'Monaco', monospace;
    font-size: 0.92rem;
    line-height: 1.65;
    color: #f1f5f9;
    background: #0a0b1d;
    border: 0;
    border-radius: 0;
    outline: none;
    tab-size: 4;
}
.prompt-pad .pp-text::placeholder { color: #6b7194; }
.prompt-pad .pp-text:focus { box-shadow: inset 0 0 0 2px rgba(129, 140, 248, 0.55); }

/* keep the end of the page reachable while the pad is open */
body.prompt-pad-open { padding-bottom: calc(var(--pp-h, 320px) + 12px); }

@media (max-width: 600px) {
    .prompt-pad .pp-stats { display: none; }
    .prompt-pad .pp-head { padding: 10px 12px; }
}
@media (prefers-reduced-motion: reduce) {
    .prompt-pad { transition-duration: 0.01s; }
}

/* direction switch + push feedback */
.prompt-pad .pp-dir { min-width: 74px; font-variant-numeric: tabular-nums; }
.prompt-pad .pp-editor.pp-flash { animation: pp-flash 0.9s ease; }
@keyframes pp-flash {
    0% { box-shadow: inset 0 0 0 3px rgba(74, 222, 128, 0.95); background: #0d1a22; }
    100% { box-shadow: inset 0 0 0 2px rgba(129, 140, 248, 0); background: #0a0b1d; }
}

/* "Push" button on every item of the list */
.dict-actions .btn.dict-push-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: linear-gradient(135deg, #06b6d4, #0891b2);
    border: none;
    color: #fff;
    cursor: pointer;
}
.dict-actions .btn.dict-push-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(8, 145, 178, 0.45); filter: brightness(1.06); }
.dict-actions .btn.dict-push-btn.pushed { background: linear-gradient(135deg, #22c55e, #16a34a); }
.dict-actions .btn.dict-push-btn svg { flex-shrink: 0; }

/* resize corner (top right): drag to make the pad wider (both sides) and taller */
.prompt-pad .pp-grip {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3;
    width: 26px;
    height: 26px;
    border-top-right-radius: 18px;
    cursor: nesw-resize;
    touch-action: none;
    user-select: none;
    background: linear-gradient(225deg, transparent 0 38%, #818cf8 38% 45%, transparent 45% 55%, #818cf8 55% 62%, transparent 62% 72%, #818cf8 72% 79%, transparent 79%);
    opacity: 0.75;
    transition: opacity 0.2s;
}
.prompt-pad .pp-grip:hover, .prompt-pad .pp-grip:focus-visible, .prompt-pad.is-resizing .pp-grip { opacity: 1; outline: none; }
.prompt-pad .pp-grip:focus-visible { box-shadow: 0 0 0 2px #a5b4fc; }
.prompt-pad.is-resizing { transition: none; user-select: none; }
.prompt-pad.is-resizing .pp-editor { pointer-events: none; }

/* CodeMirror 5 editor inside the pad (dark theme, fills the pad) */
.prompt-pad .pp-editor .CodeMirror {
    position: absolute;
    inset: 0;
    width: auto;
    height: auto;
    font-family: 'JetBrains Mono', 'Consolas', 'Monaco', monospace;
    font-size: 0.92rem;
    line-height: 1.65;
    color: #f1f5f9;
    background: #0a0b1d;
}
.prompt-pad .CodeMirror-lines { padding: 14px 0; }
.prompt-pad .CodeMirror pre.CodeMirror-line,
.prompt-pad .CodeMirror pre.CodeMirror-line-like { padding: 0 18px; }
.prompt-pad .CodeMirror-cursor { border-left: 2px solid #a5b4fc; }
.prompt-pad .CodeMirror-selected { background: rgba(99, 102, 241, 0.45); }
.prompt-pad .CodeMirror-focused .CodeMirror-selected { background: rgba(99, 102, 241, 0.6); }
.prompt-pad .CodeMirror-placeholder { color: #6b7194 !important; }
.prompt-pad .CodeMirror-focused { box-shadow: inset 0 0 0 2px rgba(129, 140, 248, 0.55); }
.prompt-pad .CodeMirror-scrollbar-filler, .prompt-pad .CodeMirror-gutter-filler { background: #0a0b1d; }
/* Autocomplete suggestions drawn by the browser extension inside the editor */
.prompt-pad .codeium-ghost { opacity: 0.55; color: #94a3b8; }