/* E-Invoice Validator workspace: upload first, one access line, status only after a file is chosen. */

/* The workspace is always rendered; its children join main's flex flow so they can be ordered. */
main#main{display:flex!important;flex-direction:column}
#toolState,#toolState[hidden]{display:contents!important}
main#main>*{min-width:0}

/* Order: access line, heading, status notices, upload, fine print, example, history. */
main#main>.wt-access{order:0}
#toolState>.hero{order:1}
#gateState{order:4}
#toolState>.notice{order:2}
#toolState>#uploadCard,#toolState>#progressCard,#toolState>#resultCard{order:3}
#toolState>.guest-note{order:4}
/* (#gateState precedes #toolState in the DOM, so the status notice sits directly under the upload card.) */
#toolState>.wt-start-grid{order:5}
#toolState>.history-card{order:6}

/* Access line: one slim row. */
main#main>.wt-access{flex-direction:row!important;flex-wrap:wrap!important;align-items:center!important;margin:0 0 12px!important;padding:6px 14px!important;gap:2px 14px!important}
main#main>.wt-access .wt-access__copy{flex:1 1 auto}
main#main>.wt-access .wt-access__actions{justify-content:flex-start}

/* Heading: compact, no price box (the cost is shown in the confirmation step). */
body.wt-tool-page #toolState>.hero{display:block!important;margin:0 0 12px!important;padding:0 2px 4px!important;border:0!important}
body.wt-tool-page #toolState>.hero .quote-card{display:none!important}
body.wt-tool-page #toolState>.hero h1{max-width:900px!important}

/* Upload card: text above, drop zone full width. */
#uploadCard{grid-template-columns:1fr!important;gap:14px!important;padding:20px!important}
#uploadCard .eyebrow{display:none}
#uploadCard h2{margin:0 0 6px;font-size:1.2rem!important;line-height:1.25}
#uploadCard>div>p{margin:0;max-width:760px;color:#4f6076;font-size:.92rem;line-height:1.5}
#uploadCard form{gap:12px!important}
body.wt-tool-page #uploadCard .drop-zone{position:relative;min-height:150px!important;gap:6px;padding:20px 16px}
#uploadCard .drop-zone>span{display:block;width:40px;height:40px;border-radius:50%;background:#e1eefb;position:relative}
#uploadCard .drop-zone>span::before{content:"";position:absolute;left:50%;top:11px;width:12px;height:12px;border-left:2.5px solid #1d66b3;border-top:2.5px solid #1d66b3;transform:translateX(-50%) rotate(45deg)}
#uploadCard .drop-zone>span::after{content:"";position:absolute;left:50%;top:13px;width:2.5px;height:16px;margin-left:-1.25px;background:#1d66b3}
#uploadCard .drop-zone strong{font-size:1.05rem}
#uploadCard .drop-zone small{color:#4f6076;font-size:.86rem;line-height:1.4}
#uploadCard .drop-zone:focus-within{outline:3px solid #ffad28;outline-offset:3px}
#uploadCard .drop-zone:hover{border-color:#1d66b3!important;background:#eef5fd!important}
#uploadCard .selected-files>p{margin:0;color:#607087;font-size:.9rem}
#uploadCard .confirm-row{font-size:.92rem;line-height:1.45}

/* Guest note becomes fine print under the upload, not a second banner. */
#toolState>.guest-note{margin:10px 2px 0!important;padding:0!important;border:0!important;background:none!important;color:#4f6076;font-size:.82rem!important}

/* The upload control is already on screen: drop the duplicate "Use my source" chooser, keep the example. */
#toolState>.wt-start-grid{display:block!important;margin:22px 0 0!important}
#toolState>.wt-start-grid>.wt-start-card{display:none!important}

/* Status card: never in place of the tool. Shown only as an inline notice once a file is chosen. */
#gateState,#gateState:not([hidden]){display:none!important}
main#main:has(#invoiceFiles:valid)>#gateState:not([hidden]){display:block!important}
#gateState{max-width:none!important;margin:12px 0 0!important;padding:12px 16px!important;border:1px solid #f0c7c0!important;border-radius:12px!important;background:#fff4f2!important;box-shadow:none!important;color:#6d2016}
#gateState .gate-icon,#gateState .eyebrow,#gateState .gate-facts,#gateState .gate-standard-note,#gateState .gate-tool-finder-link{display:none!important}
#gateState>div{display:block!important}
#gateState h1{display:none!important}
#gateState .eyebrow+h1+p::before{content:"Upload not possible right now. ";font-weight:800}
#gateState p{margin:0!important;font-size:.9rem!important;line-height:1.45!important;color:#6d2016!important}
#gateState .gate-actions{display:flex!important;margin:6px 0 0!important;gap:14px}
#gateState .gate-actions .button{min-height:40px;padding:8px 12px;font-size:.88rem}
#gateState .gate-actions a:not(.button){color:#15588f}

@media (max-width:640px){
  #uploadCard{padding:16px!important}
  body.wt-tool-page #uploadCard .drop-zone{min-height:132px!important}
  #gateState .gate-actions{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){#uploadCard .drop-zone{transition:none}}

/* ws2: task first. The Pro offer appears only when it is relevant: after a result,
   or when the free jobs are used up / the job is above the free limit. */
main#main>.wt-access[data-state="free-ok"],
main#main>.wt-access[data-state="signed-out"]{display:none!important}
main#main:has(#resultCard:not([hidden]))>.wt-access[data-state="free-ok"],
main#main:has(#resultCard:not([hidden]))>.wt-access[data-state="signed-out"]{display:flex!important;order:4;margin:14px 0 0!important}

/* One quota line only (fine print under the button). Drop the repeats. */
.wt-context-status{display:none!important}
#toolState>.guest-note{display:none!important}

/* Disclaimer sits with the button as one compact line. */
#uploadCard .confirm-row{display:flex;align-items:flex-start;gap:10px;margin:0;font-size:.86rem!important;line-height:1.4;color:#4f6076}
#uploadCard .confirm-row input{flex:0 0 auto;width:20px;height:20px;margin:1px 0 0}
#uploadCard .selected-files:has(>p:only-child){display:none}
#uploadCard .ws-fineprint{margin:-2px 0 0;color:#4f6076;font-size:.82rem;line-height:1.45}
#uploadCard .ws-fineprint a{color:#15588f;text-decoration:underline;text-underline-offset:2px}
#uploadCard .ws-fineprint a:focus-visible{outline:3px solid #ffad28;outline-offset:2px;border-radius:2px}
@media (max-width:640px){
  #uploadCard>div>p{font-size:.88rem}
  body.wt-tool-page #uploadCard .drop-zone{min-height:118px!important;padding:16px 12px}
}