/*
Theme Name: Auvent Sureau
Template: generatepress
Version: 1.0.0
Description: Habillage sur mesure pour Olivier à fond
*/

:root {
    --oa-primary: #7C3AED;
    --oa-secondary: #A78BFA;
    --oa-accent: #8B5CF6;
    --oa-accent-warm: #F0ECF8;
    --oa-surface: #F5F3FF;
    --oa-bg: #FFFFFF;
    --oa-ink: #1E1B4B;
    --oa-ink-soft: #6B7280;
    --oa-line: #E9E5F5;
    --oa-radius: 16px;
    --oa-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    --oa-gap-section: 2rem;
    --oa-gap-block: 1rem;
    --oa-pad: 1rem;
    --oa-measure: 720px;
}

/* Repère éditorial en vue mobile */
@media (max-width: 767px) {
    .inside-navigation::before {
        content: "Le sport vu du canapé, du terrain et du rayon chaussures.";
        font-style: italic;
        position: absolute;
        left: var(--oa-gap-block, 8px);
        right: 118px;
        top: auto;
        bottom: 6px;
        font-size: 13px;
        line-height: 1.25;
        color: #FFFFFF;
    }
    .inside-navigation { position: relative; padding-bottom: 38px; }
}

/* Submit-button palette rule (contact-form-render.cjs form_button_palette_match) */
body button.wpforms-submit,
body .wpcf7-submit,
body .ff-btn-submit {
    background-color: #7C3AED !important;
    color: #ffffff !important;
}
body button.wpforms-submit:hover,
body .wpcf7-submit:hover,
body .ff-btn-submit:hover {
    filter: brightness(0.88) !important;
}

/* ---------- Base ---------- */

body {
    background-color: var(--oa-bg);
}

.inside-article,
.sidebar .widget,
.comments-area {
    border-radius: var(--oa-radius);
}

a {
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.entry-content {
    max-width: var(--oa-measure);
}

.entry-content p,
.entry-content li {
    font-size: 1.0625rem;
    line-height: 1.72;
}

.entry-content h2 {
    margin-top: calc(var(--oa-gap-section) * 1.15);
    padding-bottom: 0.35rem;
    border-bottom: 2px solid var(--oa-line);
}

.entry-content h3 {
    margin-top: var(--oa-gap-section);
    color: var(--oa-primary);
}

.entry-content blockquote {
    border-left: 4px solid var(--oa-secondary);
    background: var(--oa-surface);
    border-radius: 0 var(--oa-radius) var(--oa-radius) 0;
    padding: 0.9rem 1.1rem;
    font-style: italic;
}

.entry-content ul,
.entry-content ol {
    padding-left: 1.4rem;
}

.entry-content img,
.post-image img,
.page-content img {
    border-radius: var(--oa-radius);
}

/* ---------- Header / nav ---------- */

.main-navigation {
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.14);
}

.main-navigation .main-nav ul li a {
    font-family: 'Outfit', system-ui, sans-serif;
    font-weight: 600;
    letter-spacing: 0.01em;
}

.site-header {
    border-bottom: 1px solid var(--oa-line);
}

.site-logo img {
    height: auto;
}

/* GP Menu Plus merges the logotype into the mobile bar: the light variant is set
   as mobile_header_logo so the mark stays legible on the coloured strip. Pin the
   width only — pinning both dimensions clips the glyphs on a wide wordmark. */
#mobile-header .site-logo { flex: 0 0 auto; display: block; align-self: center; }
#mobile-header .site-logo a { display: block; width: 190px; }
#mobile-header .site-logo img {
    width: 190px !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
}

/* ---------- Front-page H1 (APPENDIX-E §27 filter 5) ---------- */

.site-tagline-heading {
    display: block;
    text-align: left;
    padding: 0.5rem 0 0.25rem;
    font-size: 1.55rem;
    line-height: 1.25;
    color: var(--oa-ink);
    margin: 0;
}

.oa-home-lede {
    margin: 0 0 var(--oa-gap-section);
    color: var(--oa-ink-soft);
    font-size: 1.05rem;
    font-style: italic;
}

