/*
Theme Name: Milan's Kitchen
Theme URI: https://milanskitchen.example
Author: Milan's Kitchen
Author URI: https://milanskitchen.example
Description: Custom WordPress theme for Milan's Kitchen — fresh, made-to-order chicken in Liberty Hill, TX. Reproduces the Milan's Kitchen brand site with a home page, menu, catering, our-town, location, reviews, about, online-ordering, a blog, and a staff price/campaign manager.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: milans-kitchen
Tags: restaurant, food, custom-menu, custom-logo, blog, full-width-template
*/

/* ====================================================================
   Milan's Kitchen — global resets, fonts, keyframes & responsive rules.
   Section-level layout is authored inline in the PHP templates so the
   markup stays a 1:1 match with the approved brand design.
   ==================================================================== */

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'DM Sans', sans-serif;
  background: #F1E7D1;
  color: #223547;
  -webkit-font-smoothing: antialiased;
}
input, textarea, button, select { font-family: inherit; }
img { max-width: 100%; }
a { color: inherit; }

/* WordPress core / accessibility helpers */
.screen-reader-text {
  border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
  height: 1px; width: 1px; margin: -1px; overflow: hidden;
  padding: 0; position: absolute !important; word-wrap: normal !important;
}
.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 100000;
  background: #223547; color: #C2933A; padding: 12px 18px;
  font-family: 'Oswald', sans-serif; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em; text-decoration: none; border-radius: 0 0 10px 0;
}
.skip-link:focus { left: 0; }

.mk-admin-bar-offset { /* leaves room when the WP admin bar is shown */ }

/* Animations carried over from the brand design */
@keyframes mkfade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes mkpulse { 0%,100%{opacity:1;} 50%{opacity:.65;} }
@keyframes mkscroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* Blog / generic WordPress content typography */
.mk-prose { font-size: 17px; line-height: 1.7; color: #46382C; }
.mk-prose p { margin: 0 0 18px; }
.mk-prose h2 { font-family: 'Oswald', sans-serif; font-weight: 700; text-transform: uppercase; font-size: 30px; color: #223547; margin: 32px 0 12px; }
.mk-prose h3 { font-family: 'Oswald', sans-serif; font-weight: 600; text-transform: uppercase; font-size: 22px; color: #223547; margin: 26px 0 10px; }
.mk-prose a { color: #A23A29; font-weight: 700; }
.mk-prose img { border-radius: 12px; border: 2px solid #223547; height: auto; }
.mk-prose blockquote {
  border-left: 4px solid #C2933A; margin: 22px 0; padding: 8px 0 8px 20px;
  font-size: 19px; font-style: italic; color: #4A3F36;
}
.mk-prose ul, .mk-prose ol { margin: 0 0 18px; padding-left: 22px; }
.mk-prose li { margin: 6px 0; }
.mk-prose code { background: #FBF6EA; border: 1px solid #DAC9A0; border-radius: 5px; padding: 2px 6px; font-size: .9em; }

/* WP alignment + caption classes */
.aligncenter { display: block; margin: 18px auto; }
.alignright { float: right; margin: 6px 0 16px 24px; }
.alignleft { float: left; margin: 6px 24px 16px 0; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 13px; color: #8A7C6E; text-align: center; margin-top: 6px; }
.sticky, .gallery-caption, .bypostauthor { display: block; }

/* Pagination */
.mk-pagination { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 40px; }
.mk-pagination .page-numbers {
  display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px;
  padding: 0 14px; background: #FBF6EA; border: 2px solid #223547; border-radius: 10px;
  font-family: 'Oswald', sans-serif; font-weight: 700; text-transform: uppercase; color: #223547;
  text-decoration: none; box-shadow: 0 3px 0 #DAC9A0;
}
.mk-pagination .page-numbers.current { background: #A23A29; color: #FBF6EA; box-shadow: 0 3px 0 #7C2C1E; }
.mk-pagination .page-numbers.dots { border: none; box-shadow: none; background: none; }

/* Comments */
.mk-comment-list { list-style: none; margin: 0; padding: 0; }
.mk-comment-list .children { list-style: none; margin: 0 0 0 28px; padding: 0; }
.mk-comment-body {
  background: #FBF6EA; border: 2px solid #223547; border-radius: 14px;
  padding: 18px 20px; margin: 0 0 16px; box-shadow: 0 4px 0 #DAC9A0;
}
.mk-comment-meta { font-family: 'Oswald', sans-serif; font-weight: 700; text-transform: uppercase; color: #A23A29; font-size: 14px; margin-bottom: 6px; }
.mk-comment-form input[type=text], .mk-comment-form input[type=email], .mk-comment-form input[type=url], .mk-comment-form textarea {
  width: 100%; border: 2px solid #D5C49E; border-radius: 9px; padding: 12px 14px;
  font-size: 15px; color: #223547; background: #FCF8EF; outline: none; margin-bottom: 14px;
}

/* ============ Responsive (carried over from the brand design) ============ */
@media (max-width: 880px) {
  .mk-desk-nav { display: none !important; }
  .mk-burger { display: flex !important; }
  .mk-hero-grid { grid-template-columns: 1fr !important; gap: 0 !important; }
  .mk-fav-grid { grid-template-columns: 1fr 1fr !important; }
  .mk-split { grid-template-columns: 1fr !important; }
  .mk-heat-grid { grid-template-columns: 1fr 1fr 1fr !important; }
  .mk-rev-grid { grid-template-columns: 1fr 1fr !important; }
  .mk-menu-grid { grid-template-columns: 1fr 1fr !important; }
  .mk-foot-grid { grid-template-columns: 1fr 1fr !important; }
  .mk-blog-grid { grid-template-columns: 1fr !important; }
  .mk-bottom-bar { display: flex !important; }
}
@media (max-width: 560px) {
  .mk-social-label { display: none !important; }
  .mk-menu-grid { grid-template-columns: 1fr !important; }
  .mk-fav-grid { grid-template-columns: 1fr !important; }
  .mk-heat-grid { grid-template-columns: 1fr 1fr !important; }
  .mk-rev-grid { grid-template-columns: 1fr !important; }
  .mk-form-grid { grid-template-columns: 1fr !important; }
  .mk-foot-grid { grid-template-columns: 1fr !important; }
}