/* Infra Connect function surfaces
   Extends the red premium shell with the quiet, operational hierarchy used by Projectdossiers. */

html.ic-ready {
  --ic-panel: var(--card-bg);
  --ic-panel-muted: var(--surface-muted);
  --ic-line: var(--border-color);
  --ic-line-soft: var(--table-row-border);
  --ic-radius: 8px;
}

html.ic-ready .main-content {
  width: min(1480px, 100%);
  max-width: 1480px;
  padding: 1.4rem clamp(1rem, 2.2vw, 2rem) 3rem;
}

html.ic-ready .main-content h1,
html.ic-ready .main-content h2,
html.ic-ready .main-content h3,
html.ic-ready .main-content h4 {
  letter-spacing: 0;
}

html.ic-ready .main-content h2 { font-size: 1.45rem; }
html.ic-ready .main-content h3 { font-size: 1rem; }

/* Shared functional panels */
html.ic-ready:not([data-ic-page="dashboard"]) .main-content .glass-card {
  border: 1px solid var(--ic-line);
  border-radius: var(--ic-radius);
  background: var(--ic-panel);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transform: none;
}

html.ic-ready:not([data-ic-page="dashboard"]) .main-content .glass-card:hover {
  border-color: color-mix(in srgb, var(--accent-color) 42%, var(--ic-line));
  background: color-mix(in srgb, var(--ic-panel) 96%, var(--accent-color));
  box-shadow: none;
  transform: none;
}

html.ic-ready .main-content .section-header {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin: 1.7rem 0 .8rem;
  padding: 0 0 .65rem;
  color: var(--text-primary);
  border-bottom: 1px solid var(--ic-line);
  font-size: .78rem;
  font-weight: 800;
  text-transform: uppercase;
}

html.ic-ready .main-content .section-header svg { color: var(--accent-color); }

html.ic-ready .main-content .btn {
  min-height: 38px;
  padding: .52rem .82rem;
  border-radius: 6px;
  box-shadow: none;
  font-size: .84rem;
  letter-spacing: 0;
  transform: none;
}

html.ic-ready .main-content .btn:hover { transform: none; box-shadow: none; filter: brightness(1.07); }
html.ic-ready .main-content .btn:disabled { opacity: .5; cursor: not-allowed; }

html.ic-ready .main-content .input-field,
html.ic-ready .main-content input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
html.ic-ready .main-content select,
html.ic-ready .main-content textarea {
  min-width: 0;
  border-radius: 6px;
  letter-spacing: 0;
}

html.ic-ready .main-content .input-field:focus,
html.ic-ready .main-content input:focus,
html.ic-ready .main-content select:focus,
html.ic-ready .main-content textarea:focus {
  border-color: var(--accent-color) !important;
  box-shadow: var(--ring) !important;
  outline: 0;
}

html.ic-ready .main-content label {
  color: var(--text-secondary);
  font-size: .78rem;
  font-weight: 700;
}

html.ic-ready .main-content .badge,
html.ic-ready .main-content [class*="badge"],
html.ic-ready .main-content [class*="pill"] { border-radius: 4px; letter-spacing: 0; }

/* Tables: same information density as Projectdossiers. */
html.ic-ready .main-content table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
}

html.ic-ready .main-content table th {
  padding: .68rem .75rem;
  color: var(--text-secondary);
  background: var(--surface-muted);
  border-bottom: 1px solid var(--ic-line);
  font-size: .7rem;
  font-weight: 800;
  text-align: left;
  text-transform: uppercase;
}

html.ic-ready .main-content table td {
  padding: .72rem .75rem;
  border-bottom: 1px solid var(--ic-line-soft);
  vertical-align: middle;
}

html.ic-ready .main-content table tbody tr:hover td { background: var(--table-hover-bg); }

/* Dashboard: compact command cockpit, red identity preserved. */
html[data-ic-page="dashboard"] .hero-checkin {
  min-height: 0;
  margin-bottom: 1.25rem;
  padding: 1.35rem 1.5rem;
  border: 1px solid var(--ic-line);
  border-left: 4px solid var(--accent-color);
  border-radius: var(--ic-radius);
  background: linear-gradient(100deg, color-mix(in srgb, var(--accent-color) 9%, var(--card-bg)), var(--card-bg)) !important;
  box-shadow: none;
  text-align: left;
}

