/*!
 * Olio — Main frontend styles
 * Espresso surfaces · cream cards · saffron + crimson accents
 */

/* ------------------------------------------------------------
 * 1. Layout primitives
 * ---------------------------------------------------------- */
.olio-container { max-width: 1320px; margin-inline: auto; padding-inline: var(--wp--preset--spacing--md, 2rem); }
.olio-main { min-height: 60vh; }
.olio-main:focus { outline: none; }

/* ------------------------------------------------------------
 * 2. Pagination + page links
 * ---------------------------------------------------------- */
.olio-pagination .nav-links { display: flex; gap: 0.5rem; align-items: center; justify-content: space-between; padding-block: var(--wp--preset--spacing--md); border-top: 1px solid var(--wp--preset--color--border); }
.olio-pagination a, .olio-pagination span { padding: 0.5rem 0.875rem; border: 1px solid var(--wp--preset--color--border); text-decoration: none; font-size: 0.875rem; letter-spacing: 0.04em; }
.olio-pagination a:hover, .olio-pagination .current { background: var(--wp--preset--color--saffron); color: var(--wp--preset--color--espresso-deep); border-color: var(--wp--preset--color--saffron); }

.olio-page-links { display: flex; gap: 0.5rem; align-items: center; padding-block: var(--wp--preset--spacing--sm); font-size: 0.875rem; }
.olio-page-links span { padding: 0.25rem 0.5rem; border: 1px solid var(--wp--preset--color--border); }
.olio-page-links a span { border-color: transparent; }

/* ------------------------------------------------------------
 * 3. Search form
 * ---------------------------------------------------------- */
.olio-search-form { display: flex; gap: 0.5rem; max-width: 560px; }
.olio-search-form__input { flex: 1; padding: 0.875rem 1rem; background: var(--wp--preset--color--espresso-soft); color: var(--wp--preset--color--cream); border: 1px solid var(--wp--preset--color--border); font-size: 1rem; }
.olio-search-form__input:focus { outline: 2px solid var(--wp--preset--color--saffron); outline-offset: 1px; }
.olio-search-form__submit { padding: 0.875rem 1.25rem; background: var(--wp--preset--color--saffron); color: var(--wp--preset--color--espresso-deep); border: 0; cursor: pointer; font-weight: 600; }

/* ------------------------------------------------------------
 * 4. Post cards (used in index/archive)
 * ---------------------------------------------------------- */
.olio-post-card { background: var(--wp--preset--color--espresso-soft); border: 1px solid var(--wp--preset--color--border); overflow: hidden; transition: transform 220ms var(--olio-ease, ease), box-shadow 220ms var(--olio-ease, ease); }
.olio-post-card:hover { transform: translateY(-3px); box-shadow: var(--wp--preset--shadow--md); }
.olio-post-card img { width: 100%; height: auto; display: block; }

/* ------------------------------------------------------------
 * 5. Block: olio/dish-card
 * ---------------------------------------------------------- */
.olio-dish-card { background: var(--wp--preset--color--espresso-soft); color: var(--wp--preset--color--cream); border: 1px solid var(--wp--preset--color--border); overflow: hidden; display: flex; flex-direction: column; height: 100%; transition: transform 220ms var(--olio-ease, ease), box-shadow 220ms var(--olio-ease, ease); }
.olio-dish-card:hover { transform: translateY(-3px); box-shadow: var(--wp--preset--shadow--md); }
.olio-dish-card__media { display: block; overflow: hidden; }
.olio-dish-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--olio-ease, ease); }
.olio-dish-card:hover .olio-dish-card__media img { transform: scale(1.04); }
.olio-dish-card__body { padding: 1.25rem; display: flex; flex-direction: column; gap: 0.625rem; flex: 1; }
.olio-dish-card__course { margin: 0; font-size: 0.75rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--wp--preset--color--saffron); }
.olio-dish-card__title { margin: 0; font-family: var(--wp--preset--font-family--display); font-size: 1.375rem; font-weight: 400; line-height: 1.15; display: flex; align-items: baseline; gap: 0.5rem; }
.olio-dish-card__title a { color: inherit; text-decoration: none; }
.olio-dish-card__title a:hover { color: var(--wp--preset--color--saffron); }
.olio-dish-card__dots { flex: 1; min-width: 1rem; border-bottom: 1px dotted var(--wp--preset--color--border); transform: translateY(-3px); }
.olio-dish-card__price { font-family: var(--wp--preset--font-family--sans); font-size: 0.95rem; color: var(--wp--preset--color--saffron); white-space: nowrap; }
.olio-dish-card__excerpt { margin: 0; font-size: 0.95rem; line-height: 1.6; color: var(--wp--preset--color--ink-subtle); }
.olio-dish-card__allergens { margin: 0; padding-top: 0.5rem; font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--ink-muted); border-top: 1px solid var(--wp--preset--color--border); }

