/* Document Translate - Design B; visual layer only, compatible with v1.6.0.1 */
:root{--bg:#111112;--card:#1b1c20;--line:#36373d;--text:#f5f5f7;--muted:#b5b5bf;--accent:#d36b1b;--sidebar:0px}
html{min-height:100%;background:#101011}
body{background:radial-gradient(ellipse 65% 35% at 53% 20%,#64311238,transparent 75%),#111112;color:#f5f4f7;font-family:Inter,'Segoe UI',Arial,sans-serif;font-size:15px;min-height:100vh}
button{font-weight:600;transition:background .16s,border-color .16s,transform .16s;cursor:pointer}
button:disabled{opacity:.5;cursor:not-allowed}
button:hover:not(:disabled){border-color:#e18b49}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.topbar{position:relative;z-index:2;min-height:65px;height:auto;margin:0;padding:0 34px;border-bottom:1px solid #303035;background:#19191bdc;backdrop-filter:blur(12px)}
.topbar-inner{max-width:1400px;margin:auto;width:100%;min-height:64px;display:flex;gap:22px;align-items:center;justify-content:space-between}
.topbar .brand{margin:0;display:flex;align-items:center;gap:4px;white-space:nowrap}
.topbar .brand strong{font-size:20px;letter-spacing:-.45px;font-weight:750}.brand-accent{color:#dc7731;padding-left:5px}
.admin-nav{margin:auto;display:flex;gap:7px;align-items:center;justify-content:center;flex-wrap:wrap}
.admin-nav button{border:1px solid #393a3f;background:#1d1e22;color:#ececf0;padding:11px 15px;font-size:13px;border-radius:10px}
.admin-nav button.selected{background:#d36b1b;color:#161515;border-color:#d36b1b;box-shadow:0 2px 15px #d36b1b40}
.topbar .row{align-items:center;gap:10px;margin:0;flex-wrap:nowrap}
.topbar button.secondary{padding:10px 16px;border-radius:10px;border:1px solid #45454c;background:#1c1d20;color:#f6f5f7;font-size:13px;white-space:nowrap}
#identity{display:none!important}
.workspace{max-width:1440px;margin:0 auto;padding:33px 34px 44px;min-width:0}
.page-heading{margin:0 0 12px;display:block}
.page-heading h1{font-size:clamp(30px,3.1vw,44px);font-weight:800;letter-spacing:-1.4px;line-height:1.2;margin:0;color:#f4f3f6}
.page-heading p,.page-heading .eyebrow,.page-tag{display:none!important}
.design-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;overflow:hidden;border:1px solid #37373f;border-radius:25px;margin-bottom:20px;background:linear-gradient(135deg,#232327,#1b1c21);box-shadow:0 18px 50px #c2692010}
.design-metrics article{display:flex;align-items:center;gap:22px;padding:21px 30px;min-height:124px}
.design-metrics article.highlight{background:linear-gradient(130deg,#df7b2b,#bb5716);color:#151515;border-radius:21px}
.design-metrics small{color:#d6d5de;font-size:15px;font-weight:550;display:block}
.design-metrics article.highlight small{color:#20150e;font-weight:700}
.design-metrics b{display:block;font-size:47px;line-height:1.1;color:#f8f7f9;margin-top:2px;letter-spacing:-1.4px;font-weight:800;letter-spacing:-1px}
.design-metrics article.highlight b{color:#171311}
.metric-icon{flex:none;display:grid;place-items:center;width:70px;height:70px;background:#323237;border-radius:50%;font-size:31px;color:#f3f3f6}
.highlight .metric-icon{color:#181818;background:#eb741a8a}
.workspace .card{background:linear-gradient(120deg,#1c1d21,#16181c);border:1px solid #37383e;border-radius:21px;box-shadow:0 16px 34px #0002;padding:23px 25px;margin-bottom:20px}
.workspace .upload-card{border-color:#724527;box-shadow:0 0 28px #b75a1e15,0 12px 38px #0003;padding:21px 24px}
.upload-heading{display:flex;align-items:flex-start;gap:15px;margin-bottom:17px}
.upload-icon{font-size:25px;line-height:1.2;color:#cf721e}
.upload-heading h2{margin:0;font-size:20px;font-weight:750;color:#f5f4f8}.upload-heading p{margin:2px 0 0;color:#c0bcc4;font-size:13px}
.design-upload{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(275px,1fr);gap:30px;align-items:stretch}
.upload-left{min-width:0;display:flex;flex-direction:column;gap:10px}
.upload-right{border-left:1px solid #33343b;padding-left:31px;display:flex;flex-direction:column;gap:13px;align-items:stretch;justify-content:flex-end}
.upload-right label{font-size:14px;font-weight:650;color:#e4e4e8}
.upload-right select{width:100%;height:54px;padding:10px 14px;margin-top:8px;border-radius:12px;background:#1f2025;color:#f8f8fa;border:1px solid #484953;font-size:14px}
.upload-right>button{background:#cf6c20;color:#16110e;font-size:19px;border:0;border-radius:14px;min-height:57px;box-shadow:0 10px 25px #a7501610}
.upload-right>button:hover:not(:disabled){background:#df812e}
.format-pills{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-start;margin-bottom:3px}
.format-pills span{font-size:12px;font-weight:750;padding:7px 16px;border-radius:9px;background:#432628;color:#f2c3c1}
.format-pills span:nth-child(2){background:#20334e;color:#b5d4ff}.format-pills span:nth-child(3){background:#483020;color:#ffd1aa}.format-pills span:nth-child(4){background:#1b3c33;color:#9de5cb}
.file-drop,#uploadForm .file-drop{grid-column:auto;min-height:144px;display:flex;flex-direction:column;gap:10px;border:1px dashed #555760;background:#1b1c1f;border-radius:15px;cursor:pointer;padding:22px}
.file-drop:hover,.file-drop.drag-over{background:#242020;border-color:#d37729}
.file-drop .file-icon{background:none;border:0;width:auto;height:auto;font-size:36px;line-height:1.1;color:#d4762b;letter-spacing:0}
.file-drop .file-copy{text-align:center}.file-drop .file-copy strong{font-size:15px;font-weight:600}.file-drop .file-copy small{font-size:12px;color:#9597a5}
.file-tokens{display:flex;flex-wrap:wrap;gap:8px;min-height:0}
.file-token{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;background:#282a31;border:1px solid #45464c;border-radius:11px;font-size:12px;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.file-token .file-extension{padding:4px 5px;border-radius:5px;background:#fc5c59;color:#fff;text-transform:uppercase;font-size:10px;font-weight:750}
.file-token.docx .file-extension{background:#397ce5}.file-token.pptx .file-extension{background:#e57830}.file-token.xlsx .file-extension{background:#31a373}
.upload-card .upload-details{margin-top:14px;border-top:0;padding-top:0}
.upload-card .upload-details summary{font-size:12px}
.upload-card .upload-details p{color:#b7b7bf}
#jobStatusFilter{display:none!important}
#refresh{display:none!important}
#documents .history-card{padding:22px 25px 16px;min-height:240px}
.history-card .sectionTitle{margin:0 0 15px;gap:14px}.history-card .sectionTitle h2{font-size:20px;font-weight:730}
.history-card .sectionTitle input{border:1px solid #494a54;border-radius:12px;color:#f0f0f4;background:#1b1d21;padding:11px 15px;width:290px;max-width:100%;font-size:14px}
#documents table{min-width:0;width:100%;font-size:14px}
#documents th{background:#25262c;color:#d7d6df;text-align:left;font-size:13px;font-weight:650;padding:14px 16px;border-top:1px solid #33353c;border-bottom:1px solid #34363e}
#documents td{padding:13px 16px;vertical-align:middle;border-bottom:1px solid #303139}
#documents td:first-child{min-width:0;max-width:460px;width:auto}
#documents td:nth-child(2),#documents td:nth-child(3){min-width:140px;width:22%}
#documents td:nth-child(4){min-width:145px;width:15%}
#documents .badge{border-radius:8px;font-size:12px;padding:6px 10px;font-weight:650}
#documents .badge.completed{background:#174537;color:#73dba7;border-color:#174537}
#documents .badge.processing,#documents .badge.queued,#documents .badge.browser_processing,#documents .badge.browser_uploading{background:#55371d;color:#ffac55;border-color:#55371d}
.file-cell{display:flex;align-items:center;gap:12px;min-width:0}
.file-kind{display:inline-flex;align-items:center;justify-content:center;background:#f35657;color:#fff;border-radius:6px;width:30px;height:34px;font-size:9px;flex:none;font-weight:750;text-transform:uppercase}
.file-kind.docx{background:#337cdb}.file-kind.pptx{background:#ef843a}.file-kind.xlsx{background:#2ca077}.file-kind.txt{background:#6d7480}
.file-cell .name{max-width:390px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#documents td small{color:#aeb1be;font-size:11px;margin-top:1px;line-height:1.5}
#documents td a button,#documents td button{margin:0;border:1px solid #484955;border-radius:10px;padding:8px 12px;background:#282a31;color:#f0f0f4;font-size:12px;white-space:nowrap}
#documents td .primary-download{color:#f6f6f7}
.job-actions{display:flex;gap:8px;align-items:center;justify-content:flex-start}
.job-actions summary{cursor:pointer;display:grid;place-items:center;width:32px;height:32px;list-style:none;border-radius:8px;color:#c0c1cb;font-size:21px}
.job-actions details{position:relative}.job-actions details summary::-webkit-details-marker{display:none}
.job-actions .more-menu{position:absolute;right:0;top:33px;z-index:5;width:max-content;min-width:154px;background:#292a30;border:1px solid #4c4c56;border-radius:11px;box-shadow:0 14px 30px #0009;padding:8px;display:flex;flex-direction:column;gap:6px}
.job-actions .more-menu button{width:100%;text-align:left;white-space:nowrap}
.job-actions .more-menu .danger-button{color:#f4b0a7}
.processing-track{width:140px;max-width:100%;height:6px;border-radius:99px;background:#34363b;margin-top:5px;overflow:hidden}
.processing-track span{display:block;width:40%;height:100%;border-radius:99px;background:#d16e1b;animation:loadingIndeterminate 1.7s ease-in-out infinite alternate}
@keyframes loadingIndeterminate{from{transform:translateX(-60%)}to{transform:translateX(230%)}}
.history-footer{border-top:1px solid #33343a;padding:14px 2px 2px;margin-top:12px;display:flex;align-items:center;justify-content:space-between;gap:15px}
#jobTableHelp{font-size:12px;color:#b5b5be;border:0;margin:0;padding:0}
.history-pagination{display:flex;align-items:center;gap:11px;color:#edeef1;font-size:13px}
.history-pagination button{min-height:32px;min-width:32px;border:1px solid #42434a;border-radius:10px;background:#25272c;padding:6px 10px;color:#eee}
.history-pagination button:disabled{opacity:.35}
/* Admin pages retain existing CRUD components, with the new surface style. */
#members h2,#accounts h2,#browserAccounts h2{font-size:20px;margin-bottom:15px}
#members .card,#accounts .card,#browserAccounts .card{border-radius:17px}
#members .gridForm,#accounts .gridForm,#browserAccounts .gridForm{gap:15px}
#members table,#accounts table,#browserAccounts table{font-size:14px}
#members th,#accounts th,#browserAccounts th{background:#292b30}
#members td,#accounts td,#browserAccounts td{padding:15px 12px}
#members td button,#accounts td button,#browserAccounts td button{white-space:nowrap}
#toast{left:50%;background:#2d2d31;border-color:#d16e1b}
.login{max-width:440px;background:#1c1e21;border-color:#414247}
.login .brand{justify-content:center}
@media(max-width:1100px){.topbar{padding:0 20px}.topbar-inner{gap:10px}.admin-nav button{padding:9px;font-size:12px}.workspace{padding:26px 20px}.design-metrics article{padding:20px 16px;gap:12px}.metric-icon{width:55px;height:55px;font-size:25px}.design-metrics b{font-size:38px}.design-upload{grid-template-columns:minmax(0,1.6fr) minmax(255px,1fr);gap:18px}.upload-right{padding-left:18px}}
@media(max-width:780px){.topbar-inner{flex-wrap:wrap;justify-content:space-between;padding:10px 0}.admin-nav{order:3;width:100%;margin:0;justify-content:flex-start}.workspace{padding:22px 14px}.design-metrics article{min-height:110px}.design-metrics small{font-size:12px}.design-metrics b{font-size:30px}.metric-icon{width:44px;height:44px;font-size:21px}.design-upload{grid-template-columns:1fr}.upload-right{border-left:0;border-top:1px solid #37383e;padding:15px 0 0}.upload-right>button{min-height:49px}.page-heading h1{font-size:31px}.workspace .card{padding:18px}.history-footer{flex-wrap:wrap}}
@media(max-width:560px){.topbar{padding:0 13px}.topbar .brand strong{font-size:17px}.topbar .row{gap:5px}.topbar button.secondary{padding:8px 9px;font-size:11px}.admin-nav{gap:5px}.admin-nav button{font-size:11px;padding:8px}.design-metrics{grid-template-columns:1fr;border-radius:18px}.design-metrics article{min-height:78px;padding:11px 18px}.design-metrics article.highlight{border-radius:13px}.design-metrics b{font-size:31px}.design-metrics small{font-size:13px}.metric-icon{width:48px;height:48px;font-size:25px}.history-card .sectionTitle input{width:100%;max-width:none}.history-card .sectionTitle h2{flex-basis:100%}#documents th,#documents td{padding:10px 8px}.file-cell .name{max-width:160px}#documents table{min-width:610px}.history-footer{flex-direction:column;align-items:flex-start}.page-heading h1{letter-spacing:-.6px}}

/* V1.7.1: Constrain the transparent file input to the actual drop area.
   The inherited .file-drop input rule uses position:absolute/inset:0, so
   the enclosing label MUST establish its own containing block. */
#uploadForm #fileDrop{position:relative;isolation:isolate}
#uploadForm #fileDrop > #documentFile{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:100%;opacity:0;cursor:pointer}

/* v1.7.2: format labels + always-visible document limits */
.format-pills{gap:7px}
.format-pills span{padding:7px 11px;font-size:11px;white-space:nowrap}
.format-pills span:nth-child(5){background:#363b49;color:#ced6ee}
.format-pills span:nth-child(6){background:#40304b;color:#e9caff}
.upload-card .upload-limits{margin:13px 0 0;line-height:1.6;font-size:12px;color:#bcbcc5;overflow-wrap:anywhere}
.upload-card .upload-limits strong{color:#e6e5e9;font-weight:650}
.upload-card .upload-limits .limits-sep{color:#797982;padding:0 4px}
.file-token.txt .file-extension,.file-kind.txt{background:#61677c}
.file-token.html .file-extension,.file-kind.html{background:#79599d}
@media(max-width:780px){.upload-card .upload-limits{font-size:12px}.format-pills{gap:6px}}

/* v1.7.3: Errors are visible in the history, not hidden behind a generic badge. */
#documents .job-error-detail{display:flex;align-items:flex-start;gap:9px;margin-top:8px;padding:9px 10px;line-height:1.5;border:1px solid #76483d;border-radius:9px;background:#342320;color:#f7beb0;white-space:normal;overflow-wrap:anywhere;font-size:12px;max-width:360px}
#documents .job-error-detail>span{flex:none;display:grid;place-items:center;font-weight:800;width:17px;height:17px;border-radius:50%;background:#803c32;color:#ffe9e4;font-size:11px}
#documents .job-error-detail>div{min-width:0}
#documents .badge.browser_review,#documents .badge.review,#documents .badge.uncertain,#documents .badge.failed{color:#ffb4a3;background:#3a2427;border:1px solid #714248}

/* v1.7.4: clear, single-line same-language errors. */
#documents .same-language-error{display:flex;align-items:center;gap:7px;color:#ffb6a8;font-size:12px;font-weight:600;line-height:1.45;max-width:100%;white-space:normal}
#documents .same-language-error>span:first-child{display:inline-grid;place-items:center;flex:none;width:17px;height:17px;border-radius:50%;background:#74362f;color:#ffddd6;font-weight:800;font-size:11px}

/* v1.7.5 - Inline icon actions replace the overflow menu. */
.job-actions{display:flex;align-items:center;justify-content:flex-start;gap:6px;flex-wrap:nowrap;white-space:nowrap}
#documents td .job-icon{
 box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;
 width:34px;height:34px;min-width:34px;padding:0;margin:0;
 border:1px solid #484a51;border-radius:9px;background:#282a31;
 color:#e9e9ee;text-decoration:none;cursor:pointer;line-height:1;
 transition:background .13s ease,border-color .13s ease,color .13s ease;
}
#documents td .job-icon svg{display:block;flex:none;pointer-events:none}
#documents td .job-icon:hover{background:#34363d;border-color:#747781;color:#fff}
#documents td .job-icon:focus-visible{outline:2px solid #d87532;outline-offset:2px}
#documents td .job-icon:disabled{cursor:wait;opacity:.4}
#documents td .job-icon-delete{color:#f4a9a2}
#documents td .job-icon-delete:hover{color:#ffd2ce;background:#47292a;border-color:#98605c}
#documents td .job-icon-reconcile{color:#e7bd8d}
#documents td .job-icon-reconcile:hover{color:#ffdbad;background:#403125;border-color:#8c6749}
#documents td .job-icon-start{color:#9bd7b4}
#documents td .job-icon-start:hover{color:#c6f5d9;background:#203c30;border-color:#4b8767}
.job-action-empty{display:inline-block;color:#777986;padding:0 9px}
@media(max-width:560px){#documents td:nth-child(4){min-width:145px}}


/* v1.7.6 - compact centered format tags, safe deletion confirmation, admin editable text. */
.upload-right .format-pills{display:flex;width:100%;justify-content:center;align-items:center;flex-wrap:wrap;gap:5px}
.upload-right .format-pills span{padding:6px 7px;font-size:10px}
.upload-card .upload-limits-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:13px}
.upload-card .upload-limits-row .upload-limits{margin:0;flex:1 1 400px;min-width:0;white-space:pre-wrap}
.upload-card .upload-limits-edit{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:none;min-height:32px;padding:6px 12px;border:1px solid #51545d;border-radius:9px;background:#272930;color:#e7e9ef;font-size:12px;cursor:pointer}
.upload-card .upload-limits-edit:hover{background:#333641;border-color:#8b8e97}
.upload-card .upload-limits-edit[hidden]{display:none!important}
#deleteConfirmDialog,#limitsEditDialog{box-sizing:border-box;width:min(470px,calc(100vw - 32px));max-width:100%;border:1px solid #505b6b;border-radius:15px;padding:24px;background:#1e2430;color:#f0f1f5;box-shadow:0 20px 65px #000a}
#deleteConfirmDialog::backdrop,#limitsEditDialog::backdrop{background:rgba(0,0,0,.68)}
#deleteConfirmDialog h2,#limitsEditDialog h2{margin:0 0 18px;font-size:18px;font-weight:700}
#deleteConfirmDialog p,#limitsEditDialog p{font-size:13px;line-height:1.65;color:#c1c3cc;margin:0 0 24px}
#limitsEditDialog form{display:flex;flex-direction:column}
#limitsEditDialog label{font-size:13px;font-weight:600;margin:0 0 9px}
#limitsEditDialog textarea{box-sizing:border-box;display:block;width:100%;min-height:110px;resize:vertical;border:1px solid #626777;background:#16181f;color:#f1f2f6;font:inherit;font-size:14px;line-height:1.5;padding:12px;border-radius:10px}
#limitsEditDialog textarea:focus-visible{outline:2px solid #bd6828;outline-offset:2px}
#deleteConfirmDialog .dialog-footer,#limitsEditDialog .dialog-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:26px}
#deleteConfirmDialog .dialog-footer button,#limitsEditDialog .dialog-footer button{min-height:41px;padding:8px 18px;border-radius:9px;cursor:pointer}
#deleteConfirmDialog .danger-action{background:#a9443d;color:#fff;border:1px solid #a9443d}
#deleteConfirmDialog .danger-action:hover{background:#bf5048}
@media(max-width:560px){.upload-card .upload-limits-row{align-items:flex-start}.upload-card .upload-limits-row .upload-limits{flex-basis:100%}}

/* v1.7.7 - Extended target languages, spaced dropdown arrow, rich notice editor */
#target{appearance:none;-webkit-appearance:none;padding-right:48px!important;background-color:#1f2025;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6' fill='none' stroke='%23d5d2da' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 18px center;background-repeat:no-repeat;background-size:16px 16px}
.format-toolbar{display:flex;gap:6px;margin:12px 0 0}
.format-toolbar button{min-width:39px;height:36px;padding:6px 10px;border:1px solid #484954;background:#292b33;color:#f0f0f4;border-radius:8px;display:grid;place-items:center}
.format-toolbar button:hover{background:#353844;border-color:#c27735}
.rich-notice-editor{border:1px solid #555762;border-radius:11px;background:#131417;color:#fff;padding:12px 14px;min-height:95px;max-height:240px;overflow:auto;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px}
.rich-notice-editor:focus{outline:2px solid #bf711f;outline-offset:1px}
.upload-limits u{text-underline-offset:2px}
