/*
  06-bastions.css — v41.0 Bastion redesign
  Mobile-first presentation for the promoted Holdings area, shared Bastion
  progression, facilities, group turns, and the dedicated Bastion chart type.
*/

/* ---------- Holdings navigation and summary ---------- */
.holdings-title {
  align-items: flex-start;
  gap: var(--s3);
}
.holdings-title > div:first-child { min-width: 0; }
.holdings-title h2 { margin-bottom: 2px; }
.screen-intro {
  margin: 0;
  color: var(--muted);
  font-size: var(--t0);
  line-height: 1.4;
}
.holding-actions { flex: 0 0 auto; }
.holdings-metrics { margin-bottom: var(--s3); }
.holdings-tabs {
  margin: 0 0 var(--s4);
  padding-bottom: 2px;
}
.holdings-tabs .fchip { min-width: 108px; justify-content: center; }
.holding-section { min-width: 0; }
.holding-section .section-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--s2);
  margin: 0 2px var(--s2);
}
.holding-section .section-title h3 { margin: 0; }
.holding-section .section-title .hint { color: var(--muted); font-size: var(--t0); font-weight: 750; }

/* ---------- Shared level ---------- */
.bastion-level-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s3);
  margin-bottom: var(--s3);
  padding: 12px 13px;
  border: 1px solid color-mix(in srgb, var(--brass) 52%, var(--line));
  border-radius: var(--r-m);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--brass) 14%, var(--chart)) 0%, var(--chart) 72%);
  box-shadow: var(--e1);
}
.bastion-level-banner > div { min-width: 0; display: grid; gap: 1px; }
.bastion-level-banner span {
  color: var(--muted);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.bastion-level-banner b { color: var(--ink); font-size: var(--t2); }
.bastion-level-banner small { color: var(--ink-soft); line-height: 1.35; }
.bastion-level-emblem {
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, var(--brass) 58%, var(--line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--brass) 15%, var(--chart));
  color: var(--ink);
  font-size: .76rem;
  font-weight: 900;
  white-space: nowrap;
}
.bastion-level-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.bastion-level-option {
  position: relative;
  display: grid;
  gap: 3px;
  min-height: 74px;
  padding: 11px 12px 11px 40px;
  border: 1px solid var(--line);
  border-radius: var(--r-m);
  background: var(--chart);
  cursor: pointer;
}
.bastion-level-option input { position: absolute; left: 13px; top: 14px; width: 18px; height: 18px; }
.bastion-level-option b { font-size: var(--t1); }
.bastion-level-option span { color: var(--muted); font-size: var(--t0); }
.bastion-level-option:has(input:checked),
.bastion-level-option.is-current {
  border-color: color-mix(in srgb, var(--lagoon) 62%, var(--line));
  background: color-mix(in srgb, var(--lagoon) 9%, var(--chart));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--lagoon) 13%, transparent);
}

/* ---------- Bastion list cards ---------- */
.bastion-grid { align-items: start; }
.bastion-card {
  display: grid;
  gap: 10px;
  min-width: 0;
  overflow: hidden;
}
.bastion-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.bastion-card-head > div { min-width: 0; }
.bastion-card-metrics,
.bastion-link-strip,
.bastion-facility-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.bastion-card .island-chip,
.bastion-detail-card .island-chip {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bastion-card .island-chip.is-ready {
  border-color: color-mix(in srgb, var(--warn) 55%, var(--line));
  background: var(--warn-bg);
  color: #7b4208;
}
.bastion-link-strip { min-width: 0; }
.bastion-link-strip .holding-link-chip {
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  padding: 3px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.28);
  color: var(--ink-soft);
  font-size: .7rem;
  font-weight: 800;
}
.bastion-card .list-actions { margin-top: 0; }