/* ------------------------------------------------------------
 * 6. Block: olio/menu-section
 * ---------------------------------------------------------- */
.olio-menu-section { max-width: 800px; margin-inline: auto; }
.olio-menu-section--cols-2 { max-width: 1320px; }
.olio-menu-section--cols-3 { max-width: 1320px; }
.olio-menu-section__head { text-align: center; margin-bottom: var(--wp--preset--spacing--md); padding-block: var(--wp--preset--spacing--sm); border-bottom: 1px solid var(--wp--preset--color--border); }
.olio-menu-section__kicker { margin: 0 0 0.5rem; font-size: 0.75rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--wp--preset--color--saffron); }
.olio-menu-section__title { margin: 0; font-family: var(--wp--preset--font-family--display); font-size: clamp(2rem, 4vw, 3rem); font-weight: 400; font-style: italic; }
.olio-menu-section__list { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--wp--preset--spacing--md); }
.olio-menu-section--cols-2 .olio-menu-section__list { grid-template-columns: repeat(2, 1fr); gap: var(--wp--preset--spacing--lg); }
.olio-menu-section--cols-3 .olio-menu-section__list { grid-template-columns: repeat(3, 1fr); gap: var(--wp--preset--spacing--md); }
.olio-menu-section__item { display: flex; flex-direction: column; gap: 0.375rem; }
.olio-menu-section__item-title { margin: 0; font-family: var(--wp--preset--font-family--display); font-size: 1.375rem; font-weight: 400; display: flex; align-items: baseline; gap: 0.5rem; line-height: 1.2; }
.olio-menu-section__item-title a { color: inherit; text-decoration: none; }
.olio-menu-section__item-title a:hover { color: var(--wp--preset--color--saffron); }
.olio-menu-section__dots { flex: 1; min-width: 1.5rem; border-bottom: 1px dotted var(--wp--preset--color--border); transform: translateY(-4px); }
.olio-menu-section__price { font-family: var(--wp--preset--font-family--sans); color: var(--wp--preset--color--saffron); font-size: 1rem; white-space: nowrap; }
.olio-menu-section__excerpt { margin: 0; padding-left: 0.5rem; font-size: 0.95rem; line-height: 1.6; color: var(--wp--preset--color--ink-subtle); font-style: italic; }

@media (max-width: 720px) {
	.olio-menu-section--cols-2 .olio-menu-section__list,
	.olio-menu-section--cols-3 .olio-menu-section__list { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------
 * 7. Block: olio/specials-board
 * ---------------------------------------------------------- */
.olio-specials { padding-block: var(--wp--preset--spacing--lg); }
.olio-specials__board { background: var(--wp--preset--color--espresso-deep); color: var(--wp--preset--color--cream); padding: clamp(2rem, 5vw, 4rem); border: 1px solid var(--wp--preset--color--saffron-deep); box-shadow: var(--wp--preset--shadow--saffron); position: relative; overflow: hidden; }
.olio-specials__board::before { content: ""; position: absolute; inset: 8px; border: 1px dashed rgba(216, 154, 58, 0.35); pointer-events: none; }
.olio-specials__title { margin: 0 0 1.5rem; font-family: var(--wp--preset--font-family--script); font-size: clamp(2.5rem, 6vw, 4rem); font-weight: 400; color: var(--wp--preset--color--saffron); text-align: center; }
.olio-specials__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.olio-specials__item { display: grid; grid-template-columns: 1fr auto auto; gap: 1rem; align-items: baseline; padding-bottom: 1rem; border-bottom: 1px dotted rgba(216, 154, 58, 0.25); font-family: var(--wp--preset--font-family--script); font-size: clamp(1.25rem, 2.4vw, 1.625rem); }
.olio-specials__item:last-child { border-bottom: 0; }
.olio-specials__course { font-family: var(--wp--preset--font-family--sans); font-size: 0.7rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--wp--preset--color--saffron-soft); }
.olio-specials__price { font-family: var(--wp--preset--font-family--sans); font-size: 0.95rem; color: var(--wp--preset--color--saffron); }
.olio-specials__sign { margin: 1.5rem 0 0; text-align: right; font-family: var(--wp--preset--font-family--script); color: var(--wp--preset--color--saffron-soft); font-size: 1.25rem; }
.olio-specials__empty { text-align: center; opacity: 0.7; font-style: italic; }

/* ------------------------------------------------------------
 * 8. Block: olio/hours-strip
 * ---------------------------------------------------------- */
.olio-hours { padding: var(--wp--preset--spacing--md); border: 1px solid var(--wp--preset--color--border); background: var(--wp--preset--color--espresso-soft); }
.olio-hours__title { margin: 0 0 1rem; font-family: var(--wp--preset--font-family--display); font-size: 1.5rem; font-weight: 400; }
.olio-hours__list { margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.olio-hours__row { display: grid; grid-template-columns: 4rem 1fr; gap: 1rem; align-items: center; padding: 0.5rem 0.75rem; font-size: 0.95rem; }
.olio-hours__row.is-today { background: rgba(216, 154, 58, 0.12); border-left: 2px solid var(--wp--preset--color--saffron); }
.olio-hours__day { margin: 0; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; font-size: 0.75rem; color: var(--wp--preset--color--ink-subtle); }
.olio-hours__time { margin: 0; font-variant-numeric: tabular-nums; }
.olio-hours--compact .olio-hours__row { grid-template-columns: 3rem 1fr; padding: 0.25rem 0.5rem; font-size: 0.875rem; }

/* ------------------------------------------------------------
 * 9. Block: olio/press-strip
 * ---------------------------------------------------------- */
.olio-press { padding-block: var(--wp--preset--spacing--lg); text-align: center; border-block: 1px solid var(--wp--preset--color--border); }
.olio-press__title { margin: 0 0 1.5rem; font-size: 0.75rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--wp--preset--color--ink-subtle); font-weight: 500; font-family: var(--wp--preset--font-family--sans); }
.olio-press__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 2rem 3rem; justify-content: center; align-items: center; }
.olio-press__item { display: flex; flex-direction: column; gap: 0.25rem; align-items: center; }
.olio-press__label { font-family: var(--wp--preset--font-family--display); font-size: 1.5rem; font-style: italic; line-height: 1; }
.olio-press__note { font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--ink-subtle); }

