/* JDT Builds component styles. Classes are the styling surface for the React
   primitives in components/**; every value comes from a token. */

/* ---------- Button ---------- */
.jdt-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);font-family:var(--font-body);font-weight:var(--fw-semibold);letter-spacing:var(--ls-label);text-transform:uppercase;border:var(--border-1) solid transparent;border-radius:var(--radius-md);cursor:pointer;text-decoration:none;transition:var(--transition-control),transform var(--dur-fast) var(--ease-out);min-height:var(--tap-min)}
.jdt-btn:active:not(:disabled){transform:scale(var(--press-scale))}
.jdt-btn:disabled,.jdt-btn[aria-disabled=true]{opacity:.45;cursor:not-allowed}
.jdt-btn--sm{font-size:var(--fs-micro);padding:0 var(--space-4);min-height:36px}
.jdt-btn--md{font-size:var(--fs-caption);padding:0 var(--space-5)}
.jdt-btn--lg{font-size:var(--fs-body-sm);padding:0 var(--space-8);min-height:54px}
.jdt-btn--block{display:flex;width:100%}
.jdt-btn--primary{background:var(--surface-brand);color:var(--text-inverse);box-shadow:var(--shadow-inset-top)}
.jdt-btn--primary:hover:not(:disabled){background:var(--teal-800)}
.jdt-btn--accent{background:var(--surface-cta);color:var(--text-on-cta)}
.jdt-btn--accent:hover:not(:disabled){background:var(--teal-450)}
.jdt-btn--secondary{background:transparent;color:var(--text-strong);border-color:var(--border-strong)}
.jdt-btn--secondary:hover:not(:disabled){background:var(--grey-900);color:var(--text-inverse)}
.jdt-btn--ghost{background:transparent;color:var(--text-link);border-color:transparent}
.jdt-btn--ghost:hover:not(:disabled){background:var(--teal-050)}
.jdt-btn--inverse{background:var(--white);color:var(--grey-900)}
.jdt-btn--inverse:hover:not(:disabled){background:var(--grey-200)}
.jdt-btn:focus-visible{box-shadow:var(--ring-focus)}

/* ---------- IconButton ---------- */
.jdt-iconbtn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);border:var(--border-1) solid var(--border-default);background:var(--surface-card);color:var(--text-strong);cursor:pointer;transition:var(--transition-control)}
.jdt-iconbtn--sm{width:36px;height:36px}
.jdt-iconbtn:hover:not(:disabled){border-color:var(--border-strong);background:var(--grey-150)}
.jdt-iconbtn--bare{border-color:transparent;background:transparent}
.jdt-iconbtn--inverse{border-color:var(--border-inverse);background:transparent;color:var(--text-inverse)}
.jdt-iconbtn--inverse:hover:not(:disabled){background:rgba(255,255,255,.1)}

/* ---------- Badge / Tag ---------- */
.jdt-badge{display:inline-flex;align-items:center;gap:var(--space-1);font:var(--type-eyebrow);letter-spacing:var(--ls-label);text-transform:uppercase;padding:4px var(--space-2);border-radius:var(--radius-sm)}
.jdt-badge--neutral{background:var(--grey-200);color:var(--grey-700)}
.jdt-badge--brand{background:var(--teal-100);color:var(--teal-800)}
.jdt-badge--accent{background:var(--surface-accent);color:var(--text-on-accent)}
.jdt-badge--success{background:var(--status-success-bg);color:var(--status-success-fg)}
.jdt-badge--warning{background:var(--status-warning-bg);color:var(--status-warning-fg)}
.jdt-badge--danger{background:var(--status-danger-bg);color:var(--status-danger-fg)}
.jdt-badge--info{background:var(--status-info-bg);color:var(--status-info-fg)}
.jdt-tag{display:inline-flex;align-items:center;gap:var(--space-2);font:var(--type-body-sm);font-weight:var(--fw-medium);color:var(--text-body);background:var(--surface-card);border:var(--border-1) solid var(--border-default);border-radius:var(--radius-pill);padding:6px var(--space-4);transition:var(--transition-control)}
a.jdt-tag,button.jdt-tag{cursor:pointer;text-decoration:none}
a.jdt-tag:hover,button.jdt-tag:hover{border-color:var(--border-brand);color:var(--teal-800);background:var(--teal-050)}
.jdt-tag--selected{background:var(--grey-900);border-color:var(--grey-900);color:var(--text-inverse)}
.jdt-tag__remove{display:inline-flex;border:0;background:none;padding:0;cursor:pointer;color:inherit;opacity:.6}
.jdt-tag__remove:hover{opacity:1}