/* ---------- Bastion detail ---------- */
.bastion-detail-card { display: grid; gap: 12px; }
.bastion-detail-card .ship-detail-head { align-items: flex-start; }
.bastion-primary-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 8px;
}
.bastion-primary-actions .button { width: 100%; }
.bastion-board { margin: 0; }
.bastion-facility-list { display: grid; gap: 7px; }
.bastion-facility-row,
.bastion-order-row,
.bastion-turn-history-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: var(--r-s);
  background: color-mix(in srgb, var(--chart-2) 54%, var(--chart));
}
button.bastion-facility-row,
button.bastion-turn-history-row {
  width: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.bastion-facility-row:hover,
.bastion-turn-history-row:hover { border-color: color-mix(in srgb, var(--lagoon) 45%, var(--line)); }
.bastion-facility-row > div,
.bastion-facility-row > span:first-child,
.bastion-order-row > div,
.bastion-turn-history-row > div { min-width: 0; display: grid; gap: 2px; }
.bastion-facility-row small,
.bastion-order-row small,
.bastion-turn-history-row small { color: var(--muted); line-height: 1.3; }
.bastion-facility-row.is-locked { opacity: .72; border-style: dashed; }
.bastion-facility-row.is-damaged { border-color: color-mix(in srgb, var(--danger) 42%, var(--line)); }
.bastion-order-row .button { flex: 0 0 auto; }
.bastion-order-end {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
}
.bastion-order-list { display: grid; gap: 7px; }
.bastion-defence-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.bastion-defence-grid > div {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: var(--r-s);
  background: var(--chart-2);
}
.bastion-defence-grid span { color: var(--muted); font-size: .7rem; font-weight: 800; }
.bastion-defence-grid b { min-width: 0; overflow-wrap: anywhere; }

/* ---------- Facility detail and catalogue ---------- */
.bastion-facility-detail { display: grid; gap: 13px; }
.bastion-facility-detail > header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}
.bastion-facility-detail > header > div { min-width: 0; }
.bastion-facility-detail h3,
.bastion-facility-detail h4 { margin: 0; }
.bastion-facility-detail p { margin: 0; line-height: 1.5; }
.bastion-facility-detail.is-locked { opacity: .82; }
.bastion-catalogue { display: grid; gap: 9px; }
.bastion-catalogue-tier { margin: 0; }
.bastion-facility-options { display: grid; gap: 8px; }
.bastion-facility-option {
  position: relative;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: flex-start;
  gap: 9px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--r-s);
  background: var(--chart);
  cursor: pointer;
}
.bastion-facility-option input { width: 18px; height: 18px; margin-top: 2px; }
.bastion-facility-option > span:nth-child(2) { min-width: 0; display: grid; gap: 3px; }
.bastion-facility-option small { color: var(--muted); line-height: 1.3; }
.bastion-facility-option em { color: var(--ink-soft); font-size: .78rem; font-style: normal; line-height: 1.35; }
.bastion-facility-option:has(input:checked) {
  border-color: color-mix(in srgb, var(--lagoon) 50%, var(--line));
  background: color-mix(in srgb, var(--lagoon) 7%, var(--chart));
}
.bastion-facility-option.is-locked { opacity: .72; border-style: dashed; }
.bastion-facility-counter {
  padding: 9px 11px;
  border: 1px solid color-mix(in srgb, var(--lagoon) 38%, var(--line));
  border-radius: var(--r-s);
  background: color-mix(in srgb, var(--lagoon) 8%, var(--chart));
  color: var(--lagoon-deep);
  font-weight: 850;
}
.bastion-facility-counter.is-over {
  border-color: color-mix(in srgb, var(--danger) 56%, var(--line));
  background: var(--danger-bg);
  color: var(--danger);
}