/* ------------------------------------------------------------
 * 10. Block: olio/gallery-tile
 * ---------------------------------------------------------- */
.olio-tile { margin: 0; position: relative; overflow: hidden; background: var(--wp--preset--color--espresso-deep); }
.olio-tile__media { display: block; width: 100%; height: 100%; }
.olio-tile__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 800ms var(--olio-ease, ease); }
.olio-tile:hover .olio-tile__media img { transform: scale(1.04); }
.olio-tile__caption { position: absolute; left: 0; right: 0; bottom: 0; padding: 1rem; background: linear-gradient(180deg, transparent 0%, rgba(15,11,8,0.85) 100%); color: var(--wp--preset--color--cream); font-size: 0.875rem; letter-spacing: 0.04em; }

/* ------------------------------------------------------------
 * 11. Block: olio/reservation-cta
 * ---------------------------------------------------------- */
.olio-cta { padding: var(--wp--preset--spacing--xl) var(--wp--preset--spacing--md); background: var(--wp--preset--gradient--olio-flame, var(--wp--preset--color--crimson)); color: var(--wp--preset--color--cream); text-align: center; }
.olio-cta__body { max-width: 640px; margin-inline: auto; display: grid; gap: 1.5rem; }
.olio-cta__title { margin: 0; font-family: var(--wp--preset--font-family--display); font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 400; }
.olio-cta__copy { margin: 0; font-size: 1.0625rem; line-height: 1.65; opacity: 0.95; }
.olio-cta__channels { display: flex; flex-wrap: wrap; gap: 1.5rem; justify-content: center; }
.olio-cta__channel { display: flex; flex-direction: column; gap: 0.25rem; color: inherit; text-decoration: none; padding: 0.75rem 1.25rem; border: 1px solid rgba(242, 234, 216, 0.35); }
.olio-cta__channel:hover { background: rgba(242, 234, 216, 0.08); }
.olio-cta__channel-label { font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; opacity: 0.75; }
.olio-cta__channel-value { font-size: 1.0625rem; font-weight: 600; }
.olio-cta__button-row { margin: 0; }
.olio-cta__button { display: inline-block; padding: 1rem 2.25rem; background: var(--wp--preset--color--cream); color: var(--wp--preset--color--espresso-deep); text-decoration: none; font-size: 0.875rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; }
.olio-cta__button:hover { background: var(--wp--preset--color--saffron); color: var(--wp--preset--color--espresso-deep); }

/* ------------------------------------------------------------
 * 12. Site header / footer
 * ---------------------------------------------------------- */
.olio-site-header.olio-site-header--minimal { border-bottom: 0; }
.olio--sticky-header .olio-site-header { position: sticky; top: 0; z-index: 50; backdrop-filter: blur(6px); }

.olio-site-footer .wp-block-navigation { color: inherit; }

