/* Affilora — ROR autocomplete styles */
.affilora-wrap { position: relative; }
.affilora-dropdown {
    position: absolute; top: 100%; left: 0; right: 0; z-index: 9999;
    margin: 0; padding: 0; list-style: none;
    max-height: 280px; overflow-y: auto;
    background: #fff; border: 1px solid #dbe3ee; border-top: none;
    border-radius: 0 0 8px 8px; box-shadow: 0 8px 24px rgba(15,23,42,0.12);
}
.affilora-dropdown:empty { display: none; }
.affilora-item {
    padding: 10px 14px; cursor: pointer; font-size: 13px; line-height: 1.5;
    border-bottom: 1px solid #f1f5f9;
}
.affilora-item:hover { background: #f0fdf4; }
.affilora-item strong { color: #1e293b; }
.affilora-country { color: #64748b; font-size: 12px; }
.affilora-ror { color: #047857; font-family: monospace; font-size: 11px; }

/* Public article page badge */
.affilora-badges { margin: 0.75rem 0; }
.affilora-badge { display: inline-flex; align-items: center; margin: 0.25rem 0.5rem 0.25rem 0; }
.affilora-link {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 10px; border-radius: 999px;
    background: #f0fdf4; border: 1px solid #bbf7d0;
    color: #166534; font-size: 12px; font-weight: 600;
    text-decoration: none; transition: background 150ms;
}
.affilora-link:hover { background: #dcfce7; }
.affilora-icon { width: 14px; height: 14px; }

/* Keyboard active state */
.affilora-item--active { background: #ecfdf5; outline: 2px solid #047857; outline-offset: -2px; }

/* Dashboard */
.affilora-page { max-width: 78rem; margin: 0 auto; padding: 1.5rem; box-sizing: border-box; }
.affilora-page *, .affilora-page *::before, .affilora-page *::after { box-sizing: border-box; }
.affilora-page h1 { display: flex; align-items: center; flex-wrap: wrap; gap: 0.75rem; font-size: 1.75rem; font-weight: 750; color: #1e293b; margin: 0 0 1rem; }
.affilora-version-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.3rem 0.7rem;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #f1f5f9;
    color: #0f172a;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.affilora-toolbar { display: flex; gap: 0.75rem; margin-bottom: 1.5rem; }
.affilora-section { margin-bottom: 1.5rem; padding: 1.5rem; border: 1px solid #dbe3ee; border-radius: 0.875rem; background: #fff; }
.affilora-section h2 { font-size: 1.125rem; font-weight: 700; margin: 0 0 1rem; color: #1e293b; }
.affilora-hint { font-size: 0.8125rem; color: #526578; margin: 0 0 1rem; line-height: 1.6; }
/* Sized against the space actually available rather than the viewport: inside
   the OJS admin panel the sidebar takes roughly 400px, so a 1024px window leaves
   a content column too narrow for four fixed columns and the page ran off to the
   right. auto-fit reflows on the real width, with no breakpoint to get wrong. */
.affilora-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)); gap: 0.875rem; margin-top: 1rem; }
.affilora-stat { padding: 1rem; border: 1px solid #dbe3ee; border-radius: 0.75rem; }
.affilora-stat-ror { border-color: #bbf7d0; background: #f0fdf4; }
.affilora-stat-num { display: block; font-size: 2rem; font-weight: 800; color: #1e293b; }
.affilora-stat-label { display: block; font-size: 0.8125rem; color: #526578; margin-top: 0.25rem; }
.affilora-stats-section { border-top: 4px solid #047857; }
/* A table of institution names and ROR links cannot shrink below a readable
   width, so it scrolls sideways inside its own box instead of pushing the page
   wider. min-width keeps the columns legible while it scrolls. */
.affilora-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-top: 1rem; }
.affilora-table { width: 100%; min-width: 34rem; border-collapse: separate; border-spacing: 0; border: 1px solid #dbe3ee; border-radius: 0.75rem; overflow: hidden; font-size: 0.8125rem; }
.affilora-table th, .affilora-table td { padding: 0.75rem; border-bottom: 1px solid #e5ebf2; text-align: left; vertical-align: middle; }
.affilora-table th { background: #f8fafc; font-weight: 700; font-size: 0.75rem; color: #3b4b60; }
.affilora-table tbody tr:hover { background: #f0fdf4; }
.affilora-ror-link { color: #047857; font-family: monospace; font-size: 0.6875rem; }
.affilora-btn-secondary { border: 1px solid #cbd5e1; background: #fff; color: #1e293b; padding: 0.5rem 0.875rem; border-radius: 0.5rem; font-size: 0.8125rem; font-weight: 600; text-decoration: none; }
.affilora-btn-secondary:hover { border-color: #047857; color: #047857; }
.affilora-btn-save { background: #047857; color: #fff; border: none; padding: 0.4rem 0.75rem; border-radius: 0.375rem; font-size: 0.75rem; cursor: pointer; }
.affilora-btn-delete { background: #dc2626; color: #fff; border: none; padding: 0.3rem 0.5rem; border-radius: 0.375rem; font-size: 0.875rem; cursor: pointer; }
.affilora-map-form { display: flex; gap: 0.375rem; align-items: center; }
.affilora-home { border-color: #bbf7d0; background: linear-gradient(180deg, #f0fdf4, #fff); }
.affilora-suggest { border-color: #bbf7d0; }
.affilora-home-list { margin: 0; padding-left: 1.2rem; color: #166534; font-size: 0.875rem; line-height: 1.6; }
.affilora-filter { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; margin: 0 0 1rem; }
.affilora-filter input[type="number"] { min-height: 2.4rem; padding: 0.35rem 0.6rem; border: 1px solid #cbd5e1; border-radius: 0.5rem; }
.affilora-map-input { flex: 1; min-height: 2rem; padding: 0.375rem 0.5rem; border: 1px solid #cbd5e1; border-radius: 0.375rem; font-size: 0.8125rem; }
.affilora-empty { text-align: center; padding: 2rem; color: #526578; }
.affilora-duplicates { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 0.75rem; }
.affilora-dup-group { display: flex; flex-wrap: wrap; gap: 0.375rem; padding: 0.625rem; border: 1px solid #fde68a; border-radius: 0.5rem; background: #fffbeb; }
.affilora-dup-item { padding: 0.25rem 0.5rem; background: #fff; border: 1px solid #e5ebf2; border-radius: 0.25rem; font-size: 0.75rem; }

@media (max-width: 42rem) {
    .affilora-page { padding: 1rem; }
    .affilora-map-form { flex-wrap: wrap; }
}