/* ---------- Group Bastion Turns ---------- */
.bastion-turn-actor-card,
.bastion-turn-detail-head {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid color-mix(in srgb, var(--lagoon) 36%, var(--line));
  border-radius: var(--r-m);
  background: color-mix(in srgb, var(--lagoon) 7%, var(--chart));
}
.bastion-turn-actor-card > span,
.bastion-turn-detail-head > div { min-width: 0; display: grid; gap: 2px; }
.bastion-turn-actor-card small,
.bastion-turn-detail-head small { color: var(--muted); line-height: 1.3; }
.bastion-turn-actor-card .secret-person-avatar,
.bastion-turn-detail-head .secret-person-avatar,
.bastion-turn-actor-card .cxn-face,
.bastion-turn-detail-head .cxn-face,
.bastion-turn-actor-card img,
.bastion-turn-detail-head img {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
}
.bastion-turn-sections { display: grid; gap: 9px; }
.bastion-turn-section { margin: 0; }
.bastion-maintain-option,
.bastion-turn-order {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 9px;
  align-items: flex-start;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--r-s);
  background: var(--chart);
  cursor: pointer;
}
.bastion-maintain-option { border-color: color-mix(in srgb, var(--brass) 42%, var(--line)); }
.bastion-maintain-option input,
.bastion-turn-order > input[type="checkbox"] { width: 18px; height: 18px; margin-top: 2px; }
.bastion-maintain-option span,
.bastion-turn-order span { min-width: 0; display: grid; gap: 3px; }
.bastion-maintain-option small,
.bastion-turn-order small { color: var(--muted); line-height: 1.35; }
.bastion-turn-orders { display: grid; gap: 8px; margin-top: 9px; }
.bastion-turn-order { grid-template-columns: 22px minmax(0, 1fr); }
.bastion-turn-order > input[type="text"] {
  grid-column: 2;
  width: 100%;
  min-width: 0;
  margin-top: 4px;
}
.bastion-turn-order:has(input[type="checkbox"]:checked) {
  border-color: color-mix(in srgb, var(--lagoon) 52%, var(--line));
  background: color-mix(in srgb, var(--lagoon) 7%, var(--chart));
}
.bastion-turn-orders.is-disabled { opacity: .48; filter: grayscale(.45); }
.bastion-turn-detail { display: grid; gap: 12px; }
.bastion-turn-detail-section {
  display: grid;
  gap: 8px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: var(--r-m);
  background: var(--chart);
}
.bastion-turn-detail-section h3 { margin: 0; font-size: var(--t1); }
.bastion-turn-event {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 10px;
  border: 1px solid color-mix(in srgb, var(--brass) 42%, var(--line));
  border-radius: var(--r-s);
  background: color-mix(in srgb, var(--brass) 8%, var(--chart));
}
.bastion-turn-event > div { min-width: 0; display: grid; gap: 2px; }
.bastion-turn-event small { color: var(--muted); line-height: 1.35; }