html[data-ic-page="dashboard"] .hero-checkin h2 { margin: 0; font-size: 1.5rem; }
html[data-ic-page="dashboard"] .hero-checkin > div { margin-top: .25rem; font-size: .86rem; }

html[data-ic-page="dashboard"] .dashboard-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin-top: .8rem;
}

html[data-ic-page="dashboard"] .ic-kpi-card {
  min-height: 156px;
  padding: 1rem 1.05rem !important;
  border: 1px solid var(--ic-line) !important;
  border-left-width: 3px !important;
  border-radius: var(--ic-radius) !important;
  background: var(--ic-panel) !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-ic-page="dashboard"] .ic-kpi-card:hover {
  border-color: color-mix(in srgb, var(--accent-color) 38%, var(--ic-line)) !important;
  background: color-mix(in srgb, var(--ic-panel) 96%, var(--accent-color)) !important;
  transform: none !important;
}

html[data-ic-page="dashboard"] .ic-kpi-card h3 { font-size: .98rem !important; }
html[data-ic-page="dashboard"] .ic-kpi-card > div[style*="font-size: 3rem"] {
  margin-top: auto;
  font-size: 2.2rem !important;
  line-height: 1.1;
}
html[data-ic-page="dashboard"] .ic-kpi-card p { font-size: .8rem !important; line-height: 1.4; }
html[data-ic-page="dashboard"] .ic-kpi-decorative { display: none !important; }

html[data-ic-page="dashboard"] #kablo-incidents-tile,
html[data-ic-page="dashboard"] #kablo-invoice-tile,
html[data-ic-page="dashboard"] #kablo-werven-tile {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: center;
  column-gap: .75rem;
  row-gap: .18rem;
  color: var(--text-primary);
  text-align: left;
}

html[data-ic-page="dashboard"] :is(.ki-tile-ico,.kf-tile-ico,.kw-tile-ico) {
  grid-row: 1 / 3;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  color: var(--accent-color);
  background: color-mix(in srgb, var(--accent-color) 11%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent-color) 24%, transparent);
  border-radius: 6px;
  font-size: 0 !important;
}

html[data-ic-page="dashboard"] :is(.ki-tile-ico,.kf-tile-ico,.kw-tile-ico) svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

html[data-ic-page="dashboard"] :is(.ki-tile-title,.kf-tile-title,.kw-tile-title) {
  align-self: end;
  font-size: .96rem !important;
}

html[data-ic-page="dashboard"] :is(.ki-tile-sub,.kf-tile-sub,.kw-tile-sub) {
  align-self: start;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Tasks: one scannable dossier column, details remain inside the selected record. */
html[data-ic-page="tasks"] .main-content > div > div[style*="grid-template-columns"] {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: .7rem !important;
}

html[data-ic-page="tasks"] .ic-task-bulkbar {
  margin-bottom: .85rem !important;
  padding: .7rem .8rem !important;
  background: var(--surface-muted) !important;
}

html[data-ic-page="tasks"] .ic-task-bulkbar .btn {
  min-height: 34px;
  padding: .42rem .65rem;
  font-size: .76rem;
}

html[data-ic-page="tasks"] .ic-task-card {
  padding: .85rem .9rem !important;
  border-left-width: 3px !important;
}

html[data-ic-page="tasks"] .ic-task-card-row {
  display: grid !important;
  grid-template-columns: 32px minmax(0, 1fr) minmax(110px, auto);
  min-height: 0;
  align-items: start !important;
  gap: .75rem !important;
  padding-bottom: 0 !important;
}

html[data-ic-page="tasks"] .ic-task-select {
  width: 30px !important;
  height: 30px !important;
  border-radius: 6px !important;
  background: var(--surface-muted) !important;
  border-color: var(--ic-line) !important;
}

html[data-ic-page="tasks"] .ic-task-source-date { display: none; }

html[data-ic-page="tasks"] .ic-task-title {
  margin: 0 0 .55rem !important;
  font-size: 1rem !important;
  line-height: 1.3;
}

html[data-ic-page="tasks"] .ic-taskdays {
  display: grid;
  gap: 1px;
  max-width: none;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--ic-line-soft);
  border-radius: 6px;
  background: var(--ic-line-soft);
}

