/* hotelkotyza.cz, small fixes for the menu pages (2026-11-03, Václav: "readable better on phones", "try not to
   overhaul it"). Only pages that hold a menu block (.hk-menu): the daily menus, their list and Restaurace.
   The menu's own look (colours, headings, dotted lines, bold prices) stays as Tvorba menu makes it. */

/* Phones: the theme (Fruitful, a Skeleton grid from 2012) keeps pages 300 px wide below 480 px and 420 px below
   768 px, and its posts narrower still, so a menu got about 58 % of a phone's width and most dishes broke into three
   lines. Menu pages now use the screen. !important because the theme's own rules are more specific. */
@media (max-width: 767px) {
  html body:has(.hk-menu) .container { width: auto !important; margin-left: 10px !important; margin-right: 10px !important; }
  html body:has(.hk-menu) .container .column,
  html body:has(.hk-menu) .container .columns,
  html body:has(.hk-menu) article.post,
  html body:has(.hk-menu) article.page,
  html body:has(.hk-menu) .post-content { width: auto !important; float: none !important; margin-left: 0 !important; margin-right: 0 !important; }
  html body:has(.hk-menu) article.post,
  html body:has(.hk-menu) article.page { padding-left: 0 !important; padding-right: 0 !important; }
  html body:has(.hk-menu) .entry-content { padding-left: 8px !important; padding-right: 8px !important; }
  html body:has(.hk-menu) #nav-below { padding-left: 12px !important; padding-right: 12px !important; }
  html body .hk-menu { padding: 18px 14px 16px; }
}
@media (max-width: 520px) {
  html body .hk-menu .hk-item,
  html body .hk-menu .hk-price { font-size: 16px; }
}

/* The price sat a few pixels below its dish's line; the same line height puts both on one baseline. */
html body .hk-menu .hk-price { line-height: 1.45 !important; }