/* ---------- Bastion maps and marker taxonomy ---------- */
.bastion-map-card .map-card-thumb-empty svg {
  width: 44px;
  height: 44px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.pin-bastion-basic .map-pin-dot,
.map-list-dot.pin-bastion-basic,
.map-legend-dot.pin-bastion-basic { background: #728769; }
.pin-bastion-special .map-pin-dot,
.map-list-dot.pin-bastion-special,
.map-legend-dot.pin-bastion-special { background: #b37d20; }
.pin-bastion-defence .map-pin-dot,
.map-list-dot.pin-bastion-defence,
.map-legend-dot.pin-bastion-defence { background: #80543f; }
.pin-bastion-passage .map-pin-dot,
.map-list-dot.pin-bastion-passage,
.map-legend-dot.pin-bastion-passage { background: #47768b; }
.pin-bastion-feature .map-pin-dot,
.map-list-dot.pin-bastion-feature,
.map-legend-dot.pin-bastion-feature { background: #725385; }
.map-pin.pin-bastion-special .map-pin-dot { box-shadow: 0 0 0 2px rgba(255,240,188,.86), 0 2px 5px rgba(0,0,0,.65); }
.map-pin.pin-bastion-defence .map-pin-dot { border-radius: 4px; }
.map-pin.pin-bastion-passage .map-pin-dot { transform: rotate(45deg); border-radius: 3px; }

/* ---------- Responsive ---------- */
@media (min-width: 700px) {
  .bastion-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bastion-level-picker { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .bastion-defence-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .bastion-turn-sections { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
}

@media (max-width: 520px) {
  .holdings-title { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .holdings-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .holdings-metrics .metric { min-width: 0; padding-inline: 7px; }
  .holdings-metrics .metric .label,
  .holdings-metrics .metric .note { font-size: .64rem; }
  .holdings-metrics .metric .value { font-size: 1.18rem; }
  .bastion-primary-actions { grid-template-columns: 1fr; }
  .bastion-facility-option { grid-template-columns: 21px minmax(0, 1fr); }
  .bastion-facility-option > .chip { grid-column: 2; justify-self: start; }
  .bastion-turn-event { align-items: flex-start; flex-direction: column; }
  .bastion-turn-event .button { width: 100%; }
}

@media (max-width: 390px) {
  .holdings-title { grid-template-columns: 1fr; }
  .holding-actions .button { width: 100%; }
  .holdings-tabs .fchip { min-width: 96px; }
  .bastion-level-banner { align-items: flex-start; }
  .bastion-level-banner .button { flex: 0 0 auto; }
  .bastion-level-picker { grid-template-columns: 1fr; }
  .bastion-defence-grid { grid-template-columns: 1fr; }
  .bastion-facility-row,
  .bastion-order-row,
  .bastion-turn-history-row { align-items: flex-start; }
}

/* Repeatable facilities use a compact count field instead of a checkbox. */
.bastion-facility-option.is-repeatable {
  grid-template-columns: 54px minmax(0, 1fr) auto;
}
.bastion-facility-count {
  width: 52px;
  min-width: 0;
  min-height: 36px;
  padding: 5px 6px;
  text-align: center;
}
@media (max-width: 520px) {
  .bastion-facility-option.is-repeatable { grid-template-columns: 52px minmax(0, 1fr); }
  .bastion-facility-option.is-repeatable > .chip { grid-column: 2; }
}

/* ---------- v40.36 weekly Bastion cadence ---------- */
.bastion-schedule-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s3);
  margin: 0 0 var(--s3);
  padding: 12px 13px;
  border: 1px solid color-mix(in srgb, var(--lagoon) 38%, var(--line));
  border-radius: var(--r-m);
  background: color-mix(in srgb, var(--lagoon) 7%, var(--chart));
  box-shadow: var(--e1);
}
.bastion-schedule-banner.is-due {
  border-color: color-mix(in srgb, var(--brass) 58%, var(--line));
  background: color-mix(in srgb, var(--brass) 12%, var(--chart));
}
.bastion-schedule-banner > div:first-child {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.bastion-schedule-banner > div:first-child > span:first-child {
  color: var(--muted);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.bastion-schedule-banner b { color: var(--ink); font-size: var(--t2); }
.bastion-schedule-banner small { color: var(--ink-soft); line-height: 1.4; }
.bastion-schedule-actions { flex: 0 0 auto; }
.bastion-schedule-actions .button { min-width: 138px; }
/* v41: the event notice is a tappable pill, not a status label. Events are
   pre-rolled, so this only ever offers to open them — it never blocks a turn. */
.bastion-schedule-alert {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  width: fit-content;
  margin-top: 6px;
  padding: 4px 10px;
  border: 1px solid color-mix(in srgb, var(--warn) 52%, var(--line));
  border-radius: 999px;
  background: var(--warn-bg);
  color: #7b4208;
  font: inherit;
  font-size: .71rem;
  font-weight: 850;
  cursor: pointer;
}
.bastion-schedule-alert:hover { filter: brightness(1.05); }

/* v41: de-catalogued facilities, DM-visible only. */
.bastion-retired-note {
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px dashed var(--line-strong);
  border-radius: var(--r-s);
  background: rgba(0, 0, 0, .04);
  color: var(--muted);
  font-size: .74rem;
  line-height: 1.45;
}
.bastion-override-note {
  border-color: color-mix(in srgb, var(--warn) 52%, var(--line));
  background: var(--warn-bg);
}

/* ---------- v40.36 expanded facility catalogue ---------- */
.bastion-facility-option-tags {
  display: grid;
  justify-items: end;
  gap: 5px;
}
.bastion-facility-option[hidden],
.bastion-catalogue-tier[hidden] { display: none !important; }

@media (max-width: 640px) {
  .bastion-schedule-banner {
    align-items: stretch;
    flex-direction: column;
  }
  .bastion-schedule-actions,
  .bastion-schedule-actions .button { width: 100%; }
  .bastion-facility-option {
    grid-template-columns: 22px minmax(0, 1fr);
  }
  .bastion-facility-option-tags {
    grid-column: 2;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
}