/* Bölüm 05: liste işlemleri ve koleksiyon şemaları. */
.ip-list-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25em;
  margin: 1.1em auto;
  white-space: nowrap;
}

.ip-list-name { margin-right: 0.35em; font-weight: 600; }
.ip-list-bracket { font-size: 1.8em; line-height: 1; }
.ip-list-value {
  display: inline-block;
  min-width: 2.3em;
  padding: 0.16em 0.35em;
  border: 2px solid #107895;
  border-radius: 0.25em;
  background: #eaf5f8;
  text-align: center;
  font-weight: 600;
}

.ip-index-map {
  width: min(100%, 27em);
  margin: 1.2em auto;
}

.ip-index-row {
  display: grid;
  grid-template-columns: 4.5em repeat(3, minmax(0, 1fr));
  gap: 0.3em;
  align-items: center;
  text-align: center;
  margin: 0.25em 0;
}

.ip-index-label {
  text-align: right;
  padding-right: 0.45em;
  font-size: 0.72em;
  color: #42566a;
}

.ip-index-positive span:not(.ip-index-label),
.ip-index-negative span:not(.ip-index-label) {
  font-size: 0.8em;
  color: #42566a;
}

.ip-index-values span:not(.ip-index-label) {
  padding: 0.25em 0;
  border: 2px solid #107895;
  border-radius: 0.22em;
  background: #eaf5f8;
  font-weight: 600;
}

.ip-slice-map {
  width: min(100%, 30em);
  margin: 1.3em auto;
}

.ip-slice-indices,
.ip-slice-values {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.25em;
  text-align: center;
}

.ip-slice-indices {
  margin-bottom: 0.35em;
  font-size: 0.74em;
  color: #42566a;
}

.ip-slice-values span {
  padding: 0.28em 0;
  border: 2px solid #c9d5db;
  border-radius: 0.22em;
  background: #f6f8f9;
  font-weight: 600;
}

.ip-slice-values .ip-slice-picked {
  border-color: #107895;
  background: #dceff4;
  color: #164c61;
}

