/*
 * OWS Dashboard 3.10.96.0
 * Frontend Editorial Team layout correction
 *
 * Built specifically against the journal public stylesheet rules:
 *   .container_editor
 *   .grid_section
 *   .card_section
 *   .card_item
 *   .Editrial_B
 *
 * Scope is deliberately limited to .container_editor so unrelated
 * frontend pages/components remain untouched.
 */

/* ---------------------------------------------------------------
 * Root editorial container
 * Existing public CSS:
 *   .container_editor { max-width:1330px; margin:3rem 1rem; }
 * --------------------------------------------------------------- */
.container_editor {
    width: 100% !important;
    max-width: 1330px !important;
    margin: 3rem auto !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
    clear: both !important;
}

/* ---------------------------------------------------------------
 * LEGACY Editorial Team structure
 *
 * Existing public CSS makes .grid_section a CSS Grid:
 *   display:grid;
 *   grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
 *
 * Keep Grid, but make it deterministic and responsive.
 * --------------------------------------------------------------- */
.container_editor > .grid_section,
.container_editor .grid_section:not(.ows_editorial_section_grid) {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    align-items: stretch !important;
    gap: 32px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
}

/*
 * THIS IS THE IMPORTANT FIX FOR THE CURRENT LEGACY HTML:
 *
 * .Editrial_B is a direct child of .grid_section.
 * Without grid-column it occupies only one grid cell, which allows
 * the next editor card to sit beside the heading.
 *
 * Force every section heading to span the entire grid.
 */
.container_editor .grid_section > .Editrial_B,
.container_editor .Editrial_B {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    display: block !important;
    float: none !important;
    clear: both !important;
    position: static !important;
    margin: 12px 0 4px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    text-align: center !important;
}

.container_editor .Editrial_B h2 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 10px 0 12px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #333 !important;
    border-bottom: 2px solid #000 !important;
}

/*
 * The public CSS currently forces this to width:810px.
 * Make it responsive so it cannot overflow or distort a section.
 */
.container_editor .Editrial_B hr {
    display: block !important;
    width: min(810px, 100%) !important;
    max-width: 100% !important;
    height: 2px !important;
    margin: 18px auto 4px !important;
    padding: 0 !important;
    border: 0 !important;
    background: #000 !important;
    border-radius: 5px !important;
    clear: both !important;
}

/* Cards remain normal Grid items. */
.container_editor .grid_section > .card_section {
    grid-column: auto !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    float: none !important;
    position: relative !important;
    box-sizing: border-box !important;
}

/* Preserve existing card appearance but avoid fixed-layout overflow. */
.container_editor .card_item {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* ---------------------------------------------------------------
 * NEW Manager structure (3.10.93+)
 * Each section owns its own card container.
 * --------------------------------------------------------------- */
.container_editor.ows_editorial_team,
.container_editor .ows_editorial_section {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    clear: both !important;
    float: none !important;
    box-sizing: border-box !important;
}

.container_editor .ows_editorial_section {
    margin: 0 0 20px !important;
    padding: 0 !important;
}

/* The new section heading is always full-width above its cards. */
.container_editor .ows_editorial_section > .ows_editorial_section_title {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    clear: both !important;
    float: none !important;
    position: static !important;
    margin: 0 0 14px !important;
    box-sizing: border-box !important;
}

/*
 * New generated sections may retain the legacy .grid_section class.
 * Override the legacy public grid only inside the new section wrapper.
 */
.container_editor .ows_editorial_section > .ows_editorial_section_grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    align-items: stretch !important;
    justify-items: stretch !important;
    gap: 32px !important;
    width: 100% !important;
    max-width: 100% !important;
    clear: both !important;
    float: none !important;
    position: static !important;
    margin: 0 !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
}

.container_editor .ows_editorial_section_grid > .ows_editorial_card,
.container_editor .ows_editorial_section_grid > .card_section {
    display: block !important;
    grid-column: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    float: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* Empty/clear helper must never become a visible grid cell. */
.container_editor .ows_editorial_clear {
    display: none !important;
}

/* ---------------------------------------------------------------
 * Responsive behavior
 * --------------------------------------------------------------- */
@media (max-width: 760px) {
    .container_editor {
        margin: 2rem auto !important;
        padding: 0 10px !important;
    }

    .container_editor > .grid_section,
    .container_editor .grid_section:not(.ows_editorial_section_grid),
    .container_editor .ows_editorial_section > .ows_editorial_section_grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        padding: 0 !important;
    }

    .container_editor .Editrial_B h2 {
        font-size: 21px !important;
    }
}

/* ---------------------------------------------------------------
 * OWS Dashboard 3.10.99.0 - Compact horizontal editorial member rows
 * --------------------------------------------------------------- */
.container_editor .ows_editorial_section > .ows_editorial_section_grid {
    display: block !important;
    padding: 0 !important;
}

.container_editor .ows_editorial_section_grid > .ows_editorial_card,
.container_editor .ows_editorial_section_grid > .card_section.ows_editorial_card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

/* Neutralize legacy theme/card dimensions which previously produced very tall editor boxes. */
.container_editor .ows_editorial_card > .card_item,
.container_editor .ows_editorial_card > .card_search,
.container_editor .ows_editorial_card .ows_editorial_card_row {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
}

.container_editor .ows_editorial_card_row {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 22px !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 10px 12px !important;
    border: 1px solid #e0e6ed !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
    text-align: left !important;
}

