/* OEP CRM — public form + wizard. Theming via CSS vars:
   --oep-bg (card background), --oep-accent (buttons/focus). */
.oep-form,.oep-wizard{
	--oep-bg:#ffffff;
	--oep-accent:#2b5cff;
	--oep-text:#1f2533;
	--oep-muted:#5a6172;
	--oep-border:#e3e6ee;
	--oep-field-bg:#ffffff;
	font-family:inherit;
	box-sizing:border-box;
}
.oep-form *,.oep-wizard *{box-sizing:border-box}

/* Dark theme (for placing on a dark section) */
.oep-theme-dark{
	--oep-text:#f2f5ff;
	--oep-muted:#aab4d4;
	--oep-border:rgba(255,255,255,.18);
	--oep-field-bg:rgba(255,255,255,.06);
	--oep-bg:#1b2350;
}

/* ---- Base form card ---- */
.oep-form{
	max-width:680px;background:var(--oep-bg);border-radius:16px;padding:28px;
	box-shadow:0 10px 40px rgba(20,30,80,.08);
}
.oep-bg-transparent{background:transparent !important;box-shadow:none !important;padding:0 !important}
.oep-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px}
.oep-layout-1col .oep-form-grid{grid-template-columns:1fr}
.oep-layout-1col .oep-col-half{grid-column:1/-1}
.oep-col-full,.oep-field.oep-col-full{grid-column:1/-1}
.oep-field{display:flex;flex-direction:column;gap:6px}
.oep-field label{font-size:13px;font-weight:600;color:var(--oep-label,var(--oep-muted))}
.oep-req{color:#e5484d}
.oep-form input[type=text],.oep-form input[type=email],.oep-form input[type=tel],
.oep-form input[type=number],.oep-form input[type=date],.oep-form select,.oep-form textarea,
.oep-form input[type=file],
.oep-wizard input[type=text],.oep-wizard input[type=email],.oep-wizard input[type=tel],
.oep-wizard input[type=number],.oep-wizard input[type=date],.oep-wizard select,.oep-wizard textarea{
	width:100%;padding:12px 14px;border:1px solid var(--oep-border);border-radius:10px;
	font-size:14px;color:var(--oep-text);background:var(--oep-field-bg)}
.oep-form select,.oep-wizard select{appearance:none;-webkit-appearance:none;
	background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23888' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat:no-repeat;background-position:right 14px center;padding-right:34px}
.oep-form input:focus,.oep-form select:focus,.oep-form textarea:focus,
.oep-wizard input:focus,.oep-wizard select:focus,.oep-wizard textarea:focus{
	outline:none;border-color:var(--oep-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--oep-accent) 22%,transparent)}
.oep-form ::placeholder,.oep-wizard ::placeholder{color:var(--oep-muted);opacity:.8}
/* Native dropdown options render on the browser's white panel — keep them dark
   text on white even when the field itself uses the dark (white-text) theme. */
.oep-form select option,.oep-wizard select option{color:#1f2533;background:#ffffff}
.oep-form input[type=time],.oep-wizard input[type=time]{width:100%;padding:12px 14px;border:1px solid var(--oep-border);border-radius:10px;font-size:14px;color:var(--oep-text);background:var(--oep-field-bg)}
.oep-form input[type=time]:focus,.oep-wizard input[type=time]:focus{outline:none;border-color:var(--oep-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--oep-accent) 22%,transparent)}

/* Input height presets (proper fitting) */
.oep-size-normal input[type=text],.oep-size-normal input[type=email],.oep-size-normal input[type=tel],
.oep-size-normal input[type=number],.oep-size-normal input[type=date],.oep-size-normal select,.oep-size-normal textarea{
	padding:10px 13px;font-size:14px}
.oep-size-compact input[type=text],.oep-size-compact input[type=email],.oep-size-compact input[type=tel],
.oep-size-compact input[type=number],.oep-size-compact input[type=date],.oep-size-compact select,.oep-size-compact textarea{
	padding:7px 11px;font-size:13px;border-radius:8px}
.oep-size-comfortable input[type=text],.oep-size-comfortable input[type=email],.oep-size-comfortable input[type=tel],
.oep-size-comfortable input[type=number],.oep-size-comfortable input[type=date],.oep-size-comfortable select,.oep-size-comfortable textarea{
	padding:15px 16px;font-size:15px}
/* Inside labels → tighter rows since there's no label line */
.oep-labels-inside .oep-form-grid{gap:12px 16px}
.oep-size-compact .oep-form-grid{gap:12px 14px}
.oep-field-heading{grid-column:1/-1}
.oep-field-heading h3{margin:2px 0 6px;font-size:20px;font-weight:700;color:var(--oep-title,var(--oep-text))}
.oep-options{display:flex;flex-wrap:wrap;gap:12px}
.oep-opt{font-weight:500;display:flex;align-items:center;gap:6px;color:var(--oep-text)}
.oep-form-actions{margin-top:22px}
.oep-form-submit{
	width:100%;padding:15px;border:0;border-radius:10px;background:var(--oep-accent);color:#fff;
	font-size:15px;font-weight:700;letter-spacing:.04em;cursor:pointer;transition:filter .15s}
.oep-form-submit:hover{filter:brightness(.93)}
.oep-form-submit[disabled]{opacity:.6;cursor:wait}
.oep-form-message{margin-top:14px;text-align:center;font-size:14px}
.oep-form-message.ok{color:#1a7f37}
.oep-form-message.err{color:#e5484d}

/* ---- AI result ---- */
.oep-ai-result{margin-top:18px;border-top:1px solid var(--oep-border);padding-top:18px;color:var(--oep-text)}
.oep-ai-score{font-size:15px;font-weight:600;margin-bottom:8px}
.oep-ai-score span{font-size:26px;font-weight:800;margin-right:6px}
.oep-ai-score.good span{color:var(--oep-result,#1a7f37)}
.oep-ai-score.low span{color:var(--oep-result,#a36500)}
.oep-ai-summary{line-height:1.55}
.oep-ai-result h4{margin:14px 0 6px;font-size:14px;color:var(--oep-result,var(--oep-title,var(--oep-text)))}
.oep-ai-unis,.oep-ai-steps{margin:0;padding-left:18px;line-height:1.6}
.oep-ai-note{color:var(--oep-muted);font-size:13px}
.oep-ai-actions{margin-top:16px}
.oep-result-download{background:var(--oep-accent);color:#fff;border:0;border-radius:10px;padding:11px 18px;font-weight:700;font-size:14px;cursor:pointer}
.oep-result-download:hover{filter:brightness(.93)}

/* After-submit actions (next step + reset) */
.oep-form-after{margin-top:18px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.oep-next-btn{display:inline-block;padding:12px 20px;border-radius:10px;background:#1a9c4a;color:#fff;
	font-weight:700;text-decoration:none;font-size:14px}
.oep-next-btn:hover{filter:brightness(.93);color:#fff}
.oep-reset-btn{padding:11px 18px;border:1px solid var(--oep-border);border-radius:10px;background:transparent;
	color:var(--oep-text);font-weight:600;font-size:14px;cursor:pointer}
.oep-reset-btn:hover{border-color:var(--oep-accent);color:var(--oep-accent)}

/* ---- Wizard ---- */
.oep-wizard{max-width:760px;margin:0 auto}
.oep-steps{display:flex;gap:10px;list-style:none;padding:0;margin:0 0 18px}
.oep-steps li{flex:1;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;
	color:var(--oep-muted);padding:10px 14px;border-radius:10px;background:color-mix(in srgb,var(--oep-accent) 8%,transparent)}
.oep-steps li span{display:inline-flex;width:24px;height:24px;border-radius:50%;background:#cfd6e4;
	color:#fff;align-items:center;justify-content:center;font-size:13px}
.oep-steps li.is-active{color:var(--oep-text);background:color-mix(in srgb,var(--oep-accent) 16%,transparent)}
.oep-steps li.is-active span{background:var(--oep-accent)}
.oep-step{display:none;background:var(--oep-bg);border-radius:16px;padding:28px;
	box-shadow:0 10px 40px rgba(20,30,80,.08)}
.oep-bg-transparent .oep-step{background:transparent;box-shadow:none;padding:0}
.oep-step.is-active{display:block}
.oep-card-title{margin:0 0 14px;font-size:22px;font-weight:700;color:var(--oep-title,var(--oep-text))}
.oep-form-hint{margin-top:12px;text-align:center;color:#1a7f37;font-size:13px}
.oep-ai-holder{margin-top:18px}
/* AI processing loader */
.oep-ai-loader{display:flex;flex-direction:column;align-items:center;gap:12px;padding:26px 0;color:var(--oep-text)}
.oep-ai-loader p{margin:0;font-weight:600;font-size:14px}
.oep-spinner{width:38px;height:38px;border-radius:50%;border:4px solid color-mix(in srgb,var(--oep-accent) 25%,transparent);border-top-color:var(--oep-accent);animation:oep-spin .8s linear infinite}
@keyframes oep-spin{to{transform:rotate(360deg)}}

/* ---- Document tiles ---- */
.oep-doc-intro{color:var(--oep-muted);margin:0 0 18px}
.oep-doc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.oep-layout-1col .oep-doc-grid{grid-template-columns:1fr}
.oep-doc-tile{border:1px solid var(--oep-border);border-radius:12px;padding:16px 12px;text-align:center;
	transition:border-color .15s,background .15s}
.oep-doc-tile.is-done{border-color:#1a7f37;background:rgba(26,127,55,.06)}
.oep-doc-tile.is-error{border-color:#e5484d;background:rgba(229,72,77,.06)}
.oep-doc-tile.is-uploading{opacity:.7}
.oep-doc-name{font-size:13px;font-weight:600;color:var(--oep-text);min-height:32px}
.oep-doc-icon{font-size:22px;color:var(--oep-accent);margin:6px 0}
.oep-doc-link{color:var(--oep-accent);font-weight:600;font-size:13px;cursor:pointer}
.oep-doc-tile.is-done .oep-doc-link{color:#1a7f37}
.oep-doc-status{font-size:11px;color:var(--oep-muted);margin-top:6px;word-break:break-word;min-height:14px}
.oep-doc-finalize{width:100%;margin-top:20px;padding:15px;border:0;border-radius:10px;background:#1a9c4a;
	color:#fff;font-size:15px;font-weight:700;letter-spacing:.04em;cursor:pointer}
.oep-doc-finalize:hover{filter:brightness(.93)}
.oep-doc-finalize[disabled]{opacity:.6;cursor:default}

@media(max-width:560px){
	.oep-form-grid{grid-template-columns:1fr}
	.oep-col-half{grid-column:1/-1}
	.oep-doc-grid{grid-template-columns:1fr 1fr}
}