/* ============================================================================
   Intake form (redesigned Add-task modal + public link form)
   ========================================================================== */
.modal--intake { width: 960px; max-width: 100%; }
.modal__sub { font-size: 12px; color: var(--text-3); margin-top: 3px; font-weight: 500; }
.modal__head > div { min-width: 0; }

.intake-sec { margin-bottom: 22px; }
.intake-sec__head { display: flex; align-items: center; gap: 9px; font-weight: 800; font-size: 15px; margin-bottom: 13px; }
.intake-sec__head small { font-weight: 500; color: var(--text-3); font-size: 12px; }
.stepno { width: 24px; height: 24px; border-radius: 50%; background: var(--accent); color: var(--accent-text); display: grid; place-items: center; font-size: 12px; font-weight: 800; flex: none; }
.field__label { font-size: 12px; font-weight: 600; color: var(--text-2); margin-bottom: 9px; }

/* icon tone chips (shared by type cards, pay cards, detail heads) */
.tone-green { color: var(--ok); background: color-mix(in srgb, var(--ok) 15%, transparent); }
.tone-amber { color: #d99a2b; background: color-mix(in srgb, #d99a2b 16%, transparent); }
.tone-blue { color: #181818; background: color-mix(in srgb, #181818 15%, transparent); }
.tone-red { color: var(--danger); background: color-mix(in srgb, var(--danger) 15%, transparent); }
.tone-violet { color: #ad9c82; background: color-mix(in srgb, #ad9c82 16%, transparent); }

/* type cards */
.typecards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.typecard { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 13px 14px; display: flex; align-items: center; gap: 10px; cursor: pointer; background: var(--surface); transition: border-color .12s, background .12s; }
.typecard:hover { border-color: var(--border-strong); }
.typecard.sel { border-color: var(--ok); background: color-mix(in srgb, var(--ok) 7%, var(--surface)); }
.typecard__radio { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--border-strong); flex: none; }
.typecard.sel .typecard__radio { border-color: var(--ok); background: radial-gradient(circle, var(--ok) 46%, transparent 48%); }
.typecard__ic { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; flex: none; }
.typecard__ic svg { width: 17px; height: 17px; }
.typecard__label { font-weight: 700; font-size: 13px; }
.typecard__custom { margin-left: auto; width: 118px; padding: 5px 8px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); color: var(--text); font-size: 12px; }
@media (max-width: 860px) { .typecards { grid-template-columns: 1fr 1fr; } }

/* detail accordion */
.detailwrap { display: flex; flex-direction: column; gap: 10px; }
.detailblock { border: 1px solid var(--border); border-radius: var(--radius-sm); overflow: hidden; }
.detailblock__head { display: flex; align-items: center; gap: 9px; padding: 11px 14px; font-weight: 700; font-size: 13px; cursor: pointer; background: var(--surface-2); }
.detailblock__head .typecard__ic { width: 26px; height: 26px; border-radius: 7px; }
.detailblock__head .typecard__ic svg { width: 14px; height: 14px; }
.detailblock__head::after { content: '⌄'; margin-left: auto; color: var(--text-3); font-size: 16px; }
.detailblock__body { display: none; padding: 14px; grid-template-columns: 1fr 1fr 1fr; gap: 13px; }
.detailblock.show { border-color: var(--accent); }
.detailblock.show .detailblock__body { display: grid; }
.detailblock.show .detailblock__head { background: color-mix(in srgb, var(--accent) 6%, var(--surface)); }
@media (max-width: 720px) { .detailblock__body { grid-template-columns: 1fr; } }

/* payment section */
.pay-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
.paycards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.paycard { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px; display: flex; align-items: center; gap: 10px; cursor: pointer; background: var(--surface); }
.paycard:hover { border-color: var(--border-strong); }
.paycard.sel { border-color: var(--ok); background: color-mix(in srgb, var(--ok) 7%, var(--surface)); }
.paycard[data-pay="urgent"].sel { border-color: var(--danger); background: color-mix(in srgb, var(--danger) 7%, var(--surface)); }
.paycard .typecard__radio { width: 16px; height: 16px; }
.paycard.sel .typecard__radio { border-color: var(--ok); background: radial-gradient(circle, var(--ok) 46%, transparent 48%); }
.paycard[data-pay="urgent"].sel .typecard__radio { border-color: var(--danger); background: radial-gradient(circle, var(--danger) 46%, transparent 48%); }
.paycard__txt b { display: block; font-size: 13px; font-weight: 700; }
.paycard__txt span { font-size: 11px; color: var(--text-3); }
.ik-urgent { background: color-mix(in srgb, var(--danger) 5%, transparent); border: 1px solid color-mix(in srgb, var(--danger) 28%, var(--border)); border-radius: var(--radius-sm); padding: 12px; }
@media (max-width: 820px) { .pay-row { grid-template-columns: 1fr; } .paycards { grid-template-columns: 1fr; } }

/* dropzone / uploads */
.dropzone { border: 1.5px dashed var(--border-strong); border-radius: var(--radius-sm); padding: 16px 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; cursor: pointer; color: var(--text-2); font-size: 12px; text-align: center; background: var(--surface-2); }
.dropzone:hover { border-color: var(--accent); color: var(--accent); }
.dropzone svg { width: 20px; height: 20px; }
.thumbs { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.thumbs img { width: 44px; height: 44px; object-fit: cover; border-radius: 6px; border: 1px solid var(--border); }
.thchip { font-size: 11px; background: var(--surface-3); padding: 3px 8px; border-radius: 5px; display: inline-flex; gap: 4px; align-items: center; }
.thchip svg { width: 12px; height: 12px; }

/* footer / public */
.btn--lg { padding: 11px 24px; font-size: 15px; }
.intake-foot { display: flex; justify-content: flex-end; margin-top: 10px; }
.public-card--wide { max-width: 940px; }