/*
Theme Name: WENS Coffee
Theme URI: https://wensolutions.com/themes/wens-coffee/
Template: wens-haelo
Author: WEN Solutions
Author URI: https://wensolutions.com/
Description: WENS Coffee is a modern and stylish Full Site Editing (FSE) WordPress theme designed specifically for cafés, coffee shops, and roasteries that wish to create a beautiful and engaging online presence. As a child theme of WENS Haelo, it builds upon a solid foundation while adding a cozy, coffee-inspired aesthetic that truly reflects your brand. With its powerful block-based design, WENS Coffee allows you to customize every aspect of your site—headers, footers, menus, and layouts—using the Gutenberg editor, all without requiring any coding skills. The theme includes dedicated sections for a hero banner, featured menu items, an about section, image gallery, events, testimonials, and a blog, providing everything you need to share your café’s story. It is fully responsive, ensuring an excellent viewing experience on all devices, and is SEO-optimized to help your café stand out in search results. Combining elegant design, fast performance, and easy customization, WENS Coffee is ideal for café owners who want a professional-looking website that performs flawlessly and embodies their brand's warmth and authenticity.
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, blog, portfolio
Text Domain: wens-coffee
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.8
Version: 1.0.1

License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* =========================
   Global Table Style
   ========================= */

table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5em 0;
  font-size: 15px;
  line-height: 1.6;
  background-color: #ffffff;
}

/* 表头 */
table thead th {
  background-color: #f5f7fa;
  color: #222;
  font-weight: 600;
  text-align: left;
  padding: 12px 14px;
  border-bottom: 2px solid #e2e6ea;
}

/* 表格内容 */
table tbody td {
  padding: 12px 14px;
  border-bottom: 1px solid #eaecef;
  vertical-align: top;
}

/* 最后一行去掉底线 */
table tbody tr:last-child td {
  border-bottom: none;
}

/* 斑马纹（提升可读性） */
table tbody tr:nth-child(even) {
  background-color: #fafbfc;
}

/* Hover 效果 */
table tbody tr:hover {
  background-color: #f1f5f9;
}

/* 表格里的链接 */
table a {
  color: #2563eb;
  text-decoration: none;
}

table a:hover {
  text-decoration: underline;
}
.entry-content table {
  display: block;
  overflow-x: auto;
  white-space: nowrap;
}
/* 小屏适配 */
@media (max-width: 768px) {
  table {
    font-size: 14px;
  }
}



/* Breadcrumb - fixed alignment & visibility */
.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;

  /* 关键：不居中 */
  justify-content: flex-start;
  text-align: left;

  /* 内容区宽度，和正文一致 */
  max-width: var(--wp--style--global--content-size, 100%);
  margin: 0 auto 1rem 1rem;
  padding: 0 1rem;

  font-size: var(--wp--preset--font-size--small);
  line-height: 1.6;

  color: var(--wp--preset--color--contrast);
}

/* Links */
.breadcrumb a {
  color: var(--wp--preset--color--base);
  text-decoration: none;
  opacity: 0.75;
  white-space: nowrap;
}

.breadcrumb a:hover {
  opacity: 1;
  text-decoration: underline;
}

/* Separator */
.breadcrumb .sep {
  margin: 0 0.35em;
  opacity: 0.4;
}

/* Current page */
.breadcrumb span {
  opacity: 0.85;
  white-space: nowrap;
}
/* Fix breadcrumb color inheritance from hero */
.breadcrumb {
  color: var(--wp--preset--color--contrast);
}

.breadcrumb a {
  color: var(--wp--preset--color--contrast);
}

.breadcrumb span {
  color: var(--wp--preset--color--contrast);
}

/* ========== Breadcrumb mobile fix ========== */

/* 允许整体不溢出 */
.breadcrumb {
  overflow-x: hidden;
}

/* 默认：桌面端保持单行 */
.breadcrumb a,
.breadcrumb span {
  white-space: nowrap;
}

/* 移动端：允许换行 + 防止出屏 */
@media (max-width: 768px) {

  .breadcrumb {
    flex-wrap: wrap;          /* 关键 */
    row-gap: 0.25rem;
  }

  /* 前面的层级允许换行 */
  .breadcrumb a {
    white-space: normal;
    word-break: break-word;
  }

  /* 当前文章标题：最多 2 行，超出省略 */
  .breadcrumb span {
    white-space: normal;
    word-break: break-word;

    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}


/* Category / Term Description Styling */
.wp-block-term-description {
  max-width: 860px;
  margin: 0 auto 3rem;
  padding: 1.5rem 2rem;
  background-color: #f9f9f9;
  border-left: 4px solid #7b4a2e; /* coffee tone */
  font-size: 1rem;
  line-height: 1.8;
  color: #333;
}

.wp-block-term-description p {
  margin-bottom: 1rem;
}

.wp-block-term-description p:last-child {
  margin-bottom: 0;
}
.wp-block-term-description::before {
  content: "Category Overview";
  display: block;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #7b4a2e;
  margin-bottom: 0.75rem;
}


/* 防止图片加载后撑页面 */
.wp-block-image img {
  aspect-ratio: attr(width) / attr(height);
}

/* 防止 header / nav 抖动 */
.site-header {
  min-height: 64px;
}


/* Fix CLS caused by Cover Block */
.home .wp-block-cover {
  min-height: 80vh;
}


/* itacoffee Lightbox click hint */
a.itacoffee-lightbox {
  position: relative;
  display: inline-block;
}

a.itacoffee-lightbox::after {
  content: "Click to enlarge";
  position: absolute;
  right: 8px;
  bottom: 8px;
  font-size: 12px;
  line-height: 1;
  color: #fff;
  background: rgba(0, 0, 0, 0.6);
  padding: 4px 6px;
  border-radius: 4px;
  opacity: 0.85;
  pointer-events: none;
}

.entry-content img {
  max-width: 100% !important;
  height: auto !important;
}