/* Orbital · Arte decorativo local. Los mapas y los visores siguen siendo calculados.
   Se carga al final para que abrir o pasar el ratón no borre la ilustración. */
body.orbital-theme {
  --art-worlds: url('../assets/orbital-paneles/mundos.png');
  --art-terrain: url('../assets/orbital-paneles/relieve.png');
  --art-learning: url('../assets/orbital-paneles/aprendizaje.png');
  --art-stars: url('../assets/orbital-paneles/estrellas.png');
  --art-instruments: url('../assets/orbital-paneles/instrumentos.png');
}

#bodies-panel > summary,
#worlds-panel > .worlds-discovery > summary,
#comparison-panel > .comparison-card > summary {
  --panel-art: var(--art-worlds);
  --art-size: auto 170%;
  --art-position: right 48px top 43%;
}
#tour-panel > summary, #saved-panel > summary {
  --panel-art: var(--art-learning);
  --art-position: right 48px top 62%;
}
#terrain-workshop > summary, #walking-panel > summary {
  --panel-art: var(--art-terrain);
  --art-size: auto 220%;
}
#constellation-panel > summary, #calendar-panel > summary,
#tonight-view > .tonight-panel > summary {
  --panel-art: var(--art-stars);
  --art-size: auto 250%;
}
#advanced-hub > summary,
#photography-options > .photography-details > summary,
#inspector-panel > summary {
  --panel-art: var(--art-instruments);
  --art-size: auto 175%;
}

/* Cada acceso principal tiene su imagen; los subdetalles técnicos son más sobrios.
   El visor puede moverse a las lecciones: nunca hereda estos estilos de ventana. */
body.orbital-theme #activity-hub details:not(#observatory-stage details) {
  background: linear-gradient(150deg, #122127, #0e181e 65%);
  border-color: #43575d;
  border-radius: 10px;
  box-shadow: 0 5px 16px #0003, inset 0 1px 0 #dae7de08;
}
body.orbital-theme #activity-hub :is(
  #bodies-panel, #tour-panel, #terrain-workshop, #constellation-panel,
  #walking-panel, #calendar-panel, #saved-panel, #advanced-hub,
  #worlds-panel > .worlds-discovery, #comparison-panel > .comparison-card,
  #tonight-view > .tonight-panel, #photography-options > .photography-details,
  #inspector-panel
):not(#observatory-stage details) > summary {
  --header-glaze: #243b43;
  min-height: 84px;
  box-sizing: border-box;
  padding: 16px 20px;
  gap: 15px;
  background-color: #121d23;
  background-image:
    linear-gradient(90deg, var(--header-glaze) 0%, #1b3038 calc(100% - 420px), #16272eee calc(100% - 290px), #13242b22 calc(100% - 160px), #101d2433 calc(100% - 65px), #14242b 100%),
    var(--panel-art);
  background-size: 100% 100%, var(--art-size, auto 190%);
  background-position: center, var(--art-position, right 48px center);
  background-repeat: no-repeat;
  border-radius: 9px;
  border-bottom: 1px solid transparent;
  box-shadow: inset 0 1px 0 #e4efd714;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
body.orbital-theme #activity-hub :is(
  #bodies-panel, #tour-panel, #terrain-workshop, #constellation-panel,
  #walking-panel, #calendar-panel, #saved-panel, #advanced-hub,
  #worlds-panel > .worlds-discovery, #comparison-panel > .comparison-card,
  #tonight-view > .tonight-panel, #photography-options > .photography-details,
  #inspector-panel
):not(#observatory-stage details) > summary:hover {
  --header-glaze: #2c4650;
  box-shadow: inset 0 0 0 1px #d7b4779c, inset 0 1px 0 #fff2;
}
body.orbital-theme #activity-hub :is(
  #bodies-panel, #tour-panel, #terrain-workshop, #constellation-panel,
  #walking-panel, #calendar-panel, #saved-panel, #advanced-hub,
  #worlds-panel > .worlds-discovery, #comparison-panel > .comparison-card,
  #tonight-view > .tonight-panel, #photography-options > .photography-details,
  #inspector-panel
):not(#observatory-stage details)[open] > summary {
  --header-glaze: #304950;
  border-radius: 9px 9px 0 0;
  border-bottom-color: #b59460;
  box-shadow: inset 3px 0 0 #edc786, inset 0 1px 0 #fff2;
}
body.orbital-theme #activity-hub details:not(#observatory-stage details) > summary strong {
  font-size: 14px;
  font-weight: 650;
  color: #f6f2e9;
  text-shadow: 0 2px 7px #000a;
}
body.orbital-theme #activity-hub details:not(#observatory-stage details) > summary small {
  color: #c2d2d5;
  font-size: 12px;
  text-shadow: 0 1px 4px #000;
}
body.orbital-theme #activity-hub details:not(#observatory-stage details) > summary::after {
  display: grid;
  place-items: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border: 1px solid #b99a635c;
  border-radius: 7px;
  background: linear-gradient(#243238e8, #111d24f2);
  box-shadow: inset 0 1px 0 #ffffff0d;
  font-size: 20px;
  color: #f3d8a6;
}
/* Las cabeceras de las familias se distinguen del nivel principal sin ocupar más. */
body.orbital-theme #activity-hub .worlds-groups details:not(#observatory-stage details) > summary {
  background: linear-gradient(110deg, #294047, #1b2e36);
  border-radius: 9px;
}
body.orbital-theme #activity-hub .worlds-groups details:not(#observatory-stage details)[open] > summary {
  background: linear-gradient(110deg, #34505a, #243b43);
  border-radius: 9px 9px 0 0;
}
body.orbital-theme #activity-hub .worlds-groups details:not(#observatory-stage details) > summary:hover {
  background: linear-gradient(110deg, #3a535b, #293f46);
}