html[data-ic-page="tasks"] .ic-taskday {
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) 32px;
  align-items: center !important;
  gap: .7rem !important;
  min-height: 34px;
  padding: .35rem .5rem !important;
  background: var(--surface-muted) !important;
  border: 0 !important;
  border-radius: 0 !important;
}

html[data-ic-page="tasks"] .ic-taskday-date {
  color: var(--text-primary) !important;
  font-size: .75rem !important;
  font-weight: 750 !important;
}

html[data-ic-page="tasks"] .ic-taskday-people {
  overflow: hidden;
  color: var(--text-secondary) !important;
  font-size: .76rem !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-ic-page="tasks"] .ic-taskday-count {
  display: grid;
  width: 28px;
  height: 22px;
  place-items: center;
  justify-self: end;
  border: 1px solid var(--ic-line);
  border-radius: 4px !important;
  background: var(--card-bg) !important;
  color: var(--text-primary) !important;
  font-size: .7rem !important;
  font-weight: 800;
}

html[data-ic-page="tasks"] .ic-task-meta {
  padding-top: .1rem;
  color: var(--text-secondary);
  font-size: .74rem !important;
  line-height: 1.45;
}

html[data-ic-page="tasks"] .ic-task-meta.is-placeholder-time > div:first-child { display: none; }

/* Inventory: restrained management workspace instead of a promotional hero. */
html[data-ic-page="inventory"] .inventory-shell { max-width: 100% !important; }

html[data-ic-page="inventory"] .inventory-hero {
  padding: 1rem 1.1rem !important;
  border-left: 3px solid var(--accent-color) !important;
  background: var(--card-bg) !important;
  box-shadow: none !important;
}

html[data-ic-page="inventory"] .inventory-hero::before,
html[data-ic-page="inventory"] .inventory-hero::after { display: none !important; }

html[data-ic-page="inventory"] .inventory-hero-top {
  align-items: flex-start !important;
  gap: 1rem !important;
  box-shadow: none !important;
}

html[data-ic-page="inventory"] .inventory-hero-copy,
html[data-ic-page="inventory"] .inventory-hero-title-row,
html[data-ic-page="inventory"] .inventory-hero-description { box-shadow: none !important; }

html[data-ic-page="inventory"] .inventory-hero-top::after,
html[data-ic-page="inventory"] .inventory-hero-copy::after,
html[data-ic-page="inventory"] .inventory-hero-title-row::after,
html[data-ic-page="inventory"] .inventory-hero-description::after { display: none !important; }

html[data-ic-page="inventory"] .inventory-hero-title-row h1,
html[data-ic-page="inventory"] .inventory-hero-title-row h2 {
  font-size: 1.35rem !important;
}

html[data-ic-page="inventory"] .inventory-hero-description {
  max-width: 820px;
  margin: .3rem 0 0 !important;
  color: var(--text-secondary) !important;
  font-size: .82rem !important;
  line-height: 1.5;
}

html[data-ic-page="inventory"] .inventory-summary-row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .5rem !important;
  margin-top: .8rem !important;
}

html[data-ic-page="inventory"] .inventory-summary-pill {
  justify-content: flex-start !important;
  min-height: 44px;
  padding: .55rem .7rem !important;
  border: 1px solid var(--ic-line) !important;
  border-radius: 6px !important;
  background: var(--surface-muted) !important;
  box-shadow: none !important;
}

html[data-ic-page="inventory"] .inventory-toolbar {
  margin-top: .7rem !important;
  padding: .55rem !important;
  border: 1px solid var(--ic-line) !important;
  background: var(--surface-muted) !important;
}

html[data-ic-page="inventory"] .inventory-search-shell {
  min-height: 48px;
  border-radius: 6px !important;
  background: var(--card-bg) !important;
}

html[data-ic-page="inventory"] .inventory-result-badge {
  border-color: color-mix(in srgb, var(--accent-color) 24%, var(--ic-line)) !important;
  border-radius: 4px !important;
  background: color-mix(in srgb, var(--accent-color) 8%, var(--card-bg)) !important;
  color: var(--accent-color) !important;
  box-shadow: none !important;
}

html[data-ic-page="inventory"] .inventory-product-grid { gap: .7rem !important; }

html[data-ic-page="inventory"] .inventory-product-card {
  padding: .9rem 1rem !important;
  background: var(--card-bg) !important;
}

