/*
Theme Name: Farine Sable
Template: generatepress
Version: 1.0.0
*/

:root {
  --color-primary: #4D7C0F;
  --color-secondary: #65A30D;
  --color-accent: #84CC16;
  --color-accent-warm: #F5ECD7;
  --color-surface: #F7FEE7;
  --color-background: #FFFFFF;
  --color-text: #1A2E05;
  --color-text-secondary: #4B5563;
  --color-border: #D9F0B4;
  --radius: 16px;
  --section-gap: 6rem;
  --block-gap: 2rem;
  --container-padding: 3rem;
}

body { font-family: "Crimson Text", Georgia, serif; font-weight: 400; color: var(--color-text); }
h1, h2, h3, h4, h5, h6, .site-title { font-family: "Outfit", -apple-system, sans-serif; font-weight: 700; color: var(--color-text); }
.entry-content a, .site-footer a { color: var(--color-primary); }
button, .button, .wp-block-button__link { border-radius: var(--radius); }
.wp-block-post, article.post { border-radius: var(--radius); }

@font-face { font-family: "Outfit"; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Outfit-Regular.woff2) format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Outfit-SemiBold.woff2) format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Outfit-Bold.woff2) format("woff2"); }
@font-face { font-family: "Crimson Text"; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/CrimsonText-Regular.woff2) format("woff2"); }
@font-face { font-family: "Crimson Text"; font-style: italic; font-weight: 400; font-display: swap; src: url(assets/fonts/CrimsonText-Italic.woff2) format("woff2"); }
@font-face { font-family: "Crimson Text"; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/CrimsonText-Bold.woff2) format("woff2"); }

/* Search input styling (classic + block) */
.widget_search .search-field,
.wp-block-search__input {
  border: 1px solid var(--color-border, var(--color-accent-warm, #ddd));
  border-radius: var(--radius, 8px);
  padding: 8px 12px;
  font-family: inherit;
  font-size: 1rem;
  width: 100%;
  background: var(--color-background, #fff);
  color: var(--color-text);
}
.widget_search .search-field:focus,
.wp-block-search__input:focus {
  outline: 2px solid var(--color-primary);
  outline-offset: 1px;
}
.widget_search .search-submit,
.wp-block-search__button {
  background: var(--color-primary, currentColor);
  color: #fff;
  border: none;
  border-radius: var(--radius, 8px);
  padding: 8px 16px;
  font-family: inherit;
  font-weight: 600;
  cursor: pointer;
}
.widget_search .search-submit:hover,
.wp-block-search__button:hover {
  background: var(--color-secondary, var(--color-primary));
}
.widget_search .search-submit svg { fill: currentColor; }


/* Circular avatar crop */
.avatar-circle img { border-radius: 50%; object-fit: cover; }

/* Chrome Audit #5 Fix 8 — search button olive green */
body .widget_search .search-submit,
body .wp-block-search__button,
body .widget_search .search-submit:focus,
body .wp-block-search__button:focus {
  background-color: #4D7C0F;
  color: #FFFFFF;
}
body .widget_search .search-submit:hover,
body .wp-block-search__button:hover {
  background-color: #65A30D;
  color: #FFFFFF;
}
body .widget_search .search-submit svg,
body .wp-block-search__button svg {
  fill: #FFFFFF;
}

/* Chrome Audit #5 Fix 11 — hamburger on LEFT */
@media (max-width: 1023px) {
  .mobile-header-navigation .inside-navigation {
    justify-content: space-between;
  }
  .mobile-header-navigation button.menu-toggle {
    order: 1;
    margin-left: 0 !important;
    margin-right: auto !important;
  }
  .mobile-header-navigation .site-logo,
  .mobile-header-navigation .site-branding,
  .mobile-header-navigation .navigation-branding {
    order: 2;
    margin-left: auto;
    margin-right: 0;
  }
}

/* Chrome Audit #6 FIX 4 — extend search button olive to 404 page body search form (not only widget) */
body .search-form .search-submit,
body .search-form .search-submit:focus {
  background-color: #4D7C0F !important;
  color: #FFFFFF !important;
}
body .search-form .search-submit:hover {
  background-color: #65A30D !important;
  color: #FFFFFF !important;
}
body .search-form .search-submit svg {
  fill: #FFFFFF !important;
}