/* Entrada a las actividades, con su botón Abrir / Cerrar siempre a la vista. */
body.orbital-theme #activity-hub {
  border-color: #806d4f;
  border-radius: 12px;
  background: #0b1419;
  box-shadow: 0 10px 32px #0003;
}
body.orbital-theme #activity-hub > summary {
  min-height: 96px;
  border-radius: 11px;
  background: linear-gradient(100deg, #343a31, #1a2b30e8 48%, #14232b55),
    var(--art-stars) right center / auto 300% no-repeat #111c23;
  box-shadow: inset 0 1px 0 #fce1a824;
}
body.orbital-theme #activity-hub[open] > summary {
  border-radius: 11px 11px 0 0;
}
body.orbital-theme #activity-hub > summary:hover {
  box-shadow: inset 0 0 0 1px #e2bc7aa8;
}
body.orbital-theme #activity-hub .activity-expand {
  background: linear-gradient(150deg, #605034, #2b2e2a);
  border-color: #a78d62;
  box-shadow: inset 0 1px 0 #fce0a738, 0 3px 10px #0004;
  color: #ffdfaa;
}
body.orbital-theme .activity-list { gap: 12px; }

/* Material de los botones: contorno, brillo superior y respuesta táctil.
   No cambia tamaños de controles ni estilos de etiquetas dentro del canvas. */
body.orbital-theme #activity-hub button:not(#observatory-stage button):not(.calendar-event-button):not([data-event-type]),
body.orbital-theme :is(.scale-actions, .time-buttons, .time-primary, .audio-controls) .button,
body.orbital-theme :is(#about-button, #immersive-toggle, .discovery-launch) {
  background: linear-gradient(155deg, #2b4148, #19292f 64%, #17252b);
  border-color: #586b6b;
  border-radius: 8px;
  color: #ecf0ec;
  box-shadow: inset 0 1px 0 #e4ede71c, 0 3px 7px #0003;
  transition: border-color 140ms ease, box-shadow 140ms ease, filter 140ms ease;
}
body.orbital-theme #activity-hub button:not(#observatory-stage button):not(.calendar-event-button):not([data-event-type]):hover:not(:disabled),
body.orbital-theme :is(.scale-actions, .time-buttons, .time-primary, .audio-controls) .button:hover:not(:disabled),
body.orbital-theme :is(#about-button, #immersive-toggle, .discovery-launch):hover:not(:disabled) {
  border-color: #d8bc86;
  box-shadow: inset 0 1px 0 #f0e6cf33, 0 3px 12px #0004;
  filter: brightness(1.12);
}
body.orbital-theme #activity-hub button:is(.primary, [aria-pressed='true'], .selected):not(#observatory-stage button):not(.calendar-event-button):not([data-event-type]),
body.orbital-theme .scale-actions .button[aria-pressed='true'] {
  background: linear-gradient(145deg, #65553a, #32372f);
  border-color: #d1ae71;
  color: #ffe2ae;
  box-shadow: inset 0 1px 0 #ffe8b833, inset 0 -2px 0 #d9b87766;
}
body.orbital-theme .time-buttons #live-button {
  background: linear-gradient(145deg, #ffdda1, #dca954);
  border-color: #f2cf90;
  color: #1d241f;
  box-shadow: inset 0 1px 0 #fff6, 0 3px 12px #d9ae5822;
}
body.orbital-theme #activity-hub button:not(#observatory-stage button):disabled {
  opacity: .42;
  box-shadow: none;
  cursor: not-allowed;
  filter: saturate(.35);
}
body.orbital-theme #activity-hub button:not(#observatory-stage button):active:not(:disabled) {
  box-shadow: inset 0 2px 5px #0006;
}
body.orbital-theme #activity-hub :is(button, summary, select):not(#observatory-stage *):focus-visible {
  outline: 3px solid #f6d9a0;
  outline-offset: 3px;
}
body.orbital-theme .view-toolbar .explore-actions > button,
body.orbital-theme .view-toolbar #destination-menu-toggle {
  border-radius: 8px 8px 3px 3px;
  background: linear-gradient(155deg, #1a2a2fb3, #0e181c44);
  box-shadow: inset 0 1px 0 #d4dfcf0d;
}
body.orbital-theme .view-toolbar .explore-actions > button:hover,
body.orbital-theme .view-toolbar #destination-menu-toggle:hover {
  background: linear-gradient(155deg, #314247, #17272b);
}
body.orbital-theme .view-toolbar .explore-actions > button.selected,
body.orbital-theme .view-toolbar #destination-menu-toggle.selected {
  background: linear-gradient(135deg, #45443699, #17272b);
  box-shadow: inset 0 1px 0 #e6c38a36;
}
/* Mantener el acceso compacto cuando el visor está dentro de una actividad. */
body.orbital-theme #observatory-stage .discovery-launch {
  min-height: 42px;
  padding: 10px 14px;
  border-radius: 8px;
  background: linear-gradient(150deg, #2a4148ed, #14252bed);
  border-color: #ad976b;
  color: #f3d7a4;
  box-shadow: inset 0 1px 0 #ffffff14, 0 3px 12px #0004;
}