/* ------------------------------------------------------------
 * 13. Block styles (custom registered styles)
 * ---------------------------------------------------------- */
.is-style-olio-paper { background: var(--wp--preset--color--cream); color: var(--wp--preset--color--espresso-deep); border: 1px solid var(--wp--preset--color--cream-deep); }
.is-style-olio-paper :where(h1,h2,h3,h4,h5,h6) { color: var(--wp--preset--color--espresso-deep); }
.is-style-olio-espresso { background: var(--wp--preset--color--espresso-soft); color: var(--wp--preset--color--cream); border: 1px solid var(--wp--preset--color--border); }
.is-style-olio-chalkboard { background: var(--wp--preset--color--espresso-deep); color: var(--wp--preset--color--saffron-soft); border: 1px solid var(--wp--preset--color--saffron-deep); font-family: var(--wp--preset--font-family--script); padding: var(--wp--preset--spacing--md); }
.is-style-olio-section { padding-block: var(--wp--preset--spacing--xl); padding-inline: var(--wp--preset--spacing--md); }

.wp-block-button.is-style-olio-saffron .wp-block-button__link { background: var(--wp--preset--color--saffron); color: var(--wp--preset--color--espresso-deep); }
.wp-block-button.is-style-olio-crimson .wp-block-button__link { background: var(--wp--preset--color--crimson); color: var(--wp--preset--color--cream); }
.wp-block-button.is-style-olio-cream .wp-block-button__link { background: var(--wp--preset--color--cream); color: var(--wp--preset--color--espresso-deep); }
.wp-block-button.is-style-olio-outline .wp-block-button__link { background: transparent; color: currentColor; border: 1px solid currentColor; }
.wp-block-button.is-style-olio-outline .wp-block-button__link:hover { background: currentColor; color: var(--wp--preset--color--espresso-deep); }

.wp-block-separator.is-style-olio-rule { border: 0; border-top: 1px solid var(--wp--preset--color--border); max-width: 240px; margin-inline: auto; }
.wp-block-separator.is-style-olio-leaf { border: 0; height: 1.5rem; background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 16' fill='none' stroke='%23D89A3A' stroke-width='1.25'%3E%3Cpath d='M2 8h22M40 8h22'/%3E%3Cpath d='M32 4c2 2 2 6 0 8 -2-2 -2-6 0-8z' fill='%23D89A3A' stroke='none'/%3E%3C/svg%3E"); }

.wp-block-image.is-style-olio-frame img { border: 1px solid var(--wp--preset--color--saffron-deep); padding: 0.5rem; background: var(--wp--preset--color--espresso-soft); }
.wp-block-image.is-style-olio-warm img { filter: sepia(0.15) saturate(1.1) hue-rotate(-5deg); }

.wp-block-quote.is-style-olio-chef { border-left: 0; padding-left: 0; text-align: center; }
.wp-block-quote.is-style-olio-chef p { font-family: var(--wp--preset--font-family--script); font-size: clamp(1.75rem, 4vw, 2.5rem); font-style: normal; line-height: 1.3; }
.wp-block-quote.is-style-olio-chef cite { display: block; margin-top: 1rem; font-family: var(--wp--preset--font-family--sans); font-style: normal; font-size: 0.75rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--wp--preset--color--saffron); }

/* ------------------------------------------------------------
 * 14. Accessibility helpers
 * ---------------------------------------------------------- */
:focus-visible { outline: 2px solid var(--wp--preset--color--saffron); outline-offset: 2px; }
.olio :where(a):not(.wp-block-button__link):not(.olio-cta__button):not(.olio-cta__channel):focus-visible { background: rgba(216, 154, 58, 0.12); }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* ------------------------------------------------------------
 * 15. Print stylesheet (menu print-ready)
 * ---------------------------------------------------------- */
@media print {
	.olio-site-header, .olio-site-footer, .olio-cta, .olio-specials__board::before { display: none !important; }
	body { background: white !important; color: black !important; }
	.olio-menu-section__item-title { color: black; }
	.olio-menu-section__price, .olio-menu-section__kicker { color: #5C6841 !important; }
}

/* === WordPress standard accessibility / alignment / gallery / caption classes (Theme Check required) === */
.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; }
.screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0,0,0,.6); clip: auto !important; clip-path: none; color: #21759b; display: block; font-size: 14px; font-weight: 700; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; }
.alignleft  { float: left;  margin-right: 1.5em; }
.alignright { float: right; margin-left:  1.5em; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignwide { max-width: 100vw; }
.alignfull { max-width: 100vw; }
.sticky { display: block; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 0.9em; text-align: center; }
.gallery-caption { font-size: 0.85em; }
.bypostauthor { display: block; }