html[data-ic-page="inventory"] .inventory-product-card::before,
html[data-ic-page="inventory"] .inventory-product-card::after { display: none !important; }

html[data-ic-page="inventory"] .inventory-stock-pill,
html[data-ic-page="inventory"] .inventory-stat-card,
html[data-ic-page="inventory"] .inventory-barcode-panel {
  border-radius: 5px !important;
  box-shadow: none !important;
}

html[data-ic-page="inventory"] .inventory-stat-card { background: var(--surface-muted) !important; }
html[data-ic-page="inventory"] .inventory-icon-btn { width: 34px !important; height: 34px !important; }
html[data-ic-page="inventory"] .inventory-card-footer { border-top-color: var(--ic-line-soft) !important; }

/* Check-ins: stable icon actions for edit and daily reset. */
html[data-ic-page="checkins"] .checkin-edit-button {
  display: inline-grid !important;
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  place-items: center;
  flex: 0 0 38px;
  border: 1px solid var(--ic-line) !important;
  border-radius: 6px !important;
  background: var(--surface-muted) !important;
  color: var(--text-primary) !important;
}

html[data-ic-page="checkins"] .checkin-edit-button svg {
  display: block !important;
  width: 17px !important;
  min-width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round;
  stroke-linejoin: round;
}

html[data-ic-page="checkins"] .checkin-edit-button:hover {
  border-color: color-mix(in srgb, var(--accent-color) 45%, var(--ic-line)) !important;
  background: color-mix(in srgb, var(--accent-color) 9%, var(--surface-muted)) !important;
  color: var(--accent-color) !important;
}

html[data-ic-page="checkins"] .checkin-edit-button[title*="resetten"] {
  border-color: color-mix(in srgb, #ef4444 45%, var(--ic-line)) !important;
  background: color-mix(in srgb, #ef4444 8%, var(--surface-muted)) !important;
  color: #ef4444 !important;
}

html[data-ic-page="checkins"] tbody td:last-child { white-space: nowrap; }

/* New task: operational workbench with searchable crew planning. */
html[data-ic-page="task-create"] .ic-create-shell {
  width: min(1180px, 100%) !important;
  max-width: 1180px !important;
}

html[data-ic-page="task-create"] .ic-create-header {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center !important;
  column-gap: .8rem;
  margin-bottom: 1rem !important;
}

html[data-ic-page="task-create"] .ic-create-header > .btn {
  grid-row: 1 / 3;
  width: 38px;
  height: 38px;
  margin: 0 !important;
}

html[data-ic-page="task-create"] .ic-create-header h2 { margin: 0 !important; }

html[data-ic-page="task-create"] .ic-create-subtitle {
  margin: .15rem 0 0;
  color: var(--text-secondary);
  font-size: .82rem;
}

html[data-ic-page="task-create"] .ic-create-mode {
  margin-bottom: .85rem !important;
  padding: .85rem !important;
}

html[data-ic-page="task-create"] .ic-create-mode > div:last-child {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: .6rem !important;
}

html[data-ic-page="task-create"] .ic-create-mode .btn {
  min-height: 64px !important;
  padding: .7rem .8rem !important;
  border-radius: 6px !important;
}

html[data-ic-page="task-create"] .ic-create-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  align-items: start;
  gap: .7rem;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-ic-page="task-create"] .ic-create-form:hover {
  border: 0 !important;
  background: transparent !important;
}

html[data-ic-page="task-create"] .ic-create-form > :not(style):not(.ic-create-submit):not(.ic-existing-submit) {
  min-width: 0;
  margin: 0 !important;
  padding: .95rem !important;
  border: 1px solid var(--ic-line);
  border-radius: var(--ic-radius);
  background: var(--card-bg);
}

html[data-ic-page="task-create"] .ic-create-form > .ic-special-submit {
  padding: 0 !important;
  border: 0 !important;
}

html[data-ic-page="task-create"] .ic-create-type,
html[data-ic-page="task-create"] .ic-create-basics,
html[data-ic-page="task-create"] .ic-create-address,
html[data-ic-page="task-create"] .ic-create-assignees { grid-column: 1; }

html[data-ic-page="task-create"] .ic-create-documents,
html[data-ic-page="task-create"] .ic-create-description,
html[data-ic-page="task-create"] .ic-create-submit { grid-column: 2; }

html[data-ic-page="task-create"] .ic-create-documents { grid-row: 1 / span 2; }
html[data-ic-page="task-create"] .ic-create-description { grid-row: 3; }
html[data-ic-page="task-create"] .ic-create-submit { grid-row: 4; }

html[data-ic-page="task-create"] :is(.ic-create-type,.ic-create-basics,.ic-create-address,.ic-create-assignees,.ic-create-documents,.ic-create-description)::before {
  display: block;
  margin-bottom: .75rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--ic-line-soft);
  color: var(--text-primary);
  font-size: .82rem;
  font-weight: 800;
}

