/* Windows & Entra Event Explorer. Uses --bulma-* variables so it follows light and dark mode. */

#event-explorer.is-loading .ee-layout { opacity: .4; pointer-events: none; }

.ee-searchbar { position: relative; }
.ee-searchbar .input { padding-left: 2.75rem; padding-right: 2.75rem; height: 3.5rem; font-size: 1.15rem; }
.ee-searchbar .ee-search-icon {
  position: absolute; left: 1rem; top: 50%; transform: translateY(-50%);
  color: var(--bulma-text-weak); pointer-events: none; z-index: 4;
}
.ee-searchbar .ee-clear { position: absolute; right: .6rem; top: 50%; transform: translateY(-50%); }
.ee-searchbar .ee-clear[hidden] { display: none; }
.ee-searchbar .ee-clear { z-index: 4; }
.ee-hint { color: var(--bulma-text-weak); font-size: .85rem; }
.ee-hint kbd {
  background: var(--bulma-scheme-main-ter); border: 1px solid var(--bulma-border);
  border-radius: 4px; padding: 0 .35rem; font-size: .8rem;
}

.ee-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-bottom: 1.25rem; }
.ee-count { margin-left: auto; color: var(--bulma-text-weak); font-size: .9rem; }

.ee-tabs { margin: 1.25rem 0 0; }
.ee-tab {
  background: none; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px;
  color: var(--bulma-text-weak); cursor: pointer; font: inherit; padding: .5rem 1rem;
}
.ee-tabs li.is-active .ee-tab { color: var(--bulma-primary); border-bottom-color: var(--bulma-primary); font-weight: 600; }
.ee-tab:hover { color: var(--bulma-text); }
.ee-tab:focus-visible { outline: 2px solid var(--bulma-primary); outline-offset: -2px; }
.ee-panel[hidden] { display: none; }
.ee-panel > .ee-section:first-child { margin-top: 1.25rem; }
.ee-panel > .ee-fields, .ee-panel > .ee-steps { margin-top: 1.25rem; }

.ee-layout { display: grid; grid-template-columns: 1fr; gap: 1.5rem; transition: opacity .15s; }
@media (min-width: 1024px) {
  .ee-layout { grid-template-columns: minmax(300px, 5fr) 7fr; align-items: start; }
  .ee-list-pane { position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; }
  .ee-back { display: none; }
}

.ee-list { list-style: none; margin: 0; padding: 0; }
.ee-list li + li { margin-top: .5rem; }
.ee-item {
  width: 100%; text-align: left; cursor: pointer; font: inherit; color: var(--bulma-text);
  background: var(--bulma-scheme-main); border: 1px solid var(--bulma-border);
  border-radius: 8px; padding: .75rem .9rem; transition: border-color .12s, box-shadow .12s;
}
.ee-item:hover { border-color: var(--bulma-primary); }
.ee-item.is-selected { border-color: var(--bulma-primary); box-shadow: inset 4px 0 0 var(--bulma-primary); background: var(--bulma-scheme-main-bis); }
.ee-item:focus-visible, .ee-pre:focus-visible { outline: 2px solid var(--bulma-primary); outline-offset: 2px; }
.ee-item-top { display: flex; align-items: center; gap: .5rem; margin-bottom: .25rem; }
.ee-item-category { font-size: .8rem; color: var(--bulma-text-weak); }
.ee-item-code { font-family: var(--bulma-family-code, monospace); font-weight: 700; overflow-wrap: anywhere; }
.ee-item-title { font-size: .95rem; color: var(--bulma-text-weak); }

.ee-platform-windows { background: #0b5ea8; color: #fff; }
.ee-platform-entra { background: #5c2d91; color: #fff; }
.ee-tag { background: var(--bulma-scheme-main-ter); color: var(--bulma-text); border: 1px solid var(--bulma-border); }
.ee-tag-link { color: var(--bulma-link); text-decoration: none; }
.ee-tag-link:hover { border-color: var(--bulma-link); color: var(--bulma-link); }
.ee-header-text { max-width: 48rem; }

.ee-detail-pane {
  background: var(--bulma-scheme-main); border: 1px solid var(--bulma-border);
  border-radius: 10px; padding: 1.5rem; min-width: 0;
}
.ee-heading { overflow-wrap: anywhere; font-family: var(--bulma-family-code, monospace); }
.ee-section { margin-top: 1.75rem; }
.ee-fields { display: grid; grid-template-columns: 1fr; gap: .15rem 1rem; }
.ee-fields dt { font-weight: 700; font-family: var(--bulma-family-code, monospace); font-size: .9rem; margin-top: .6rem; overflow-wrap: anywhere; }
.ee-fields dd { margin: 0; }
@media (min-width: 769px) {
  .ee-fields { grid-template-columns: minmax(150px, 1fr) 3fr; }
  .ee-fields dt, .ee-fields dd { margin-top: .5rem; }
}
.ee-steps { margin-left: 1.25rem; list-style: disc; }
.ee-steps li + li { margin-top: .35rem; }

.ee-code { border: 1px solid var(--bulma-border); border-radius: 8px; overflow: hidden; }
.ee-code-bar {
  display: flex; justify-content: space-between; align-items: center; gap: .75rem;
  padding: .4rem .75rem; background: var(--bulma-scheme-main-ter); border-bottom: 1px solid var(--bulma-border);
}
.ee-code-title { font-size: .85rem; font-weight: 600; }
.ee-pre {
  margin: 0; padding: .9rem 1rem; max-height: 22rem; overflow: auto;
  background: var(--bulma-scheme-main-bis); color: var(--bulma-text);
  font-size: .82rem; line-height: 1.5; white-space: pre;
}

.ee-cta {
  margin-top: 2rem; padding: 1.25rem; border-radius: 8px;
  border: 1px solid var(--bulma-primary); background: var(--bulma-scheme-main-bis);
}

.ee-placeholder { text-align: center; padding: 3rem 1rem; color: var(--bulma-text-weak); }
@media (max-width: 768px) {
  .ee-heading { font-size: 1.35rem; }
}
.ee-ref-note { margin-top: 1.5rem; color: var(--bulma-text-weak); font-size: .9rem; }