:root {
  --oltrane-action-primary: #2463eb;
  --oltrane-brand-header: #152132;
  --oltrane-brand-ink: #ffffff;
  --oltrane-brand-muted: #b1bdcd;
  --oltrane-success: #146b57;
  --oltrane-success-soft: #e8f5ef;
  --oltrane-guidance: #6943a3;
  --oltrane-guidance-soft: #f2ecfb;
}
.dark {
  --oltrane-success: #8ddbc1;
  --oltrane-success-soft: #17372e;
  --oltrane-guidance: #cdb4f4;
  --oltrane-guidance-soft: #2d2342;
}

.task-detail-eyebrow,.task-detail-mobile-edit { display:none; }
@media(max-width:767px) {
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-header {
    display:block; position:relative; padding:calc(8px + env(safe-area-inset-top)) 20px 18px;
    background:var(--oltrane-brand-header) !important; color:var(--oltrane-brand-ink) !important; border:0;
  }
  .task-detail-header .task-detail-heading { display:block; }
  .task-detail-header .task-detail-heading>div:first-child { display:none; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-header p.task-detail-eyebrow {
    display:flex; align-items:center; min-height:44px; margin:0 108px 8px 0;
    color:var(--oltrane-brand-muted) !important; font-size:12px; font-weight:600;
  }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-header h2 {
    font-size:22px; line-height:1.3; font-weight:700; letter-spacing:-.3px;
    color:var(--oltrane-brand-ink) !important;
  }
  .task-detail-header-actions { position:absolute; top:calc(8px + env(safe-area-inset-top)); right:16px; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-header-actions button {
    width:44px; min-height:44px; color:var(--oltrane-brand-ink) !important;
    background:transparent !important; border:1px solid var(--oltrane-brand-muted);
  }
  .task-detail-header-actions .task-detail-header-edit { display:none; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-header .task-detail-context { margin-top:12px; gap:8px; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-header .task-detail-context span {
    color:var(--oltrane-brand-muted) !important; background:transparent !important;
    font-size:12px; line-height:1.5; border-color:var(--oltrane-brand-muted) !important;
  }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-header .task-detail-project-chip {
    border:0 !important; padding:0; min-height:0; align-items:flex-start; gap:6px;
  }
  .task-detail-header .task-detail-project-chip svg { margin-top:2px; flex-shrink:0; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-tabs {
    display:grid; grid-template-columns:1fr 1.4fr 1.2fr; gap:0; padding:0 12px; min-height:58px;
    background:var(--detail-surface) !important; overflow:visible;
  }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-tabs button {
    min-width:0; min-height:58px; margin:0; border-radius:0; justify-content:center; gap:4px;
    background:transparent !important; font-size:12px; border-bottom:3px solid transparent;
  }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-tabs button[aria-pressed=true] {
    color:var(--detail-blue) !important; border-bottom-color:var(--detail-blue);
  }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-body { padding:18px 16px 22px; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-description {
    padding:18px !important; border-left:4px solid var(--detail-blue) !important; border-radius:12px;
  }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-description label { font-size:16px; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-description>p {
    font-size:15px; line-height:1.7; margin-top:12px;
  }
  .task-detail-description .task-detail-context-edit,.task-detail-planning .task-detail-context-edit { display:none; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-status { padding:16px; border-radius:12px; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-status>label { display:block; font-size:13px; margin-bottom:12px; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-status button { min-height:52px; font-size:12px; padding:10px 6px; }
  .task-detail-status button svg { display:none; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-planning {
    display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--detail-line) !important;
    border-radius:12px; background:var(--detail-surface) !important; overflow:hidden;
  }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-planning>div {
    min-width:0; border:0 !important; border-radius:0; padding:16px 12px;
  }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-planning>div+div { border-left:1px solid var(--detail-line) !important; }
  .task-detail-planning>div>div:first-child { min-height:24px; margin-bottom:8px; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-planning label { font-size:12px; }
  .task-detail-planning .inline-flex { max-width:100%; height:auto; }
  .task-detail-planning .inline-flex span { max-width:none; white-space:normal; overflow-wrap:anywhere; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-options { border-radius:12px; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-footer {
    padding:12px 16px calc(12px + env(safe-area-inset-bottom)); background:var(--detail-surface) !important;
  }
  .task-detail-footer>div { width:100%; display:flex; gap:10px; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog .task-detail-footer button { min-height:50px; }
  .task-detail-footer .task-detail-footer-close { flex:1; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog button.task-detail-mobile-edit {
    display:flex; flex:2; align-items:center; justify-content:center; gap:8px; padding:12px;
    color:var(--oltrane-brand-ink) !important; background:var(--oltrane-action-primary) !important;
    font-size:14px; font-weight:650;
  }
  /* Primary actions retain the same blue in both themes. */

  .task-detail-dialog[data-task-editing=true] .task-detail-footer>div>button { flex:1; }
  .task-detail-dialog[data-task-editing=true] .task-detail-planning { grid-template-columns:1fr !important; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog[data-task-editing=true] .task-detail-planning>div+div { border-left:0 !important; border-top:1px solid var(--detail-line) !important; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog[data-task-editing=true] .task-detail-header label { color:var(--oltrane-brand-muted) !important; }
  html body .task-detail-overlay.mobile-form-surface .task-detail-dialog[data-task-editing=true] .task-detail-header input { min-height:48px; }
}

@media(max-width:767px){
  html body .task-detail-overlay>.bug-reporter-host .bug-reporter-trigger {
    top:calc(8px + env(safe-area-inset-top)); bottom:auto; right:68px; width:44px; min-height:44px; padding:10px;
    color:var(--oltrane-brand-ink); background:var(--oltrane-brand-header); border-color:var(--oltrane-brand-muted);
  }
  .task-detail-overlay>.bug-reporter-host .bug-reporter-trigger :is(.bug-long-label,.bug-short-label) {display:none}
  .task-detail-planning label>svg { color:var(--detail-muted) !important; }
}