html[data-ic-page="task-create"] .ic-create-type::before { content: "1 · Opdrachttype"; }
html[data-ic-page="task-create"] .ic-create-basics::before { content: "2 · Basisgegevens"; }
html[data-ic-page="task-create"] .ic-create-address::before { content: "3 · Werflocatie"; }
html[data-ic-page="task-create"] .ic-create-assignees::before { content: "4 · Ploeg voor de eerste werkdag"; }
html[data-ic-page="task-create"] .ic-create-documents::before { content: "5 · Werfdocumenten"; }
html[data-ic-page="task-create"] .ic-create-description::before { content: "6 · Werknotities"; }

html[data-ic-page="task-create"] .ic-create-type > label,
html[data-ic-page="task-create"] .ic-create-assignees > label,
html[data-ic-page="task-create"] .ic-create-documents > label,
html[data-ic-page="task-create"] .ic-create-description > label { display: none !important; }

html[data-ic-page="task-create"] .ic-create-type > div { gap: .4rem !important; }

html[data-ic-page="task-create"] .ic-create-type .btn {
  min-width: 92px;
  min-height: 36px;
  padding: .42rem .7rem !important;
  border-radius: 5px !important;
}

html[data-ic-page="task-create"] .ic-create-basics {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: .7rem !important;
}

html[data-ic-page="task-create"] .ic-create-basics::before { grid-column: 1 / -1; }
html[data-ic-page="task-create"] .ic-create-basics .input-group:last-child { grid-column: 1 / -1; }

html[data-ic-page="task-create"] .ic-assignee-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  align-items: center;
  gap: .55rem;
  margin-bottom: .65rem;
}

html[data-ic-page="task-create"] .ic-assignee-search {
  display: flex;
  align-items: center;
  gap: .45rem;
  min-height: 38px;
  padding: 0 .65rem;
  border: 1px solid var(--ic-line);
  border-radius: 6px;
  background: var(--bg-primary);
}

html[data-ic-page="task-create"] .ic-assignee-search svg {
  width: 16px;
  height: 16px;
  color: var(--text-secondary);
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

html[data-ic-page="task-create"] .ic-assignee-search input {
  width: 100%;
  min-height: 36px;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: .8rem;
}

html[data-ic-page="task-create"] .ic-assignee-count {
  color: var(--text-secondary);
  font-size: .72rem;
  white-space: nowrap;
}

html[data-ic-page="task-create"] .ic-assignee-clear {
  min-height: 34px;
  padding: .35rem .55rem;
  border: 1px solid var(--ic-line);
  border-radius: 5px;
  background: transparent;
  color: var(--text-secondary);
  font: inherit;
  font-size: .72rem;
  cursor: pointer;
}

html[data-ic-page="task-create"] .ic-assignee-clear:disabled { opacity: .45; cursor: default; }

html[data-ic-page="task-create"] .ic-assignee-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem !important;
  max-height: 246px;
  margin-top: 0 !important;
  padding-right: .25rem;
  overflow-y: auto;
}

html[data-ic-page="task-create"] .ic-assignee-chip {
  min-width: 0;
  padding: .48rem .55rem !important;
  border-radius: 5px !important;
  overflow: hidden;
  font-size: .78rem;
  white-space: nowrap;
  text-overflow: ellipsis;
}

html[data-ic-page="task-create"] .ic-assignee-chip[aria-pressed="true"] {
  border-color: var(--accent-color) !important;
  background: color-mix(in srgb, var(--accent-color) 13%, transparent) !important;
  color: var(--text-primary) !important;
}

html[data-ic-page="task-create"] .ic-assignee-chip span {
  margin-left: auto;
  overflow: hidden;
  text-overflow: ellipsis;
}

