/*
 * Centro de información (segittur-admin): fixes. See segittur-admin-fixes.php.
 * Loaded only on pages that render the plugin's shortcodes.
 */

/* Same indent and width as the theme's paragraphs and iframes (mini-mandrake, `#main p` and `.so-panel iframe`). */
.ci-columna {
    margin-left: 2.4667rem;
    max-width: calc(60rem - 2.4667rem);
    width: calc(100% - 2.4667rem);
}

/*
 * Without the page builder, the search and the intro are direct children of
 * the article, which the theme caps at 60rem with !important: added to the
 * indent, they ran 37px past the column.
 */
:is(.turistico-template-default, .economia-template-default, .general-template-default, .transporte-template-default, .alojamientos-template-default, .sostenibilidad-template-default) .post.hentry:only-of-type > :is(.ci-columna, p) {
    max-width: calc(60rem - 2.4667rem) !important;
}

@media screen and (max-width: 880px) {
    .ci-columna {
        margin-left: 0;
        max-width: none;
        width: 100%;
    }
}

/*
 * The search itself (form, results and detail view). Next to the 320px
 * filter sidebar the results only had about 510px of the text column, and
 * the detail view piled its long texts up the same way. The block keeps its
 * left edge on the column and grows to the right, up to the edge of the page
 * container (the header's). Without the page builder the block is a direct
 * child of the article; with it, the layout is released and every other row
 * keeps the 60rem column.
 */
:is(.turistico-template-default, .economia-template-default, .general-template-default, .transporte-template-default, .alojamientos-template-default, .sostenibilidad-template-default) .post.hentry:only-of-type > :is(.ci-columna--ancha, .panel-layout:has(.ci-columna--ancha)) {
    max-width: none !important;
}

.ci-columna.ci-columna--ancha {
    max-width: none;
}

.panel-layout:has(.ci-columna--ancha) > .panel-grid:not(:has(.ci-columna--ancha)) {
    max-width: 60rem;
}

/*
 * Fonts. The plugin asks for "source-sans-pro" (a Typekit name the site does
 * not load), so labels, tabs and selects fell back to the default font.
 */
.ci-columna :is(label, input, select, button, a, p, span, small, legend, li, .segittur-dropdown, .segittur-result-count) {
    font-family: "Source Sans Pro", sans-serif !important;
}

/*
 * Type tabs. In the results view the plugin hides them inside its filter
 * sidebar, so only Publicaciones could be reached. They are shown as a
 * compact list that fits the sidebar.
 */
.ci-columna .segittur-mixto .segittur-mixto-sidebar .segittur-buscador-tabs {
    border-bottom: 1px solid #ddd;
    display: flex !important;
    flex-wrap: wrap;
    gap: 0 1rem;
    margin: 0 0 1rem;
}

.ci-columna .segittur-mixto .segittur-buscador-tabs .segittur-tab {
    color: #58595b !important;
    font-size: .95rem;
    font-weight: 600;
    padding: .35rem 0 .45rem;
    text-decoration: none !important;
}

.ci-columna .segittur-mixto .segittur-buscador-tabs .segittur-tab.segittur-tab-active {
    box-shadow: inset 0 -3px 0 #990100;
    color: #990100 !important;
}

.ci-columna .segittur-mixto .segittur-buscador-tabs .segittur-tab::after {
    content: none !important;
}

/* Count and sort on one line, above the list. */
.ci-columna .segittur-orden-wrapper {
    align-items: center;
    border-bottom: 2px solid #990100;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1rem;
    justify-content: space-between;
    margin-bottom: .5rem;
    padding-bottom: .75rem;
}

.ci-columna .segittur-result-count {
    color: #58595b;
    font-size: 1rem;
    font-weight: 600;
}

/*
 * Result cards. Each title was a theme section heading (26px Futura, 37px
 * indent and a 48px red bar), so a card measured ~270px.
 */
.ci-columna .segittur-results .segittur-result {
    border-bottom: 1px solid #e3e3e3;
    padding: 1.1rem 0 1.2rem !important;
}

.ci-columna .segittur-result > [class$="-tipo"] {
    color: #990100;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .06em;
    margin-bottom: .3rem;
    text-transform: uppercase;
}

.ci-columna .segittur-result > h3 {
    color: #58595b;
    font-family: futura-pt, sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 .4rem !important;
    padding: 0 !important;
}

.ci-columna .segittur-result > h3::before,
.ci-columna .segittur-result > h3::after {
    content: none !important;
}

.ci-columna .segittur-result > h3 mark {
    background: #f6e3e3;
    color: inherit;
    padding: 0;
}

.ci-columna .segittur-result > [class$="-meta"] {
    color: #838282;
    font-size: .9rem;
    line-height: 1.5;
}

.ci-columna .segittur-result .segittur-more {
    margin-top: .4rem;
}

.ci-columna .segittur-result .segittur-more a {
    color: #990100 !important;
    font-size: .9rem;
    font-weight: 700;
}

/*
 * On phones the plugin keeps its 260px+ sidebar beside the results, which
 * ran off the screen: there the filters go above the results.
 */
@media screen and (max-width: 880px) {
    .ci-columna .segittur-mixto-layout2 {
        display: block !important;
    }

    .ci-columna .segittur-mixto .segittur-mixto-sidebar {
        margin-bottom: 1.5rem;
        max-width: none !important;
        min-width: 0 !important;
        position: static;
    }
}

/*
 * Detail view. The theme indents every paragraph and h3 again inside the
 * column; each field was a label with its text piled underneath; the subject
 * tags were #222 on #990100 (1.79:1).
 */
