/* ==========================================================================
   Typography and small fixes, loaded after every other stylesheet (_layouts/front/index.blade.php).
   No CDN in front of berenjkar.ir: a change ships with a new ?v= on the <link>.
   ========================================================================== */

/* ---------- 1. Page title (H1 of detail pages) ---------- */

/* It was 20px/500 at line-height 1.1, hardly above the 18px box titles beside it. On book and meeting
   pages the tablet/desktop copy of the title is a div (one H1 per page), so the h1 look is set here. */
.single-content .single-post-title,
.sidebar .single-post-title {
    font-family: IRANSans, tahoma, arial;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.5;
    word-spacing: -2px;
    margin: 0 0 15px;
}

/* ---------- 2. Logo: the H1 of the home page only, a div elsewhere ---------- */

/* What the h1 tag gave it (Bootstrap + theme); the .kopa-logo rules still override these, and
   :where() keeps this at zero specificity so they always do. */
:where(div.kopa-logo) {
    font-family: IRANSans, tahoma, arial;
    font-size: 36px;
    font-weight: 500;
    line-height: 1.1;
    word-spacing: -2px;
    margin-top: 20px;
    margin-bottom: 10px;
}

/* ---------- 3. List pages: the last breadcrumb is their H1, with the breadcrumb's look ---------- */

.breadcrumb h1.breadcrumb-h1 {
    display: inline;
    margin: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    word-spacing: inherit;
}

/* ---------- 4. Long text: one size and line height on every detail page ---------- */

/* It was the 13px body size; editor text with its own inline size (the about page) keeps it. */
.single-content .single-content-detail .right-content {
    font-size: 15px;
    line-height: 2;
}

.single-content .single-content-detail .right-content p,
.single-content .single-content-detail .right-content li {
    font-size: inherit;
    line-height: inherit;
}

/* Editor headings: h5/h6 were 14px/13px, smaller than the text under them. */
.single-content .right-content h2 {
    font-size: 20px;
    line-height: 1.6;
}

.single-content .right-content h5,
.single-content .right-content h6 {
    font-size: 15px;
    line-height: 1.6;
}

/* Date under the title: <small> of the 13px body = 11px. */
.single-content .entry-meta small {
    font-size: 12px;
}

/* ---------- 5. Home page: one scale for the item titles ---------- */

/* Item titles were 14px/500, 15px/500 and 14px/700 box by box. The lead news item (16px/700) and the
   book titles on their dark band (15px/700) keep their weight. */
.main-page .right-panel .entry-title a,
.main-page .kopa-item-course-01 .entry-title a,
.main-page .kopa-item-course-03 .entry-title a,
.main-page .kopa-ms-item-01 .entry-title a {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.6;
}

/* Summaries under them: 12px in the news box, 13px everywhere else. */
.main-page .left-panel .entry-content p,
.main-page .right-panel .entry-content p {
    font-size: 13px;
    line-height: 1.9;
}

/* Dates: 12px like the news box (the short-audio cards had 11px). */
.main-page .kopa-ms-item-01 .entry-content small {
    font-size: 12px;
}

/* ---------- 6. Maps (js/berenjkar-map.js) ---------- */

.map-directions {
    margin-top: .5rem;
    font-size: 13px;
    color: #6c757d;
}

.map-directions a {
    display: inline-block;
    margin: .25rem 0 0 .375rem;
    padding: .1rem .7rem;
    border: 1px solid #dee2e6;
    border-radius: 1rem;
    color: #2c3e50;
    background: #fff;
}

.map-directions a:hover {
    border-color: #f39c12;
    text-decoration: none;
}

/* the map attribution is Latin text inside a right-to-left page */
.leaflet-control-attribution {
    direction: ltr;
}