/* ---------- Card ---------- */
.jdt-card{background:var(--surface-card);border:var(--border-1) solid var(--border-subtle);border-radius:var(--radius-md);transition:var(--transition-surface),border-color var(--dur-base) var(--ease-out)}
.jdt-card--flat{box-shadow:var(--shadow-none)}
.jdt-card--raised{box-shadow:var(--shadow-sm)}
.jdt-card--inverse{background:var(--surface-inverse-2);border-color:var(--border-inverse);color:var(--grey-300)}
.jdt-card--interactive{cursor:pointer;text-decoration:none;display:block}
.jdt-card--interactive:hover{border-color:var(--border-strong);box-shadow:var(--shadow-md);transform:translateY(-2px)}
.jdt-card--interactive:active{transform:translateY(0)}

/* ---------- SectionHeading ---------- */
.jdt-sect{display:flex;flex-direction:column;gap:var(--space-3);max-width:var(--container-narrow)}
.jdt-sect--center{align-items:center;text-align:center;margin:0 auto}
.jdt-sect__rule{width:56px;height:var(--rule-heavy);background:var(--surface-accent)}
.jdt-sect__title{font:var(--type-h2);letter-spacing:var(--ls-display);text-transform:uppercase;color:var(--text-strong)}
.jdt-sect__lead{font:var(--type-body-lg);color:var(--text-body)}
.jdt-sect--inverse .jdt-sect__title{color:var(--text-inverse)}
.jdt-sect--inverse .jdt-sect__lead{color:var(--grey-300)}

/* ---------- Fields ---------- */
.jdt-field{display:flex;flex-direction:column;gap:var(--space-2)}
.jdt-field__label{font:var(--type-label);text-transform:uppercase;letter-spacing:var(--ls-label);color:var(--text-strong)}
.jdt-field__req{color:var(--status-danger-fg);margin-left:2px}
.jdt-field__hint{font:var(--type-body-sm);color:var(--text-muted)}
.jdt-field__error{font:var(--type-body-sm);font-weight:var(--fw-medium);color:var(--status-danger-fg)}
.jdt-input,.jdt-textarea,.jdt-select{font:var(--type-body);color:var(--text-strong);background:var(--surface-card);border:var(--border-1) solid var(--border-default);border-radius:var(--radius-md);padding:0 var(--space-4);height:var(--tap-min);width:100%;transition:var(--transition-control)}
.jdt-textarea{height:auto;padding:var(--space-3) var(--space-4);min-height:120px;resize:vertical;line-height:var(--lh-body)}
.jdt-select{appearance:none;padding-right:var(--space-10);background-image:linear-gradient(45deg,transparent 50%,var(--grey-600) 50%),linear-gradient(135deg,var(--grey-600) 50%,transparent 50%);background-position:calc(100% - 22px) 20px,calc(100% - 16px) 20px;background-size:6px 6px,6px 6px;background-repeat:no-repeat}
.jdt-input::placeholder,.jdt-textarea::placeholder{color:var(--grey-400)}
.jdt-input:hover,.jdt-textarea:hover,.jdt-select:hover{border-color:var(--grey-400)}
.jdt-input:focus,.jdt-textarea:focus,.jdt-select:focus{outline:none;border-color:var(--border-brand);box-shadow:var(--ring-focus)}
.jdt-input--error,.jdt-textarea--error,.jdt-select--error{border-color:var(--status-danger-fg)}
.jdt-input:disabled,.jdt-textarea:disabled,.jdt-select:disabled{background:var(--grey-150);color:var(--text-muted);cursor:not-allowed}
.jdt-input-wrap{position:relative;display:flex;align-items:center}
.jdt-input-wrap__icon{position:absolute;left:var(--space-4);display:flex;color:var(--grey-500);pointer-events:none}
.jdt-input-wrap__icon+.jdt-input{padding-left:var(--space-12)}