/* La ficha de curiosidades conserva su imagen científica y gana un marco propio. */
body.orbital-theme .discovery-dialog {
  border-color: #c7aa74;
  box-shadow: 0 25px 95px #000b, inset 0 0 0 1px #ffe6ba14;
}
body.orbital-theme .discovery-dialog > .discovery-dialog-heading {
  min-height: 58px;
  background: linear-gradient(100deg, #30434a, #1a2a32e6 57%, #11212b66),
    var(--art-stars) right center / auto 360% no-repeat #14232a;
  border-bottom-color: #ad905f;
  box-shadow: inset 0 1px 0 #f3e0b924;
}
body.orbital-theme #discovery-dialog .discovery-dialog-heading button {
  background: linear-gradient(#35464a, #1b2a30);
  border-color: #9b916f;
  box-shadow: inset 0 1px 0 #fff2;
}
body.orbital-theme .discovery-dialog .discovery-curiosities article {
  background: linear-gradient(145deg, #273d43, #17262e);
  border-color: #4f6468;
  box-shadow: inset 0 1px 0 #e7e5cd14, 0 4px 10px #0002;
}
body.orbital-theme #discovery-dialog footer button {
  background: linear-gradient(145deg, #ffe0a7, #d5a557);
  color: #19231f;
  border-color: #f1d299;
  box-shadow: inset 0 1px 0 #fff6, 0 3px 9px #0004;
}
body.orbital-theme #discovery-dialog footer button:hover {
  background: linear-gradient(145deg, #ffe7bc, #edbd6c);
}

@media (max-width: 600px) {
  body.orbital-theme #activity-hub :is(
    #bodies-panel, #tour-panel, #terrain-workshop, #constellation-panel,
    #walking-panel, #calendar-panel, #saved-panel, #advanced-hub,
    #worlds-panel > .worlds-discovery, #comparison-panel > .comparison-card,
    #tonight-view > .tonight-panel, #photography-options > .photography-details,
    #inspector-panel
  ):not(#observatory-stage details) > summary {
    min-height: 86px;
    padding: 13px 12px;
    gap: 10px;
    background-image: linear-gradient(90deg, var(--header-glaze) 0%, #20353df5 46%, #14252b9c), var(--panel-art);
    background-position: center, right 15px center;
  }
  body.orbital-theme #activity-hub details:not(#observatory-stage details) > summary strong { font-size: 13px; }
  body.orbital-theme #activity-hub details:not(#observatory-stage details) > summary small { font-size: 11px; }
  body.orbital-theme #activity-hub > summary { padding: 16px 12px; gap: 10px; }
  body.orbital-theme #activity-hub > summary strong { font-size: 18px; }
  body.orbital-theme #activity-hub .activity-expand { padding: 9px; gap: 5px; }
}
@container (max-width: 600px) {
  body.orbital-theme #observatory-stage .discovery-launch:not(.discovery-sky-launch) {
    padding: 8px 10px;
    font-size: 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.orbital-theme #activity-hub :is(summary, button),
  body.orbital-theme .view-toolbar button { transition: none; }
}