html[data-ic-page="task-create"] .ic-create-documents > div {
  grid-template-columns: 1fr !important;
  gap: .5rem !important;
  margin-top: 0 !important;
}

html[data-ic-page="task-create"] .ic-create-documents > div > div {
  padding: .7rem !important;
  border-radius: 6px !important;
  background: var(--surface-muted) !important;
}

html[data-ic-page="task-create"] .ic-create-documents input[type="file"] { font-size: .72rem; }

html[data-ic-page="task-create"] .ic-create-submit {
  position: sticky;
  top: 1rem;
  width: 100% !important;
  min-height: 44px !important;
  margin: 0 !important;
  border-radius: 6px !important;
}

html[data-ic-page="task-create"] .ic-create-form.is-existing {
  grid-template-columns: minmax(0, 1fr);
}

html[data-ic-page="task-create"] .ic-create-form.is-existing > * {
  grid-column: 1 !important;
  grid-row: auto !important;
}

html[data-ic-page="task-create"] .ic-existing-intro h3 { font-size: 1rem; }

html[data-ic-page="task-create"] .ic-existing-tasks > div {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: .5rem !important;
}

html[data-ic-page="task-create"] .ic-existing-tasks .btn {
  min-height: 52px !important;
  padding: .62rem .7rem !important;
  border-radius: 6px !important;
  font-size: .78rem;
}

html[data-ic-page="task-create"] .ic-existing-planning {
  grid-template-columns: minmax(280px, 350px) minmax(0, 1fr) !important;
  gap: .8rem !important;
}

html[data-ic-page="task-create"] .admin-existing-calendar {
  padding: .7rem !important;
  border-radius: 6px !important;
  background: var(--surface-muted) !important;
}

html[data-ic-page="task-create"] .ic-existing-assignee-panel {
  min-width: 0;
}

html[data-ic-page="task-create"] .ic-existing-assignee-panel > label {
  display: block;
  margin-bottom: .5rem !important;
}

html[data-ic-page="task-create"] .ic-existing-submit {
  position: static;
  width: 100% !important;
  min-height: 44px !important;
  margin: 0 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

html[data-ic-page="task-create"] .ic-create-form.is-special {
  grid-template-columns: minmax(0, 1fr);
}

html[data-ic-page="task-create"] .ic-create-form.is-special > * {
  grid-column: 1 !important;
  grid-row: auto !important;
}

html[data-ic-page="task-create"] .ic-special-info {
  border-left: 3px solid var(--accent-color) !important;
  background: color-mix(in srgb, var(--accent-color) 7%, var(--card-bg)) !important;
  color: var(--text-secondary) !important;
  font-size: .84rem !important;
  line-height: 1.5;
}

html[data-ic-page="task-create"] .ic-special-date::before {
  content: "2 · Datum";
  display: block;
  grid-column: 1 / -1;
  margin-bottom: .75rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--ic-line-soft);
  color: var(--text-primary);
  font-size: .82rem;
  font-weight: 800;
}

html[data-ic-page="task-create"] .ic-create-form.is-special .ic-create-assignees::before { content: "3 · Medewerkers"; }
html[data-ic-page="task-create"] .ic-create-form.is-feastday .ic-create-assignees { display: none !important; }

html[data-ic-page="task-create"] .ic-special-date {
  grid-template-columns: minmax(0, 360px) !important;
  gap: .7rem !important;
}

html[data-ic-page="task-create"] .ic-special-submit {
  width: 100% !important;
  min-height: 44px !important;
  margin: 0 !important;
  border-radius: 6px !important;
  background: var(--accent-color) !important;
  border-color: var(--accent-color) !important;
  box-shadow: none !important;
}

/* Forms and admin lists */
html[data-ic-page="leave"] .main-content form,
html[data-ic-page="leave-admin"] .main-content form,
html[data-ic-page="notifications"] .main-content form,
html[data-ic-page="sdworx"] .main-content .glass-card {
  border-radius: var(--ic-radius) !important;
}

html[data-ic-page="complaints"] .main-content .glass-card,
html[data-ic-page="damage"] .main-content .glass-card,
html[data-ic-page="reports"] .main-content .glass-card,
html[data-ic-page="invoices"] .main-content .glass-card,
html[data-ic-page="vehicles"] .main-content .glass-card,
html[data-ic-page="documents"] .main-content .glass-card {
  overflow: hidden;
}

