/* Lingxi Components: Modal, Toast, Quick Add, Settings, Forms */

/* ── Confirm Dialog ── */
.confirm-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:500;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px);}
.confirm-overlay.open{display:flex;animation:fadeIn .1s ease;}
.confirm-box{background:var(--card);border-radius:var(--radius);padding:var(--sp-5) var(--sp-5);width:300px;max-width:90vw;box-shadow:var(--shadow-lg);animation:slideUp .18s ease;}
.confirm-msg{font-size:var(--fs-md);font-weight:500;color:var(--text);margin-bottom:var(--sp-4);line-height:1.55;}
.confirm-btns{display:flex;gap:8px;justify-content:flex-end;}
.btn-confirm-no{padding:7px 16px;background:#F5F6F8;border:1px solid var(--ink-100);border-radius:var(--radius-sm);font-size:var(--fs-sm);font-weight:500;cursor:pointer;color:var(--text2);transition:background .12s;font-family:inherit;}
.btn-confirm-no:hover{background:var(--ink-100);}
.btn-confirm-yes{padding:7px 16px;background:var(--red);color:white;border:none;border-radius:var(--radius-sm);font-size:var(--fs-sm);font-weight:600;cursor:pointer;transition:opacity .12s;font-family:inherit;}
.btn-confirm-yes:hover{opacity:.85;}

/* ── File Status ── */
.file-status-row{font-size:var(--fs-xs);color:var(--text3);display:flex;align-items:center;gap:5px;padding:2px 0;}
.file-dot{width:6px;height:6px;border-radius:50%;background:var(--text3);flex-shrink:0;transition:background .18s;}
.file-dot.connected{background:var(--green);}
.btn-file-link{background:none;border:none;font-size:var(--fs-xs);color:var(--accent);cursor:pointer;padding:0;font-family:inherit;text-decoration:underline;text-underline-offset:2px;}

/* ── Toast ── */
.toast{position:fixed;bottom:var(--sp-5);left:50%;transform:translateX(-50%) translateY(8px);background:var(--text);color:var(--card);padding:9px var(--sp-4);border-radius:var(--radius-sm);font-size:var(--fs-sm);font-weight:500;z-index:9999;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;white-space:nowrap;box-shadow:var(--shadow-md);letter-spacing:.1px;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* ── Modal ── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:200;display:none;align-items:center;justify-content:center;backdrop-filter:blur(6px);}
.modal-overlay.open{display:flex;animation:fadeIn .12s ease;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
.modal{background:var(--card);border-radius:var(--radius);padding:var(--sp-5);width:540px;max-width:96vw;max-height:92vh;overflow-y:auto;box-shadow:var(--shadow-lg);animation:slideUp .2s ease;border:1px solid var(--ink-100);}
@keyframes slideUp{from{transform:translateY(24px) scale(.97);opacity:0;}to{transform:none;opacity:1;}}
.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-5);}
.modal-title{font-size:var(--fs-xl);font-weight:700;letter-spacing:-.2px;}
.btn-close{background:#F5F6F8;border:none;width:28px;height:28px;border-radius:var(--radius-sm);font-size:var(--fs-sm);cursor:pointer;color:var(--text2);display:flex;align-items:center;justify-content:center;transition:background .12s;}
.btn-close:hover{background:var(--ink-100);}
.modal-tabs{display:flex;gap:0;background:#F5F6F8;border-radius:var(--radius-sm);padding:3px;margin-bottom:var(--sp-5);border:1px solid var(--ink-100);}
.mtab{flex:1;padding:7px;border:none;background:none;border-radius:var(--radius-xs);font-size:var(--fs-sm);font-weight:500;cursor:pointer;color:var(--text2);transition:all .15s;font-family:inherit;}
.mtab.active{background:white;color:var(--text);box-shadow:0 1px 4px rgba(0,0,0,.1);font-weight:600;}
.tab-panel{display:none;}
.tab-panel.active{display:block;}
.fgroup{margin-bottom:var(--sp-3);}
.flabel{font-size:var(--fs-xs);font-weight:700;color:var(--text2);margin-bottom:5px;display:block;letter-spacing:.4px;text-transform:uppercase;}
.finput,.ftarea,.fsel{width:100%;padding:8px var(--sp-3);border:1.5px solid var(--ink-100);border-radius:var(--radius-sm);font-size:var(--fs-base);color:var(--text);background:white;outline:none;transition:all .18s;font-family:inherit;}
.finput:focus,.ftarea:focus,.fsel:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(61,107,78,.1);}
.ftarea{resize:vertical;min-height:60px;}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);}
.url-row{display:flex;gap:8px;}
.url-row .finput{flex:1;}
.btn-fetch{padding:8px var(--sp-3);background:var(--accent-bg);color:var(--accent);border:1.5px solid rgba(61,107,78,.3);border-radius:var(--radius-sm);font-size:var(--fs-sm);font-weight:600;cursor:pointer;white-space:nowrap;transition:all .15s;}
.btn-fetch:hover{background:var(--accent);color:white;box-shadow:0 2px 8px rgba(61,107,78,.3);}
.btn-fetch:disabled{opacity:.45;cursor:not-allowed;}
.fetch-st{font-size:var(--fs-xs);margin-top:5px;min-height:14px;color:var(--text2);}
.fetch-st.ok{color:var(--green);} .fetch-st.err{color:var(--red);}
.modal-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:var(--sp-5);padding-top:var(--sp-4);border-top:1px solid var(--ink-100);}
.btn-cancel{padding:8px 16px;background:#F5F6F8;border:1.5px solid var(--ink-100);border-radius:var(--radius-sm);font-size:var(--fs-sm);font-weight:500;cursor:pointer;color:var(--text2);transition:background .12s;}
.btn-cancel:hover{background:var(--ink-100);}
.btn-save{padding:8px 20px;background:var(--accent-grad);color:white;border:none;border-radius:var(--radius-sm);font-size:var(--fs-sm);font-weight:600;cursor:pointer;transition:all .15s;box-shadow:0 2px 8px rgba(61,107,78,.25);}
.btn-save:hover{opacity:.9;box-shadow:0 4px 12px rgba(61,107,78,.35);}
.api-hint{font-size:var(--fs-xs);color:var(--text3);margin-top:6px;line-height:1.55;}

/* Settings panel — left nav + right form */
.settings-nav-item{font:inherit;background:transparent;border:0;color:var(--text);text-align:left;padding:9px var(--sp-3);border-radius:var(--radius-sm);cursor:pointer;font-size:var(--fs-base);transition:background .15s}
.settings-nav-item:hover{background:rgba(0,0,0,.04)}
.settings-nav-item.active{background:var(--accent-bg);color:var(--accent);font-weight:600;box-shadow:inset 2px 0 0 var(--accent)}
[data-theme="dark"] .settings-nav-item.active{background:var(--accent-bg);color:var(--accent)}
.settings-pane{animation:fadePane .18s ease}
@keyframes fadePane{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.settings-section-title{font-size:var(--fs-lg);font-weight:600;color:var(--text);margin-bottom:var(--sp-3);letter-spacing:-.2px}
.settings-status-row{font-size:var(--fs-sm);color:var(--text3);display:flex;align-items:center;gap:8px;padding:var(--sp-2) var(--sp-3);background:var(--bg);border-radius:var(--radius-sm);margin-bottom:var(--sp-3)}
.settings-dot{width:8px;height:8px;border-radius:50%;background:var(--text3);flex-shrink:0;transition:background .2s}
.settings-label{display:block;font-size:var(--fs-sm);color:var(--text3);margin:var(--sp-3) 0 5px;font-weight:500}
.settings-input{width:100%;font:inherit;padding:9px var(--sp-3);border:1.5px solid var(--ink-100);border-radius:var(--radius-sm);background:var(--card);color:var(--text);outline:none;transition:border .15s,box-shadow .15s}
.settings-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(61,107,78,.12)}
.settings-row{display:flex;gap:8px;margin-top:var(--sp-3)}
.settings-btn-primary{font:inherit;padding:9px 18px;border:0;border-radius:var(--radius-sm);background:var(--accent-grad);color:#fff;cursor:pointer;font-weight:600;box-shadow:0 2px 8px rgba(61,107,78,.25);transition:all .15s}
.settings-btn-primary:hover{box-shadow:0 4px 12px rgba(61,107,78,.35);transform:translateY(-1px)}
.settings-btn-ghost{font:inherit;padding:9px 18px;border:1.5px solid var(--ink-100);border-radius:var(--radius-sm);background:transparent;color:var(--text);cursor:pointer;transition:all .15s}
.settings-btn-ghost:hover{background:var(--bg);border-color:var(--accent)}
.settings-info{font-size:var(--fs-sm);color:var(--text);padding:6px 0}
.settings-msg{font-size:var(--fs-sm);color:var(--text3);margin-top:var(--sp-2);min-height:14px}
.settings-hint{font-size:var(--fs-xs);color:var(--text3);margin-top:var(--sp-2);line-height:1.55}
.settings-radio-group{display:flex;flex-direction:column;gap:var(--sp-1);margin-top:var(--sp-1)}
.settings-radio{display:flex;align-items:center;gap:10px;padding:var(--sp-2) var(--sp-3);border:1.5px solid var(--ink-100);border-radius:var(--radius-sm);cursor:pointer;font-size:var(--fs-base);transition:background .15s,border .15s}
.settings-radio:hover{background:var(--bg)}
.settings-radio input{accent-color:var(--accent)}
.settings-radio:has(input:checked){border-color:var(--accent);background:var(--accent-bg)}

/* ── Quick Add Panel ── */
.quick-add-box{background:var(--card);border-radius:var(--radius);border:1.5px solid var(--ink-100);padding:var(--sp-4) var(--sp-4);margin-bottom:var(--sp-5);box-shadow:var(--shadow-xs);display:none;transition:border-color .2s,box-shadow .2s;}
.quick-add-box:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(61,107,78,.08);}
.quick-add-box.show{display:block;}
.qa-label{font-size:var(--fs-xs);color:var(--text2);font-weight:700;margin-bottom:var(--sp-3);display:flex;align-items:center;gap:5px;letter-spacing:.2px;}
.qa-row{display:flex;gap:8px;}
.qa-input{flex:1;padding:9px var(--sp-3);border:1.5px solid var(--ink-100);border-radius:var(--radius-sm);font-size:var(--fs-base);color:var(--text);background:#F8F9FB;outline:none;transition:all .2s;font-family:inherit;}
.qa-input:focus{border-color:var(--accent);background:white;box-shadow:0 0 0 3px rgba(61,107,78,.1);}
.btn-qa{padding:9px 18px;background:var(--accent-grad);color:white;border:none;border-radius:var(--radius-sm);font-size:var(--fs-base);font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap;box-shadow:0 2px 6px rgba(61,107,78,.25);}
.btn-qa:hover{opacity:.9;box-shadow:0 4px 10px rgba(61,107,78,.35);}
.qa-preview{display:none;margin-top:var(--sp-3);padding:var(--sp-3);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);}
.qa-preview.show{display:flex;gap:var(--sp-3);align-items:flex-start;}
.qa-cover{width:88px;height:88px;flex-shrink:0;border-radius:var(--radius-sm);overflow:hidden;background:var(--ink-50);}
.qa-cover-img{width:100%;height:100%;object-fit:cover;display:block;}
.qa-cover-ph{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:linear-gradient(135deg,var(--ph-a,#3D6B4E),var(--ph-b,#1F3D2A));}
.qa-cover-ph svg{width:22px;height:22px;opacity:.85;}
.qa-cover-ph span{font-size:10px;color:rgba(255,255,255,.75);font-weight:500;letter-spacing:.3px;}
.qa-preview-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px;}
.qa-preview-source{font-size:var(--fs-xs);color:var(--text3);font-weight:500;}
.qa-title-edit{width:100%;border:none;border-bottom:1.5px solid var(--ink-100);outline:none;font-size:var(--fs-base);font-weight:600;color:var(--text);font-family:inherit;background:transparent;padding:0 0 4px;transition:border-color .18s;}
.qa-title-edit:focus{border-color:var(--accent);}
.qa-desc-preview{font-size:var(--fs-sm);color:var(--text2);line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.qa-tags-section{display:flex;align-items:center;gap:6px;border-top:1px solid var(--ink-100);padding-top:7px;margin-top:1px;}
.qa-tags-label{font-size:var(--fs-xs);color:var(--text2);font-weight:700;white-space:nowrap;flex-shrink:0;}
.qa-tags-chips{flex:1;min-height:28px;border:1px solid var(--ink-100);border-radius:var(--radius-sm);padding:3px 7px;background:var(--bg);cursor:text;transition:border-color .18s;}
.qa-tags-chips:focus-within{border-color:var(--accent);box-shadow:0 0 0 2px rgba(61,107,78,.08);}
.qa-preview-foot{display:flex;align-items:center;justify-content:space-between;margin-top:2px;}
.qa-preview-date{font-size:var(--fs-xs);color:var(--text3);}
.btn-qa-discard{background:none;border:1px solid var(--ink-100);border-radius:var(--radius-sm);padding:5px 12px;font-size:var(--fs-sm);color:var(--text2);cursor:pointer;font-family:inherit;transition:all .12s;margin-right:6px;}
.btn-qa-discard:hover{background:#F5F6F8;border-color:var(--ink-300);}
.btn-qa-save{background:var(--accent-grad);color:white;border:none;border-radius:var(--radius-sm);padding:5px 14px;font-size:var(--fs-sm);font-weight:600;cursor:pointer;font-family:inherit;transition:all .15s;box-shadow:0 2px 6px rgba(61,107,78,.25);}
.btn-qa-save:hover{opacity:.9;}
.btn-qa:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;}
.qa-fetching{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:var(--fs-sm);color:var(--text2);}
.qa-spinner{width:var(--sp-3);height:var(--sp-3);border:1.5px solid var(--ink-100);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0;}
@keyframes spin{to{transform:rotate(360deg);}}