/* ===== Base utility ===== */
.white-bg {
    background: white !important;
}

/* ===== Region background ===== */
.region.region-content {
    background: #eef0f2;
}

/* ===== Grid item card ===== */
.views-view-responsive-grid__item {
    position: relative;
    background: #ffffff;
    padding: 0;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.views-view-responsive-grid__item:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

.views-view-responsive-grid__item:focus {
    outline: 2px solid #0066cc;
    outline-offset: 2px;
}

.views-view-responsive-grid__item-inner {
    height: 32em;
}

/* ===== Title & program image fields ===== */
.views-field.views-field-title {
    padding: 10px 20px;
    height: 1em;
    margin: 0.5em 0;
    font-weight: bold;
    display: inline-block;
}

.views-field.views-field-field-program-page-image {
    padding: 0 10px;
    margin-top: 10px;
}

.views-field.views-field-field-program-page-image .field.field--name-field-media-image img {
    height: 140px;
    object-fit: cover;
}

/* ===== Topic box title / caption ===== */
.field-content.topic-box-title-field {
    height: 140px;
    overflow: visible;
}

.field-content.topic-box-title-field .caption {
    background: #ffc108;
    padding: 4px;
    font-weight: bold;
    color: black;
}

/* ===== Summary ===== */
.views-field.views-field-field-topic-box-summary {
    padding: 10px 20px;
}

.views-field.views-field-field-topic-box-summary p {
    font-size: 0.9em !important;
}

/* ===== Learn More button / redundant landing-page tag fields ===== */
.views-field.views-field-field-topic-link-button,
.field.field--name-field-topic-group.field--type-entity-reference.field--label-hidden.field--items,
.field.field--name-field-program-tag.field--type-entity-reference.field--label-hidden.field--items {
    display: none;
}

/* ===== Tag/audience outer wrapper containers ===== */
.views-field.views-field-field-program-tag,
.views-field-field-audience-type,
.views-field.views-field-field-audience {
    margin: 0 10px;
}

/*.views-field.views-field-field-program-tag {*/
/*    padding-top: 4em;*/
/*}*/

/*position tags*/
.views-field.views-field-field-program-tag {
    position: absolute;
    bottom: 3em;
}
 
/*position audience*/
.views-field.views-field-field-audience
 {
    position: absolute;
    bottom: 1em;
}

/* ===== Tag/audience field-content containers (final computed state) ===== */
.field-content.topic-program-tag-field,
.field-content.audience-field {
    margin: 0;
    position: relative !important;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    padding: 5px;
    max-width: 100%;
}

/* ===== Tag/audience anchor styling (shared) ===== */
.field-content.topic-program-tag-field a,
.field-content.audience-field a {
    color: white !important;
    font-weight: normal;
    font-size: 0.7em;
    pointer-events: none;
    cursor: default;
    padding: 4px 10px;
    display: block;
    margin-right: 5px !important;
    margin-bottom: 5px;
}

/* base/fallback colors (used for 5th+ tag beyond the nth-of-type overrides) */
.field-content.topic-program-tag-field a {
    background: #003660 !important;
}
.field-content.audience-field a {
    background: #1078b5 !important;
}

/* derender tag/audience labels */
.views-label-field-program-tag,
.views-label-field-audience-type {
    display: none;
}

/* Topic/program tags — navy, tinted lighter (white text safe: 12.4:1 → 5.1:1) */
.field-content.topic-program-tag-field a:nth-of-type(1) {
    background-color: #003660 !important;
}
.field-content.topic-program-tag-field a:nth-of-type(2) {
    background-color: #1A4A70 !important;
}
.field-content.topic-program-tag-field a:nth-of-type(3) {
    background-color: #335E80 !important;
}
.field-content.topic-program-tag-field a:nth-of-type(4) {
    background-color: #4D7290 !important;
}

/* Audience — royal blue, shaded darker (white text safe: 4.8:1 → 8.9:1) */
.audience-field a:nth-of-type(1) {
    background-color: #1078B5 !important;
}
.audience-field a:nth-of-type(2) {
    background-color: #0E669A !important;
}
.audience-field a:nth-of-type(3) {
    background-color: #0B547F !important;
}
.audience-field a:nth-of-type(4) {
    background-color: #094264 !important;
}

/* ===== View header ===== */
.certificates-header {
    padding-bottom: 0 !important;
}

h2#diploma {
    margin-bottom: -30px !important;
    margin-top: 0px !important;
}

/* ===== Hero image ===== */
.field--name-field-blades .hero-image {
    min-height: 225px !important;
}
.hero-image {
    background-position: center !important;
}

/* ===== Responsive grid ===== */
.views-view-responsive-grid.views-view-responsive-grid--horizontal {
    margin-top: 40px;
    margin-bottom: 40px;
    --views-responsive-grid--layout-gap: 10px !important;
}

/* Topic Box Profiles */
.TopicBoxProfile {
  background: lightgray!important;
}
.views-field.views-field-field-profile-topic-card {
    display: none;
}
.field.field--name-field-profile-topic-card.field--type-boolean.field--label-hidden.field--item {
    display: none;
}

@media only screen and (max-width: 767px) {
    .views-view-responsive-grid.views-view-responsive-grid--horizontal {
        --views-responsive-grid--column-count: 1 !important;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
    .views-view-responsive-grid.views-view-responsive-grid--horizontal {
        --views-responsive-grid--column-count: 2 !important;
    }
}
@media only screen and (min-width: 1200px) {
    .views-view-responsive-grid.views-view-responsive-grid--horizontal {
        --views-responsive-grid--column-count: 3 !important;
    }
}