.ip-slice-values .ip-slice-stop { border-left: 4px solid #b04b37; }

.ip-slice-notes {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.25em;
  align-items: center;
  margin-top: 0.65em;
  font-size: 0.72em;
  text-align: center;
}

.ip-slice-start-note { grid-column: 2; color: #107895; }
.ip-slice-range { grid-column: 3 / 5; font-weight: 600; }
.ip-slice-end-note { grid-column: 5; color: #a33f2d; }

.ip-zip-stage {
  width: min(100%, 29em);
  margin: 1.2em auto;
}

.ip-zip-row {
  display: grid;
  grid-template-columns: 5em repeat(3, minmax(0, 1fr));
  gap: 0.3em;
  align-items: center;
  text-align: center;
  margin: 0.25em 0;
}

.ip-zip-label {
  padding-right: 0.4em;
  text-align: right;
  font-size: 0.7em;
  color: #42566a;
}

.ip-zip-names span:not(.ip-zip-label),
.ip-zip-scores span:not(.ip-zip-label) {
  padding: 0.15em 0;
  border-bottom: 2px solid #b7cbd3;
  font-weight: 600;
}

.ip-zip-scores .ip-zip-missing {
  border-bottom-style: dashed !important;
  color: #a33f2d;
  font-size: 0.72em;
}

.ip-zip-connectors {
  color: #b7cbd3;
  line-height: 0.9;
}

.ip-zip-results { min-height: 1.8em; }
.ip-zip-output,
.ip-zip-stop {
  white-space: nowrap;
  font-size: 0.73em;
  font-weight: 600;
}

.ip-zip-output { color: #164c61; }
.ip-zip-stop { color: #a33f2d; }

.ip-operation-overview {
  width: min(100%, 44em);
  margin: 1em auto;
  overflow-x: auto;
}

table.ip-operation-table {
  width: 100%;
  margin: 0;
  border: 1px solid #c8dce3;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 0.38em;
  background: #fff;
  overflow: hidden;
  table-layout: fixed;
  text-align: left;
}

table.ip-operation-table th:nth-child(1) { width: 49%; }
table.ip-operation-table th:nth-child(2) { width: 21%; }
table.ip-operation-table th:nth-child(3) { width: 30%; }

table.ip-operation-table thead th {
  padding: 0.52em 0.75em;
  border: 0;
  border-bottom: 2px solid #107895;
  background: #eaf5f8;
  color: #164c61;
  font-size: 0.82em;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

table.ip-operation-table tbody td {
  padding: 0.55em 0.75em;
  border: 0;
  border-bottom: 1px solid #e2eaee;
  line-height: 1.4;
  text-align: left;
  vertical-align: top;
}

table.ip-operation-table tbody tr:last-child td { border-bottom: 0; }
table.ip-operation-table tbody tr:nth-child(even) { background: #f6fafb; }
.ip-operation-table code { white-space: nowrap; }

.ip-flow-comparison,
.ip-plus-flow,
.ip-insert-flow,
.ip-delete-flow {
  width: min(100%, 43em);
  margin: 1.05em auto;
  color: #173b4a;
  font-size: 0.83em;
}

.ip-flow-case {
  padding: 0.65em 0.8em;
  border: 1px solid #c8dce3;
  border-radius: 0.38em;
  background: #f8fbfc;
}

.ip-flow-case + .ip-flow-case { margin-top: 0.5em; }

.ip-flow-heading {
  display: flex;
  align-items: baseline;
  gap: 0.7em;
  margin-bottom: 0.55em;
  font-size: 0.84em;
}

.ip-flow-heading code { font-weight: 700; }

.ip-flow-track {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.65fr);
  gap: 0.7em;
  align-items: center;
}

.ip-flow-array {
  display: inline-flex;
  align-items: stretch;
  justify-content: center;
  gap: 0.18em;
  width: max-content;
  max-width: 100%;
  padding: 0.14em;
  border: 2px solid #107895;
  border-radius: 0.3em;
  background: #dceff4;
  white-space: nowrap;
}

.ip-flow-array > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.22em 0.5em;
  border-radius: 0.18em;
  background: #fff;
  font-weight: 600;
}

.ip-flow-array .ip-flow-nested {
  gap: 0.16em;
  border: 2px solid #b04b37;
  background: #fff4ef;
  color: #813622;
}

.ip-flow-nested i {
  padding: 0.1em 0.3em;
  border: 1px solid #deb8aa;
  border-radius: 0.15em;
  background: #fff;
  font-style: normal;
}

.ip-flow-action,
.ip-plus-symbol,
.ip-insert-action,
.ip-delete-action {
  color: #42566a;
  font-size: 0.78em;
  text-align: center;
  white-space: nowrap;
}

.ip-flow-action b { color: #107895; font-size: 1.35em; }
.ip-flow-caption { color: #42566a; font-size: 0.76em; font-weight: 700; }

.ip-plus-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: center;
  gap: 0.48em;
}

.ip-plus-source,
.ip-plus-result {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.38em;
}

.ip-plus-result .ip-flow-array { border-color: #258467; background: #e3f4ed; }
.ip-plus-symbol { align-self: center; color: #107895; font-size: 1.25em; font-weight: 700; }
.ip-plus-note { flex-basis: 100%; margin-top: 0.45em; font-size: 0.75em; text-align: center; }

.ip-insert-flow { text-align: center; }
.ip-insert-flow .ip-flow-array { margin: 0.24em auto; }
.ip-insert-action { margin: 0.48em auto; }
.ip-flow-array > .ip-flow-accent { background: #d8f0e5; color: #1c654c; }

.ip-delete-flow { width: min(100%, 34em); }
.ip-delete-step {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.45em;
}

.ip-delete-label { width: 5.7em; color: #42566a; font-size: 0.78em; font-weight: 700; text-align: right; }
.ip-delete-step .ip-flow-array { font-size: 0.92em; }
.ip-delete-step .ip-flow-array > span { position: relative; padding-bottom: 0.54em; }
.ip-delete-step .ip-flow-array small { position: absolute; bottom: 0.1em; color: #687d88; font-size: 0.58em; }
.ip-delete-step .ip-flow-array > .ip-flow-target { background: #fff0ea; color: #8a3924; }
.ip-delete-action { display: flex; flex-direction: column; gap: 0.1em; margin: 0.4em 0 0.4em 5.7em; }
.ip-delete-action span { color: #a33f2d; }
.ip-delete-return { padding: 0.24em 0.5em; border-radius: 0.25em; background: #e3f4ed; font-size: 0.75em; }

.reveal table.ip-operation-table { font-size: 0.7em; }
.reveal .ip-flow-comparison,
.reveal .ip-plus-flow,
.reveal .ip-insert-flow,
.reveal .ip-delete-flow { font-size: 0.72em; }

@media (max-width: 700px) {
  .ip-flow-track { grid-template-columns: 1fr; justify-items: center; }
  .ip-flow-action { white-space: normal; }
  table.ip-operation-table { min-width: 34em; }
  .ip-delete-label { width: auto; }
  .ip-delete-action { margin-left: 0; }
}

.reveal .ip-zip-stage .highlight-current-blue.current-fragment { color: #107895; }
.reveal .ip-zip-stage .highlight-current-red.current-fragment { color: #a33f2d; }

@media (prefers-reduced-motion: reduce) {
  .reveal .ip-zip-output.fragment,
  .reveal .ip-zip-stop.fragment { transition: none !important; }
}