html[data-ic-page="photos"] .photo-filter-card,
html[data-ic-page="inventory"] .inventory-toolbar,
html[data-ic-page="search"] .search-panel {
  border-radius: var(--ic-radius) !important;
  box-shadow: none !important;
}

/* Existing custom modules already use a two-pane professional workspace.
   Only align their red accent and shell dimensions. */
html[data-ic-page="projects"] .project-page,
html[data-ic-page="assets"] .assets-page { width: min(1480px, 100%); }

html[data-ic-page="projects"] .project-row.is-selected,
html[data-ic-page="assets"] .assets-table tbody tr.is-selected {
  background: color-mix(in srgb, var(--accent-color) 12%, transparent);
  box-shadow: inset 3px 0 var(--accent-color);
}

/* Dialogs and chat surfaces */
html.ic-ready .main-content .modal-content,
html.ic-ready .kf-modal,
html.ic-ready .ki-modal,
html.ic-ready .kw-modal {
  border-radius: var(--ic-radius) !important;
  border-color: var(--ic-line) !important;
  background: var(--card-bg) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.45) !important;
}

html.ic-ready :is(.kf-overlay,.ki-overlay,.kw-overlay) { background: rgba(0,0,0,.76) !important; }

html.ic-ready :is(.kf-head,.ki-head,.kw-head) {
  padding: 1rem 1.1rem !important;
  border-bottom-color: var(--ic-line) !important;
}

html.ic-ready :is(.kf-h2,.ki-h2,.kw-h2) {
  display: flex;
  align-items: center;
  gap: .55rem;
  font-size: 1.18rem !important;
  letter-spacing: 0;
}

html.ic-ready :is(.kf-h2,.ki-h2,.kw-h2) svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: var(--accent-color);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

html.ic-ready :is(.kf-tabs,.ki-tools,.kw-tools) {
  gap: .45rem !important;
  padding: .65rem 1.1rem !important;
  border-bottom-color: var(--ic-line) !important;
  background: var(--surface-muted) !important;
}

html.ic-ready .kf-tab {
  padding: .45rem .72rem !important;
  border-radius: 5px !important;
}

html.ic-ready .kf-tab.active {
  border-color: color-mix(in srgb, var(--accent-color) 35%, var(--ic-line)) !important;
  background: color-mix(in srgb, var(--accent-color) 12%, transparent) !important;
  color: var(--accent-color) !important;
}

html.ic-ready :is(.kf-body,.ki-body,.kw-body) { padding: .9rem 1.1rem 1.1rem !important; }

html.ic-ready :is(.kf-btn,.ki-btn,.kw-btn,.kf-inp,.kf-select,.ki-inp,.ki-select,.ki-txt,.kw-inp,.kw-select) {
  border-radius: 6px !important;
  letter-spacing: 0;
}

html.ic-ready :is(.kf-btn,.ki-btn,.kw-btn) { background: var(--accent-color) !important; }

html.ic-ready :is(.kf-btn--ghost,.ki-btn--ghost,.kw-btn--ghost) {
  border: 1px solid var(--ic-line) !important;
  background: transparent !important;
  color: var(--text-secondary) !important;
}

html.ic-ready :is(.kf-inp,.kf-select,.ki-inp,.ki-select,.ki-txt,.kw-inp,.kw-select) {
  border-color: var(--ic-line) !important;
  background: var(--bg-primary) !important;
}

html.ic-ready :is(.ki-card,.kw-card,.ki-form,.kw-form) {
  border-color: var(--ic-line) !important;
  border-radius: 6px !important;
  background: var(--surface-muted) !important;
}

html.ic-ready .kf-table th { background: var(--surface-muted) !important; }

html.ic-ready :is(.kf-empty,.ki-empty,.kw-empty) {
  min-height: 120px;
  display: grid;
  place-items: center;
  border: 1px solid var(--ic-line-soft);
  border-radius: 6px;
  background: var(--surface-muted);
}

@media (max-width: 1100px) {
  html[data-ic-page="dashboard"] .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-ic-page="task-create"] .ic-create-form { grid-template-columns: minmax(0, 1fr); }
  html[data-ic-page="task-create"] .ic-create-form > * { grid-column: 1 !important; grid-row: auto !important; }
  html[data-ic-page="task-create"] .ic-create-documents > div { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  html[data-ic-page="task-create"] .ic-existing-planning { grid-template-columns: minmax(260px, 340px) minmax(0, 1fr) !important; }
  html[data-ic-page="task-create"] .ic-create-submit { position: static; }
}