/* ---------- Choice controls ---------- */
.jdt-choice{display:flex;gap:var(--space-3);align-items:flex-start;cursor:pointer;min-height:var(--tap-min);padding:var(--space-2) 0}
.jdt-choice__box{flex:none;width:22px;height:22px;margin-top:1px;border:var(--border-2) solid var(--border-default);background:var(--surface-card);display:flex;align-items:center;justify-content:center;transition:var(--transition-control)}
.jdt-choice__box--check{border-radius:var(--radius-sm)}
.jdt-choice__box--radio{border-radius:var(--radius-pill)}
.jdt-choice:hover .jdt-choice__box{border-color:var(--grey-900)}
.jdt-choice__box[data-on=true]{background:var(--surface-brand);border-color:var(--surface-brand)}
.jdt-choice__dot{width:8px;height:8px;border-radius:var(--radius-pill);background:var(--white)}
.jdt-choice__text{display:flex;flex-direction:column;gap:2px}
.jdt-choice__label{font:var(--type-body);color:var(--text-strong)}
.jdt-choice__desc{font:var(--type-body-sm);color:var(--text-muted)}
.jdt-choice--disabled{opacity:.45;cursor:not-allowed}
.jdt-switch{display:inline-flex;align-items:center;gap:var(--space-3);cursor:pointer}
.jdt-switch__track{width:48px;height:26px;border-radius:var(--radius-pill);background:var(--grey-300);position:relative;transition:var(--transition-control)}
.jdt-switch__track[data-on=true]{background:var(--surface-brand)}
.jdt-switch__knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:var(--radius-pill);background:var(--white);box-shadow:var(--shadow-xs);transition:left var(--dur-base) var(--ease-out)}
.jdt-switch__track[data-on=true] .jdt-switch__knob{left:25px}

/* ---------- Tabs / Breadcrumbs ---------- */
.jdt-tabs{display:flex;gap:var(--space-6);border-bottom:var(--border-1) solid var(--border-subtle)}
.jdt-tab{appearance:none;background:none;border:0;border-bottom:var(--rule-heavy) solid transparent;padding:var(--space-3) 0;font:var(--type-label);text-transform:uppercase;letter-spacing:var(--ls-label);color:var(--text-muted);cursor:pointer;transition:var(--transition-control);margin-bottom:-1px}
.jdt-tab:hover{color:var(--text-strong)}
.jdt-tab[aria-selected=true]{color:var(--text-strong);border-bottom-color:var(--surface-accent)}
.jdt-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);font:var(--type-body-sm);color:var(--text-muted)}
.jdt-crumbs a{color:inherit;border-bottom:0}
.jdt-crumbs a:hover{color:var(--text-strong)}
.jdt-crumbs__sep{color:var(--grey-400)}
.jdt-crumbs__current{color:var(--text-strong);font-weight:var(--fw-medium)}