/* En mobile, la même phrase est déjà dans la barre de navigation
   (.inside-navigation::before, règle M2-1) : pas de doublon à l'écran. */
@media (max-width: 767px) {
    .oa-home-lede { display: none; }
}

/* ---------- Featured-post hero (brief §10 homepage_hero) ---------- */

.oa-hero {
    display: block;
    width: 100%;
    background: var(--oa-surface);
    border: 1px solid var(--oa-line);
    border-radius: var(--oa-radius);
    box-shadow: var(--oa-shadow);
    overflow: hidden;
    margin: 0 0 var(--oa-gap-section);
}

.oa-hero__media {
    display: block;
    width: 100%;
    margin: 0;
}

.oa-hero__media img {
    display: block;
    width: 100%;
    height: 320px;
    object-fit: cover;
    border-radius: 0;
}

.oa-hero__body {
    padding: 1.25rem 1.25rem 1.4rem;
}

.oa-hero__kicker {
    display: inline-block;
    font-family: 'Outfit', system-ui, sans-serif;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #FFFFFF;
    background: var(--oa-primary);
    border-radius: 999px;
    padding: 0.22rem 0.7rem;
    margin-bottom: 0.65rem;
}

.oa-hero__title {
    margin: 0 0 0.55rem;
    font-size: 1.85rem;
    line-height: 1.22;
}

.oa-hero__title a { color: var(--oa-ink); }
.oa-hero__title a:visited { color: var(--oa-ink); }
.oa-hero__title a:hover { color: var(--oa-primary); }

.oa-hero__body p {
    margin: 0 0 0.9rem;
    color: #3F3A6B;
    font-size: 1.02rem;
    line-height: 1.6;
}

a.oa-hero__cta {
    display: inline-block;
    font-family: 'Outfit', system-ui, sans-serif;
    font-weight: 600;
    font-size: 0.95rem;
    color: #FFFFFF;
    background: var(--oa-primary);
    border-radius: 999px;
    padding: 0.5rem 1.1rem;
    text-decoration: none;
}

