/* CofO2019 Theme Style Sheet */

/* Header Decorative Lines - CofO Maroon */
.genpagebuilder-decorativeLLine::after,
.genpagebuilder-decorativeMLine::after,
.genpagebuilder-decorativeRLine::after {
    border-color: #710a2c !important;
}

/* Link Display Section */
.link-button {
    cursor: pointer;
    color: white !important;
    background-color: #710a2c !important;
    display: inline-block;
    padding: 0.375rem 0.75rem;
    text-decoration: none !important;
}

    .link-button:hover {
        background-color: #a00e3e !important;
    }

.link-hyperlink {
    cursor: pointer;
    color: #710a2c !important;
    display: inline-block;
}

    .link-hyperlink:focus {
        text-decoration: underline !important;
        outline: none !important;
    }


    .file-link:hover {
        background-color: #a00e3e !important;
    }

.link-display-heading {
    letter-spacing: 0.2vw;
    font-family: times new roman;
    text-transform: uppercase;
    display: block;
    padding-top: 1rem;
    font-size: clamp(1.25rem, 3.5vw, 1.875rem);
    color: #710a2c !important;
}

.link-display-red-heading {
    color: #710a2c !important;
}

.link-display-black-heading {
    color: black !important;
}

.link-dropdown {
    width: 150px;
}

.link-edit {
    overflow-y: scroll;
    max-height: 500px;
    height: 422px;
    padding: 5px;
}

.link-settings {
    border-bottom: 1px solid gray;
    margin-bottom: 8px;
}

.link-body.marked {
    position: relative;
}

.link-body .marked-for-deletion {
    display: none;
}

.link-body.marked .marked-for-deletion {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    background-color: rgba(0,0,0,0.3);
}

.text-truncate-end {
    display: inline-block;
    width: 150px; /* Adjust width as needed */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    direction: rtl;
    text-align: left;
}

.link-dropdown {
    width: 150px;
}

.link-edit-button {
    width: 100%;
    height: 100%;
    box-shadow: none !important;
}

.hyperlink-style-toggle {
    color: white !important;
    border-color: #0d6efd;
    background-color: #0d6efd;
}

.button-style-toggle {
    color: #0d6efd !important;
    border-color: #0d6efd;
    background-color: white;
}

