/*
 * Denso plugin - styles ResourceSpace loads on every page while the plugin is active.
 */

/*
 * The search bar filters by year only (DENSO-1583). Core has no switch for the month on its own -
 * $simple_search_date takes the year with it - so the select is hidden rather than removed. It
 * stays in the form with its empty value, which the search reads as "any month".
 */
#basicmonth {
    display: none;
}

/*
 * Result cards show the whole title (DENSO-1583), and some titles are a filename with no space to
 * break at - "SDS_252-8392-G_ND-OIL-11_CZ_cs_1.4_18.06.2025_8392.pdf" - which would run out of the
 * card. Such a title breaks wherever it has to; one with spaces still breaks between words.
 */
.resource-card-title {
    max-width: 100%;
    overflow-wrap: anywhere;
}

/*
 * The file's Information value - Bulletin, Leaflet, Safety Data Sheets - as a pill under the title.
 * The plugin adds the field to the card (denso_show_information_on_results()), and core marks it
 * with a class carrying the field's ref, which differs between environments. The title is the only
 * other field on a card and has the -title class instead, so this matches Information alone.
 */
.resource-card-content-top .resource-card-field {
    display: inline-block;
    max-width: 100%;
    padding: var(--space-4) var(--space-8);
    border-radius: var(--space-16);
    background: var(--colour-surface-200);
    color: var(--colour-typography-700);
    font-size: 12px;
    line-height: 120%;
    overflow-wrap: anywhere;
}

/* Core renders the element for a file with no value too, empty but for whitespace, so :empty
   does not match it; its title attribute carries the value and is empty with it. */
.resource-card-content-top .resource-card-field[title=""] {
    display: none;
}

/*
 * The state of a file. Nearly every file is active, so saying so on every card is noise; any other
 * state - deleted, archived, pending - is worth seeing, but should not compete with the title.
 */
.resource-card-status.active {
    display: none;
}

.resource-card-pill.resource-card-status {
    padding: 2px var(--space-6);
    font-size: 11px;
    color: var(--colour-typography-600);
    background: var(--colour-surface-200);
}