/* ---------- Feedback ---------- */
.jdt-scrim{position:fixed;inset:0;background:var(--overlay-scrim);display:flex;align-items:center;justify-content:center;padding:var(--space-6);z-index:60}
.jdt-dialog{background:var(--surface-card);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);width:100%;max-width:520px;border-top:var(--rule-heavy) solid var(--surface-accent)}
.jdt-dialog__head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4);padding:var(--space-6) var(--space-6) var(--space-3)}
.jdt-dialog__title{font:var(--type-h3);text-transform:none;color:var(--text-strong)}
.jdt-dialog__body{padding:0 var(--space-6) var(--space-6);font:var(--type-body);color:var(--text-body)}
.jdt-dialog__foot{display:flex;justify-content:flex-end;gap:var(--space-3);padding:var(--space-4) var(--space-6);border-top:var(--border-1) solid var(--border-subtle);background:var(--grey-100)}
.jdt-toast{display:flex;align-items:flex-start;gap:var(--space-3);background:var(--surface-inverse);color:var(--white);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-4);min-width:320px;max-width:440px;border-left:var(--rule-heavy) solid var(--surface-accent)}
.jdt-toast--success{border-left-color:var(--green-600)}
.jdt-toast--danger{border-left-color:var(--red-600)}
.jdt-toast__title{font:var(--type-label);text-transform:uppercase;letter-spacing:var(--ls-label)}
.jdt-toast__msg{font:var(--type-body-sm);color:var(--grey-300);margin-top:2px}
.jdt-tooltip{position:relative;display:inline-flex}
.jdt-tooltip__bubble{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--grey-900);color:var(--white);font:var(--type-body-sm);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);white-space:nowrap;box-shadow:var(--shadow-md);opacity:0;pointer-events:none;transition:opacity var(--dur-fast) var(--ease-out)}
.jdt-tooltip__bubble[data-open=true]{opacity:1}

/* ---------- Brand blocks ---------- */
.jdt-service{display:flex;flex-direction:column;gap:var(--space-3);background:var(--surface-card);border:var(--border-1) solid var(--border-subtle);border-top:var(--rule-heavy) solid var(--grey-900);border-radius:var(--radius-md);padding:var(--space-6);text-decoration:none;transition:var(--transition-surface),border-color var(--dur-base) var(--ease-out)}
.jdt-service:hover{border-top-color:var(--surface-accent);box-shadow:var(--shadow-md);transform:translateY(-2px)}
.jdt-service__icon{color:var(--teal-700)}
.jdt-service__title{font:var(--type-h3);text-transform:uppercase;letter-spacing:var(--ls-label);color:var(--text-strong)}
.jdt-service__desc{font:var(--type-body-sm);color:var(--text-body)}
.jdt-service__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--space-2)}
.jdt-service__list li{font:var(--type-eyebrow);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--text-muted);background:var(--grey-150);padding:4px var(--space-2);border-radius:var(--radius-sm)}
.jdt-stat{display:flex;flex-direction:column;gap:var(--space-1)}
.jdt-stat__value{font:var(--fw-bold) var(--fs-display-3)/1 var(--font-display);color:var(--text-strong)}
.jdt-stat__label{font:var(--type-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--text-muted)}
.jdt-stat--inverse .jdt-stat__value{color:var(--white)}
.jdt-stat--inverse .jdt-stat__label{color:var(--grey-400)}
.jdt-cred{display:inline-flex;align-items:center;gap:var(--space-3);border:var(--border-1) solid var(--border-default);border-left:var(--rule-heavy) solid var(--teal-600);border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);background:var(--surface-card)}
.jdt-cred__code{font:var(--type-data);letter-spacing:var(--ls-label);color:var(--teal-800);text-transform:uppercase}
.jdt-cred__text{font:var(--type-body-sm);color:var(--text-body)}
.jdt-cred--inverse{background:transparent;border-color:var(--border-inverse);border-left-color:var(--teal-500)}
.jdt-cred--inverse .jdt-cred__code{color:var(--teal-300)}
.jdt-cred--inverse .jdt-cred__text{color:var(--grey-300)}
.jdt-callout{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-6);background:var(--surface-inverse);color:var(--white);padding:var(--space-8) var(--space-10);border-radius:var(--radius-md)}
.jdt-callout--accent{background:var(--surface-accent);color:var(--grey-900)}
.jdt-callout--brand{background:var(--surface-brand)}
.jdt-callout__title{font:var(--type-h2);text-transform:uppercase;letter-spacing:var(--ls-display)}
.jdt-callout__text{font:var(--type-body);opacity:.85;margin-top:var(--space-2)}