a.oa-hero__cta:visited { color: #FFFFFF; }
a.oa-hero__cta:hover { color: #FFFFFF; background: #6327D4; }

.oa-hero__meta {
    display: block;
    margin-top: 0.7rem;
    font-size: 0.86rem;
    color: #55506E;
}

@media (max-width: 600px) {
    .oa-hero__media img { height: 210px; }
    .oa-hero__title { font-size: 1.45rem; }
}

/* ---------- Section heading ---------- */

.oa-section-heading {
    margin: 0 0 var(--oa-gap-block);
    font-size: 1.28rem;
    letter-spacing: 0.01em;
    color: var(--oa-ink);
}

.oa-section-heading::after {
    content: "";
    display: block;
    width: 54px;
    height: 3px;
    margin-top: 0.4rem;
    background: var(--oa-secondary);
    border-radius: 2px;
}

/* ---------- Post cards ---------- */

.generate-columns .inside-article,
.blog .inside-article,
.archive .inside-article,
.search .inside-article {
    background: var(--oa-bg);
    border: 1px solid var(--oa-line);
    border-radius: var(--oa-radius);
    box-shadow: var(--oa-shadow);
    padding: 1rem 1.1rem 1.1rem;
    transition: box-shadow 160ms ease, transform 160ms ease;
}

.generate-columns .inside-article:hover,
.blog .inside-article:hover,
.archive .inside-article:hover {
    box-shadow: 0 8px 22px rgba(30, 27, 75, 0.14);
    transform: translateY(-2px);
}

.blog .post-image img,
.archive .post-image img,
.search .post-image img {
    width: 100%;
    height: 190px;
    object-fit: cover;
    border-radius: calc(var(--oa-radius) - 4px);
}

/* Card titles only — the singular entry-title keeps GP's h1 scale. */
.blog .entry-title,
.archive .entry-title,
.search .entry-title,
.generate-columns .entry-title { font-size: 1.22rem; line-height: 1.3; }

.single .entry-title,
.page .entry-title,
.error404 .entry-title {
    font-size: 2rem;
    line-height: 1.2;
    margin-bottom: 0.4rem;
}

@media (max-width: 600px) {
    .single .entry-title,
    .page .entry-title,
    .error404 .entry-title { font-size: 1.6rem; }
}

.entry-title a { color: var(--oa-ink); }
.entry-title a:visited { color: var(--oa-ink); }
.entry-title a:hover { color: var(--oa-primary); }

.entry-meta { color: #55506E; font-size: 0.86rem; }
.entry-meta a { color: #55506E; }
.entry-meta a:visited { color: #55506E; }

a.oa-readmore,
.read-more {
    font-family: 'Outfit', system-ui, sans-serif;
    font-weight: 600;
}

/* ---------- Sidebar (sig-D, right) ---------- */

.sidebar .widget {
    background: var(--oa-surface);
    border: 1px solid var(--oa-line);
    box-shadow: none;
    padding: 1rem 1.05rem;
    margin-bottom: var(--oa-gap-block);
}

.sidebar .widget .widget-title {
    font-family: 'Outfit', system-ui, sans-serif;
    font-size: 1.02rem;
    font-weight: 600;
    margin-bottom: 0.6rem;
    color: var(--oa-ink);
}

.sidebar .widget ul { margin-left: 0; list-style: none; }
.sidebar .widget ul li { padding: 0.28rem 0; border-bottom: 1px dashed var(--oa-line); }
.sidebar .widget ul li:last-child { border-bottom: 0; }
.sidebar .widget a { color: #5B21B6; }
.sidebar .widget a:visited { color: #5B21B6; }
.sidebar .widget a:hover { color: var(--oa-ink); }

.sidebar .widget .search-field,
.widget_search .search-field {
    width: 100%;
    border: 1px solid var(--oa-line);
    border-radius: 999px;
    padding: 0.5rem 0.9rem;
    font-family: 'Crimson Text', Georgia, serif;
    background: #FFFFFF;
}

.sidebar .widget .search-field:focus,
.widget_search .search-field:focus {
    outline: 2px solid var(--oa-secondary);
    outline-offset: 1px;
}

/* ---------- Author card ---------- */

.oa-authorcard {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    margin-top: var(--oa-gap-section);
    padding: 1rem 1.1rem;
    background: var(--oa-surface);
    border: 1px solid var(--oa-line);
    border-radius: var(--oa-radius);
}

.oa-authorcard img {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    flex: 0 0 auto;
}

.oa-authorcard__name {
    font-family: 'Outfit', system-ui, sans-serif;
    font-weight: 600;
    margin: 0 0 0.25rem;
    font-size: 1.02rem;
}

.oa-authorcard__name a { color: var(--oa-ink); }
.oa-authorcard__name a:visited { color: var(--oa-ink); }
.oa-authorcard p { margin: 0; font-size: 0.95rem; color: #3F3A6B; line-height: 1.55; }

/* ---------- Byline portrait ---------- */

.oa-byline-thumb {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    object-fit: cover;
    vertical-align: -8px;
    margin-right: 0.35rem;
}

/* ---------- About page (about-inline-circle) ---------- */

.oa-about-inline {
    display: flex;
    gap: 1.1rem;
    align-items: center;
    margin: 0 0 var(--oa-gap-section);
    padding: 1.05rem 1.2rem;
    background: var(--oa-surface);
    border: 1px solid var(--oa-line);
    border-radius: var(--oa-radius);
}

.oa-about-inline img {
    width: 118px;
    height: 118px;
    border-radius: 50%;
    object-fit: cover;
    flex: 0 0 auto;
}

.oa-about-inline__text p { margin: 0; }
.oa-about-inline__text p + p { margin-top: 0.5rem; }

@media (max-width: 560px) {
    .oa-about-inline { flex-direction: column; align-items: flex-start; }
}

/* ---------- Footer (centered-dark) ---------- */

.site-footer .footer-widgets,
.site-footer .site-info {
    background: var(--oa-ink);
    color: #F5F3FF;
}

.site-footer .footer-widgets-container {
    text-align: center;
}

/* GP met .inside-site-info en flex (mention à droite, liens à gauche). Le §10
   demande une pile centrée : on repasse en bloc et on centre tout. */
.site-footer .inside-site-info {
    display: block;
    text-align: center;
}

.site-footer .copyright-bar {
    float: none;
    text-align: center;
    margin-top: 0.4rem;
    font-size: 0.88rem;
    color: #C7C2E8;
}

.site-footer .footer-widgets .widget {
    background: transparent;
    border: 0;
    padding: 0.35rem 0;
}

.site-footer .widget-title { display: none; }

.site-footer p,
.site-footer li,
.site-footer .textwidget {
    color: #F5F3FF;
}

.site-footer ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-footer ul li {
    display: inline-block;
    margin: 0 0.55rem;
}

.site-footer a { color: #C4B5FD; }
.site-footer a:visited { color: #C4B5FD; }
.site-footer a:hover { color: #FFFFFF; }

.site-info {
    text-align: center;
    font-size: 0.9rem;
}

.oa-footer-blurb {
    max-width: 620px;
    margin: 0 auto 0.5rem;
    font-size: 0.95rem;
    line-height: 1.6;
    color: #EDE9FE;
}

/* ---------- 404 ---------- */

.oa-404-actions {
    margin-top: var(--oa-gap-block);
}

a.oa-404-link {
    display: inline-block;
    font-family: 'Outfit', system-ui, sans-serif;
    font-weight: 600;
    color: #FFFFFF;
    background: var(--oa-primary);
    border-radius: 999px;
    padding: 0.45rem 1rem;
    text-decoration: none;
    margin-right: 0.5rem;
}

a.oa-404-link:visited { color: #FFFFFF; }
a.oa-404-link:hover { color: #FFFFFF; background: #6327D4; }

/* ---------- Fluent Forms ---------- */

.fluentform .ff-el-input--label label {
    font-family: 'Outfit', system-ui, sans-serif;
    font-weight: 600;
    color: var(--oa-ink);
}

.fluentform .ff-el-form-control {
    border: 1px solid var(--oa-line);
    border-radius: calc(var(--oa-radius) - 6px);
    padding: 0.55rem 0.8rem;
    font-family: 'Crimson Text', Georgia, serif;
    font-size: 1rem;
    background: #FFFFFF;
    color: var(--oa-ink);
}

.fluentform .ff-el-form-control:focus {
    border-color: var(--oa-secondary);
    outline: 2px solid var(--oa-accent-warm);
    outline-offset: 0;
}

.fluentform .ff-btn-submit {
    border-radius: 999px;
    padding: 0.55rem 1.3rem;
    font-family: 'Outfit', system-ui, sans-serif;
    font-weight: 600;
    border: 0;
}

/* ---------- Scroll to top (brief §10: yes) ---------- */

.generate-back-to-top {
    border-radius: 50%;
    box-shadow: var(--oa-shadow);
}

/* ---------- Breadcrumbs ---------- */

.rank-math-breadcrumb {
    font-size: 0.86rem;
    color: #55506E;
    margin-bottom: var(--oa-gap-block);
}

.rank-math-breadcrumb a { color: #5B21B6; }
.rank-math-breadcrumb a:visited { color: #5B21B6; }

/* ---------- Footer nav row (centered-dark, no headings) ---------- */

.oa-footer-links {
    list-style: none;
    margin: 0 auto 0.75rem;
    padding: 0;
    text-align: center;
}

.oa-footer-links li {
    display: inline-block;
    margin: 0.2rem 0.55rem;
}

.site-footer .oa-footer-links a {
    font-family: 'Outfit', system-ui, sans-serif;
    font-size: 0.92rem;
    color: #C4B5FD;
    text-decoration: none;
}

.site-footer .oa-footer-links a:visited { color: #C4B5FD; }
.site-footer .oa-footer-links a:hover { color: #FFFFFF; text-decoration: underline; }