/* CKEditor and site heading styles - ensure CKEditor headings use the site font */
/* CofO.edu should use Inter for headings (use .genpagebuilder-h1..h6 classes) */
.genpagebuilder-h1, .genpagebuilder-h2, .genpagebuilder-h3, .genpagebuilder-h4, .genpagebuilder-h5, .genpagebuilder-h6,
.cke_editable .genpagebuilder-h1, .cke_editable .genpagebuilder-h2, .cke_editable .genpagebuilder-h3, .cke_editable .genpagebuilder-h4, .cke_editable .genpagebuilder-h5, .cke_editable .genpagebuilder-h6 {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
/* End of Link Display Section */

/* ---------------------------------------------------------------------------
   ImageGallery — College of the Ozarks. Maroon accent, Inter for the viewer; the
   gallery title matches the site's .cofo-red-heading (Times, uppercase, maroon).
   ImageGallery.css is registered during body render, so it loads AFTER this
   file. Source order cannot win; `.gen-article-section` (0,3,0) outranks that
   file's own `.image-gallery-container.gpb-gallery` (0,2,0) defaults instead.
   Do not add !important here.
   --------------------------------------------------------------------------- */
.gen-article-section .image-gallery-container.gpb-gallery {
    --gpb-gallery-mount: #e6e2e0;
    --gpb-gallery-ink: #1f1d1b;
    --gpb-gallery-ink-quiet: #615d5a;
    --gpb-gallery-accent: #710a2c;
    --gpb-gallery-heading-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

.gen-article-section .image-gallery-container.gpb-gallery .article-image-gallery-header > span {
    --gpb-gallery-heading-font: "Times New Roman", Times, serif;
    --gpb-gallery-heading-color: #710a2c;
    --gpb-gallery-heading-size: clamp(1.5rem, 3.5vw, 1.875rem);
    --gpb-gallery-heading-transform: uppercase;
    --gpb-gallery-heading-spacing: .08em;
    --gpb-gallery-heading-weight: normal;
}

/* ---------------------------------------------------------------------------
   Editor headings (.gpb-h2..4) and buttons (.gpb-btn): see GenPageBuilderStyling.css.
   cofo.edu: headings are the site red heading (Times, capitals, CofO red); subheadings the black one.
   Scoped to the page sections and to the editor's editing area (.gpb-site-cofo),
   so both show the same thing.
   --------------------------------------------------------------------------- */
.gen-article-section,
.gpb-site-cofo {
    --gpb-heading-font: "Times New Roman", Times, serif;
    --gpb-heading-weight: normal;
    --gpb-heading-color: #710a2c;
    --gpb-heading-transform: uppercase;
    --gpb-heading-spacing: .08em;
    --gpb-h2-size: clamp(1.5rem, 3.5vw, 1.875rem);
    --gpb-h3-size: clamp(1.25rem, 2.75vw, 1.5rem);
    --gpb-h3-color: #1f1d1b;
    --gpb-h4-font: 'Inter', Arial, sans-serif;
    --gpb-h4-color: #1f1d1b;
    --gpb-btn-bg: #710a2c;
    --gpb-btn-bg-hover: #a00e3e;
    --gpb-btn-ink: #ffffff;
    --gpb-btn-radius: 6px;
    --gpb-btn-font: 'Inter', Arial, sans-serif;
}

/* ---------------------------------------------------------------------------
   Photo cards (the "Keeter" card type) in cofo.edu's own look. The card type was
   built for the Keeter Center: League Spartan capitals with wide tracking, a white
   underline, and a dark layer over the whole photo, which on cofo.edu turned pages
   like Majors and Minors into a wall of dark squares and broke words mid-word
   ("COMMUNICATIO / N ARTS"). Same markup and settings, restyled here only, so Keeter
   keeps its cards: the photo stays bright, the title sits on a soft shade at the
   foot with a CofO red rule, and the tile fills its column.
   --------------------------------------------------------------------------- */
.gen-article-section a.gpb-keeterButton {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    border-radius: 6px;
    box-shadow: 0 1px 3px rgba(31, 29, 27, .18);
    background: #1f1d1b;
    text-decoration: none;
    transition: box-shadow .2s ease-in-out, transform .2s ease-in-out;
}

.gen-article-section a.gpb-keeterButton.square {
    width: 100%;
    height: auto;           /* the Keeter rule fixes 240px, which beats aspect-ratio */
    aspect-ratio: 4 / 3;
}

.gen-article-section a.gpb-keeterButton img {
    transition: transform .35s ease-in-out;
}

/* A shade only where the words are, so the photo reads */
.gen-article-section a.gpb-keeterButton .gpb-keeterButton-gradient {
    /* Starts high enough that a three-line title still has 4.5:1 on a pale photo
       (measured against every card on Majors, Trips and Catalog). */
    background: linear-gradient(180deg, rgba(20, 10, 12, 0) 22%, rgba(20, 10, 12, .62) 48%, rgba(20, 10, 12, .9) 100%);
    border-bottom: 4px solid #710a2c;
    box-sizing: border-box;
}

.gen-article-section a.gpb-keeterButton .gpb-keeterButton-body,
.gen-article-section a.gpb-keeterButton.square .gpb-keeterButton-body {
    position: absolute;
    top: auto;
    left: 0;
    right: 0;
    bottom: 0;
    height: auto;
    width: auto;
    padding: 0 .9rem .8rem;
    transform: none;
    text-align: left;
}

.gen-article-section a.gpb-keeterButton .gpb-keeterButton-body span,
.gen-article-section a.gpb-keeterButton.square .gpb-keeterButton-body span {
    display: block;
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
    color: #ffffff;
    font-family: 'Inter', Arial, sans-serif;
    font-size: clamp(1rem, 1.4vw, 1.125rem);
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: normal;
    text-transform: none;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .55);
    overflow-wrap: normal;
    word-wrap: normal;
    word-break: normal;
    hyphens: manual;
}

.gen-article-section a.gpb-keeterButton .gpb-keeterButton-body p,
.gen-article-section a.gpb-keeterButton.square .gpb-keeterButton-body p {
    position: static;
    max-width: none;
    margin: .25rem 0 0;
    padding: 0;
    color: rgba(255, 255, 255, .92);
    font-family: 'Inter', Arial, sans-serif;
    font-size: .875rem;
    line-height: 1.35;
    letter-spacing: normal;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .55);
}