@media (max-width: 760px) {
  html.ic-ready .main-content { padding: 1rem .8rem 2rem; }
  html.ic-ready .main-content h2 { font-size: 1.25rem; }
  html[data-ic-page="planning"] .planning-layout {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 1rem !important;
  }
  html[data-ic-page="planning"] .calendar-container { width: 100%; min-width: 0; }
  html[data-ic-page="leave-admin"] .main-content > div > div:first-child {
    align-items: stretch !important;
    flex-direction: column;
    gap: .7rem;
    margin-bottom: 1rem !important;
  }
  html[data-ic-page="leave-admin"] .main-content > div > div:first-child > div {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .45rem !important;
  }
  html[data-ic-page="leave-admin"] .main-content > div > div:first-child > div .btn {
    width: 100%;
    min-width: 0;
    padding-inline: .45rem !important;
  }
  html[data-ic-page="task-create"] .ic-create-mode > div:last-child { grid-template-columns: 1fr !important; }
  html[data-ic-page="task-create"] .ic-create-basics { grid-template-columns: 1fr !important; }
  html[data-ic-page="task-create"] .ic-create-basics .input-group:last-child { grid-column: auto; }
  html[data-ic-page="task-create"] .ic-assignee-toolbar { grid-template-columns: minmax(0, 1fr) auto; }
  html[data-ic-page="task-create"] .ic-assignee-count { grid-column: 1; grid-row: 2; }
  html[data-ic-page="task-create"] .ic-assignee-clear { grid-column: 2; grid-row: 2; }
  html[data-ic-page="task-create"] .ic-assignee-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-ic-page="task-create"] .ic-create-documents > div { grid-template-columns: 1fr !important; }
  html[data-ic-page="task-create"] .ic-existing-tasks > div { grid-template-columns: 1fr !important; }
  html[data-ic-page="task-create"] .ic-existing-planning { grid-template-columns: minmax(0, 1fr) !important; }
  html[data-ic-page="dashboard"] .hero-checkin { padding: 1rem; }
  html[data-ic-page="dashboard"] .dashboard-grid { grid-template-columns: 1fr; gap: .65rem; }
  html[data-ic-page="dashboard"] .ic-kpi-card { min-height: 0; }
  html[data-ic-page="tasks"] .ic-task-card { padding: .75rem !important; }
  html[data-ic-page="tasks"] .ic-task-card-row { grid-template-columns: 30px minmax(0, 1fr); }
  html[data-ic-page="tasks"] .ic-task-meta { grid-column: 2; text-align: left !important; }
  html[data-ic-page="tasks"] .ic-taskday { grid-template-columns: 92px minmax(0, 1fr) 28px; gap: .45rem !important; }
  html[data-ic-page="inventory"] .inventory-summary-row { grid-template-columns: 1fr; }
  html[data-ic-page="inventory"] .inventory-hero-top { flex-direction: column; }
  html.ic-ready :is(.kf-overlay,.ki-overlay,.kw-overlay) { padding: .55rem !important; }
  html.ic-ready :is(.kf-modal,.ki-modal,.kw-modal) { max-height: 96vh !important; }
  html.ic-ready :is(.kf-head,.ki-head,.kw-head) { padding: .8rem !important; }
  html.ic-ready :is(.kf-tabs,.ki-tools,.kw-tools) { padding: .55rem .8rem !important; }
  html.ic-ready :is(.kf-body,.ki-body,.kw-body) { padding: .7rem .8rem .8rem !important; }
  html.ic-ready .kf-line { grid-template-columns: minmax(160px,1fr) 58px 58px 74px 58px 32px !important; overflow-x: auto; }
  html.ic-ready .main-content table { min-width: 680px; }
  html.ic-ready .main-content .checkins-table-frame,
  html.ic-ready .main-content [class*="table-wrap"],
  html.ic-ready .main-content [style*="overflow-x"] { max-width: 100%; overflow-x: auto !important; }
}

@media (prefers-reduced-motion: reduce) {
  html.ic-ready .main-content *, html.ic-ready .main-content *::before, html.ic-ready .main-content *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}