/* Shared language-converter components. See docs/LANGUAGE_CONVERTERS.md.
   lc-* classes are the public styling contract for existing and future tools. */
.lc-page{--lc-ink:#182b43;--lc-blue:#224d91;--lc-muted:#566273;--lc-line:#dddeda;--lc-paper:#fffefa;--lc-soft:#f3f6fb;--lc-radius:18px;color:var(--lc-ink)}
.lc-page [hidden]{display:none!important}
.lc-page .lc-main{max-width:none;margin:0;padding:24px 20px 40px}
.lc-page .words-directory-link{margin:18px 20px 0;font:14px/1.5 Arial,sans-serif}
.lc-page .breadcrumb{white-space:normal;flex-wrap:wrap;overflow-wrap:anywhere}
.lc-page .lc-panel{margin:0 0 24px;padding:30px;background:var(--lc-paper);border:1px solid var(--lc-line);border-radius:var(--lc-radius);box-shadow:none}
.lc-page .lc-panel .converter-head{display:block;margin:0 0 24px;padding:0}
.lc-page .lc-panel .eyebrow{margin:0 0 14px;font-size:12px;font-weight:700;line-height:1.5;letter-spacing:1px;text-transform:uppercase;color:var(--lc-blue)}
.lc-page .lc-panel h1{font-size:clamp(30px,4vw,44px);line-height:1.15;letter-spacing:-.035em;margin:0 0 18px;color:var(--lc-ink);overflow-wrap:anywhere}
.lc-page .lc-panel .converter-head p:not(.eyebrow),.lc-page .lc-panel>p:not(.eyebrow){font-size:16px;line-height:1.7;color:var(--lc-muted);margin:0 0 22px}
.lc-page .lc-form{margin:24px 0 0;padding:0}
.lc-page .lc-form label{font-size:15px;line-height:1.5;color:var(--lc-ink);font-weight:600}
.lc-page .lc-form .lc-input{display:block;width:100%;height:76px;min-height:76px;max-width:100%;margin:8px 0 0;padding:16px;font:400 30px/1.4 Arial,sans-serif;color:var(--lc-ink);background:#fff;border:1px solid #bcc6d1;border-radius:10px;box-shadow:none}
.lc-page .lc-form select{min-height:48px;padding:10px 12px;border:1px solid #bcc6d1;border-radius:8px;background:#fff;color:var(--lc-ink);font:400 16px/1.5 Arial,sans-serif}
.lc-page .lc-form .lc-submit{display:inline-flex;align-items:center;justify-content:center;min-height:48px;width:auto;margin:18px 0 0;padding:11px 18px;border:1px solid var(--lc-blue);border-radius:8px;background:var(--lc-blue);color:#fff;font:600 16px/1.4 Arial,sans-serif;cursor:pointer;box-shadow:none}
.lc-page .lc-options-row{display:flex;flex-direction:column;align-items:flex-start;gap:0;margin-top:18px}.lc-options-row>label{width:min(100%,420px)}.lc-options-row select{display:block;width:100%;margin-top:8px}
.lc-page .hindi-form-grid{display:block}
.lc-page :is(.number-input-hint,.es-help){font-size:13px;line-height:1.6;color:var(--lc-muted);font-weight:400;margin:8px 0 16px}
.lc-page :is(.english-examples,.arabic-examples,.es-examples){display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:18px 0}
.lc-page :is(.english-examples,.arabic-examples,.es-examples) :is(a,button){display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:8px 13px;background:var(--lc-soft);border:1px solid #dce2ed;border-radius:8px;color:var(--lc-blue);font:400 14px/1.5 Arial,sans-serif;text-decoration:none}
.lc-page :is(.es-options,.arabic-grammar-options,.english-other,.es-other,.arabic-context-converter){padding:16px;margin:18px 0;border:1px solid var(--lc-line);border-radius:12px;background:#faf9f5}
.lc-page :is(.es-options,.arabic-grammar-options,.english-other,.es-other,.arabic-context-converter)>summary{font:600 15px/1.6 Arial,sans-serif;min-height:24px;color:var(--lc-ink);cursor:pointer}
.lc-page :is(.result-panel,.es-answer,.arabic-result-card){padding:28px;border:1px solid var(--lc-line);border-top:4px solid var(--lc-blue);border-radius:14px;background:var(--lc-soft)}
.lc-page :is(a,button,input,select,summary):focus-visible{outline:3px solid #c49031;outline-offset:3px}
.lc-page .lc-form .lc-input:focus{border-color:var(--lc-blue);box-shadow:0 0 0 3px #224d911a}
@media(max-width:600px){.lc-page .lc-main{padding:20px 12px 30px}.lc-page .words-directory-link{margin:16px 12px 0}.lc-page .lc-panel{padding:18px}.lc-page .lc-form .lc-input{font-size:26px;height:68px;min-height:68px}.lc-page .lc-form .lc-submit{width:100%}.lc-page .lc-options-row>label{width:100%}.lc-page :is(.result-panel,.es-answer,.arabic-result-card){padding:18px}}