.container_editor .ows_editorial_photo {
    flex: 0 0 100px !important;
    width: 100px !important;
    height: 128px !important;
    min-width: 100px !important;
    min-height: 128px !important;
    max-width: 100px !important;
    max-height: 128px !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 1px solid #dce3eb !important;
    border-radius: 8px !important;
    background: #f2f5f8 !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.container_editor .ows_editorial_photo img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center top !important;
    margin: 0 !important;
}

.container_editor .ows_editorial_photo_placeholder {
    font-size: 34px !important;
    font-weight: 700 !important;
    color: #7d8b9c !important;
}

.container_editor .ows_editorial_card_content {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
    padding: 2px 0 0 !important;
    text-align: left !important;
}

.container_editor .ows_editorial_card_content h4 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 18px !important;
    line-height: 1.35 !important;
}

.container_editor .ows_editorial_card_content h4 a {
    text-decoration: none !important;
}

.container_editor .ows_editorial_role {
    margin-top: 4px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #52657a !important;
}

.container_editor .ows_editorial_affiliation {
    margin: 7px 0 0 !important;
    color: #5f6f80 !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
}

.container_editor .ows_editorial_meta_links {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 8px 0 0 !important;
}

.container_editor .ows_editorial_meta_link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-height: 30px !important;
    padding: 5px 9px !important;
    border: 1px solid #dbe3ec !important;
    border-radius: 7px !important;
    background: #f8fafc !important;
    color: #34495e !important;
    text-decoration: none !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

.container_editor .ows_editorial_meta_link:hover,
.container_editor .ows_editorial_meta_link:focus {
    border-color: #aebdcd !important;
    background: #f2f6fa !important;
    text-decoration: none !important;
}

.container_editor .ows_editorial_meta_link svg {
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
}

.container_editor .ows_editorial_meta_link--orcid {
    color: #5b7f18 !important;
}

.container_editor .ows_editorial_meta_link--scholar {
    color: #345f9f !important;
}

.container_editor .ows_editorial_meta_link--email {
    color: #425c75 !important;
}

.container_editor .ows_editorial_meta_link--scopus {
    color: #b45f16 !important;
}

.container_editor .ows_editorial_more {
    margin-top: 7px !important;
}

.container_editor .ows_editorial_more > summary {
    display: inline-flex !important;
    align-items: center !important;
    cursor: pointer !important;
    color: #315d8c !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    list-style: none !important;
    user-select: none !important;
}

.container_editor .ows_editorial_more > summary::-webkit-details-marker {
    display: none !important;
}

.container_editor .ows_editorial_more > summary::after {
    content: '›' !important;
    margin-left: 6px !important;
    font-size: 17px !important;
    line-height: 1 !important;
    transform: rotate(90deg) !important;
    transition: transform .15s ease !important;
}

.container_editor .ows_editorial_more[open] > summary::after {
    transform: rotate(-90deg) !important;
}

.container_editor .ows_editorial_more_content {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px 14px !important;
    margin-top: 9px !important;
    padding-top: 9px !important;
    border-top: 1px solid #edf1f5 !important;
    color: #667789 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

.container_editor .ows_editorial_more_content a,
.container_editor .ows_editorial_more_content span {
    display: inline-block !important;
}

@media (max-width: 620px) {
    .container_editor .ows_editorial_card_row {
        gap: 14px !important;
        padding: 12px !important;
    }

    .container_editor .ows_editorial_photo {
        flex-basis: 84px !important;
        width: 84px !important;
        min-width: 84px !important;
        max-width: 84px !important;
        height: 108px !important;
        min-height: 108px !important;
        max-height: 108px !important;
    }

    .container_editor .ows_editorial_meta_label {
        display: none !important;
    }

    .container_editor .ows_editorial_meta_link {
        width: 34px !important;
        min-width: 34px !important;
        padding: 6px !important;
        justify-content: center !important;
    }
}

/* 3.10.100.0 automatic h-index */
.ows_editorial_metric{font-weight:700;margin-inline-start:.25rem;white-space:nowrap;}

/* OWS 3.10.109 — editorial profile refinement */
.container_editor .ows_editorial_section,
.container_editor .ows_editorial_section_grid > .ows_editorial_card,
.container_editor .ows_editorial_section_grid > .card_section.ows_editorial_card {
    border-radius: 4px !important;
}

.container_editor .ows_editorial_card_row {
    gap: 18px !important;
    padding: 10px !important;
    border-radius: 4px !important;
}

.container_editor .ows_editorial_photo {
    border-radius: 3px !important;
}

.container_editor .ows_editorial_card_content,
.container_editor .ows_editorial_card_content .ows_editorial_identity,
.container_editor .ows_editorial_card_content h4,
.container_editor .ows_editorial_card_content h4 strong,
.container_editor .ows_editorial_card_content .ows_editorial_role,
.container_editor .ows_editorial_card_content .ows_editorial_affiliation {
    text-align: left !important;
}

.container_editor .ows_editorial_card_content {
    display: block !important;
    align-self: flex-start !important;
    justify-content: flex-start !important;
}

.container_editor .ows_editorial_identity {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.container_editor .ows_editorial_card_content h4 {
    display: block !important;
    width: 100% !important;
    margin: 0 0 3px !important;
    padding: 0 !important;
}

.container_editor .ows_editorial_role {
    margin: 0 !important;
}

.container_editor .ows_editorial_affiliation {
    width: 100% !important;
    margin: 6px 0 0 !important;
    padding: 0 !important;
}

.container_editor .ows_editorial_meta_link {
    border-radius: 4px !important;
}

.container_editor .ows_editorial_more_content {
    display: block !important;
    max-width: 760px !important;
}

.container_editor .ows_editorial_more_content span {
    display: block !important;
    white-space: normal !important;
}