.gen-article-section a.gpb-keeterButton .gpb-keeterButton-body p:empty {
    display: none;
}

/* Hover and focus: a gentle lift and zoom instead of Keeter's corner lines */
.gen-article-section a.gpb-keeterButton::before,
.gen-article-section a.gpb-keeterButton::after {
    display: none;
}

.gen-article-section a.gpb-keeterButton:hover,
.gen-article-section a.gpb-keeterButton:focus-visible {
    box-shadow: 0 8px 20px rgba(31, 29, 27, .28);
    transform: translateY(-2px);
}

.gen-article-section a.gpb-keeterButton:hover img,
.gen-article-section a.gpb-keeterButton:focus-visible img {
    transform: scale(1.05);
}

.gen-article-section a.gpb-keeterButton:focus-visible {
    outline: 3px solid #710a2c;
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    .gen-article-section a.gpb-keeterButton,
    .gen-article-section a.gpb-keeterButton img {
        transition: none;
    }
    .gen-article-section a.gpb-keeterButton:hover,
    .gen-article-section a.gpb-keeterButton:hover img {
        transform: none;
    }
}

/* ---------------------------------------------------------------------------
   Link buttons (the editor's "Show as button" / "Outline button") in cofo.edu's
   look: Inter capitals with light tracking and a small forward arrow that steps
   right on hover or keyboard focus. Chosen by Seth from four mock-ups (2026-09-28).
   Scoped to the page sections and the cofo editor area, so other sites keep theirs.
   --------------------------------------------------------------------------- */
.gen-article-section a.gpb-btn,
.gen-article-section a.gpb-btn-outline,
.gpb-site-cofo a.gpb-btn,
.gpb-site-cofo a.gpb-btn-outline {
    border-radius: 4px;
    padding: .6rem 1.1rem .6rem 1.3rem;
    font-size: .9rem !important;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.gen-article-section a.gpb-btn::after,
.gen-article-section a.gpb-btn-outline::after,
.gpb-site-cofo a.gpb-btn::after,
.gpb-site-cofo a.gpb-btn-outline::after {
    content: "";
    flex: 0 0 auto;
    width: .5em;
    height: .5em;
    margin-left: .15em;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform .15s ease-in-out;
}

.gen-article-section a.gpb-btn:hover::after,
.gen-article-section a.gpb-btn:focus-visible::after,
.gen-article-section a.gpb-btn-outline:hover::after,
.gen-article-section a.gpb-btn-outline:focus-visible::after,
.gpb-site-cofo a.gpb-btn:hover::after,
.gpb-site-cofo a.gpb-btn-outline:hover::after {
    transform: translateX(3px) rotate(45deg);
}

@media (prefers-reduced-motion: reduce) {
    .gen-article-section a.gpb-btn::after,
    .gen-article-section a.gpb-btn-outline::after {
        transition: none;
    }
    .gen-article-section a.gpb-btn:hover::after,
    .gen-article-section a.gpb-btn:focus-visible::after,
    .gen-article-section a.gpb-btn-outline:hover::after,
    .gen-article-section a.gpb-btn-outline:focus-visible::after {
        transform: rotate(45deg);
    }
}