.ci-columna p,
.ci-columna h3 {
    margin-left: 0 !important;
    padding-left: 0 !important;
    width: auto !important;
}

.ci-columna h3::before {
    content: none !important;
}

/*
 * Breadcrumb of the detail view: links were 13px black, separators and the
 * current page 18px, and the current page bold in red. All the same size and
 * greys now; red only on hover.
 */
.ci-columna .segittur-breadcrumb,
.ci-columna .segittur-breadcrumb :is(a, span) {
    color: #838282 !important;
    font-size: .8rem !important;
    font-weight: 400 !important;
    letter-spacing: .04em;
}

.ci-columna .segittur-breadcrumb a {
    text-decoration: none;
}

.ci-columna .segittur-breadcrumb a:hover,
.ci-columna .segittur-breadcrumb a:focus {
    color: #990100 !important;
}

.ci-columna .segittur-breadcrumb > span:not(:last-child) {
    color: #c4c4c4 !important;
}

.ci-columna .segittur-breadcrumb > span:last-child {
    color: #58595b !important;
    font-weight: 600 !important;
}

/* A flex row that did not wrap: on mobile the last crumb ran off the screen. */
.ci-columna .segittur-breadcrumb {
    flex-wrap: wrap;
    row-gap: .25rem;
}

.ci-columna .segittur-detalle-heading {
    margin: 1.5rem 0 .25rem;
}

.ci-columna .segittur-detalle-heading__accent {
    display: none;
}

.ci-columna .segittur-detalle-heading__label {
    color: #990100;
    font-size: .8rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.ci-columna .segittur-detalle-titulo {
    color: #58595b;
    font-family: futura-pt, sans-serif;
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.25;
    margin: 0 0 1.5rem;
    max-width: none !important; /* the theme caps every h2 of an article at 57.5rem */
    text-transform: none !important;
    width: auto !important;
}

/* Label on the left, value on the right: long texts read as a block instead of piling up under the label. */
.ci-columna .segittur-detalle-meta-line {
    border-bottom: 1px solid #ececec;
    color: #444;
    display: flow-root;
    line-height: 1.6;
    margin: 0 !important;
    padding: .6rem 0 .6rem 13.5rem !important;
}

.ci-columna .segittur-detalle-meta-line > strong:first-child {
    color: #838282;
    float: left;
    font-weight: 700;
    margin: 0 0 0 -13.5rem;
    padding-right: 1rem;
    width: 13.5rem;
}

.ci-columna .segittur-detalle-meta-line a {
    color: #990100;
}

/* Tags and links sections: the same two columns, the list on the right. */
.ci-columna .segittur-detalle-seccion {
    align-items: start;
    border-bottom: 1px solid #ececec;
    display: grid;
    grid-template-columns: 13.5rem minmax(0, 1fr);
    padding: .6rem 0;
}

.ci-columna .segittur-detalle-seccion > .segittur-detalle-meta-line,
.ci-columna .segittur-detalle-seccion > h3 {
    border: 0;
    color: #838282;
    font-family: "Source Sans Pro", sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.6;
    margin: 0 !important;
    padding: 0 1rem 0 0 !important;
}

.ci-columna .segittur-detalle-seccion > .segittur-detalle-meta-line > strong:first-child {
    float: none;
    margin: 0;
    padding: 0;
    width: auto;
}

.ci-columna .segittur-detalle-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    list-style: none;
    margin: 0 !important;
    padding: 0 !important;
}

.ci-columna .segittur-detalle-tags li {
    margin: 0 !important;
    padding: 0 !important;
}

.ci-columna .segittur-detalle-tags li::before {
    content: none !important;
}

/* Light tags in the brand red, slightly deeper on hover (7.8:1 contrast at rest). */
.ci-columna .segittur-detalle-tags a.segittur-badge {
    background: #f9eeee;
    border: 1px solid #ebcfcf;
    border-radius: 999px;
    color: #990100 !important;
    display: inline-block;
    font-size: .85rem;
    font-weight: 600;
    line-height: 1.3;
    padding: .3rem .8rem;
    text-decoration: none;
    transition: background-color .15s, color .15s, border-color .15s;
}

.ci-columna .segittur-detalle-tags a.segittur-badge:hover,
.ci-columna .segittur-detalle-tags a.segittur-badge:focus {
    background: #ecc9c9;
    border-color: #c48585;
    color: #7a0100 !important;
}

.ci-columna .segittur-detalle-seccion ul {
    list-style: none;
    margin: 0 !important;
    padding: 0 !important;
}

.ci-columna .segittur-detalle-seccion li {
    line-height: 1.6;
    margin: 0 0 .2rem !important;
    padding: 0 !important;
}

.ci-columna .segittur-detalle-seccion li::before {
    content: none !important;
}

.ci-columna .segittur-detalle-seccion a:not(.segittur-badge) {
    color: #990100 !important;
    font-weight: 600;
}

@media screen and (max-width: 880px) {
    .ci-columna .segittur-detalle-meta-line {
        padding-left: 0 !important;
    }

    .ci-columna .segittur-detalle-meta-line > strong:first-child {
        display: block;
        float: none;
        margin: 0;
        width: auto;
    }

    .ci-columna .segittur-detalle-seccion {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Shown while API calls are paused after a failure. */
.ci-columna .ci-aviso {
    background: #fbeaea;
    border-left: 4px solid #990100;
    color: #58595b;
    margin: 0 0 1.5rem !important;
    padding: .75rem 1rem !important;
}
