/* CoffeeWineTea.com MyBB Theme */
@import url(https://fonts.googleapis.com/css2?family=Mulish:wght@400;600;700&family=Prata&display=swap);

body { font-family: 'Mulish', sans-serif; color: #333; background: #f5f5f5; }
h1, h2, h3, h4, .thead { font-family: 'Prata', serif; color: #ddbd6a; }

/* Fix search box layout */
#panel .upper .wrapper { overflow: hidden; }
#search { float: right; }
.welcome { float: left; }

/* Logo size */
#logo img { max-height: 80px; width: auto; }

.thead { background: #ddbd6a !important; color: #fff !important; }
.tcat { background: #191919 !important; color: #fff !important; }
.tcat a { color: #ddbd6a !important; }
.trow1 { background: #fff; }
.trow2 { background: #fafafa; }
a { color: #dd9933; }
a:hover { color: #ff2c54; }
.button, input[type="submit"] { background: #ddbd6a !important; color: #fff !important; border: none !important; }
.button:hover, input[type="submit"]:hover { background: #ff2c54 !important; }
#footer { background: #191919; color: #fff; }
#footer a { color: #ddbd6a; }

/* ===== LXB mobile responsive layer (added 2026-06-20) ===== */
@media (max-width: 768px) {
  html { -webkit-text-size-adjust: 100%; }
  #container { width: auto !important; min-width: 0 !important; margin: 0 !important; }
  #content { padding: 8px !important; }
  #header { text-align: center; }
  #logo, .logo { float: none !important; text-align: center; }
  #logo img, .logo img { max-width: 100% !important; height: auto !important; }
  #panel { float: none !important; width: auto !important; height: auto !important; text-align: center; }
  #search { float: none !important; width: 100% !important; margin: 6px 0 !important; }
  #search input.textbox { width: 55% !important; }
  .menu { float: none !important; }
  .menu ul { display: flex; flex-wrap: wrap; justify-content: center; padding-left: 0 !important; }
  .menu li { float: none !important; }
  .tborder, table.tborder { display: block !important; width: 100% !important; overflow-x: auto; }
  .post .post_author { float: none !important; width: auto !important; border-right: 0 !important; }
  .post .post_content, .post .post_body { margin-left: 0 !important; }
  .author_avatar img { max-width: 56px; height: auto; }
  img, iframe, video, embed, object { max-width: 100% !important; height: auto; }
  #footer .menu, #footer ul { text-align: center; }
}
@media (max-width: 480px) {
  #content { padding: 5px !important; }
  #search input.textbox { width: 48% !important; }
  .author_avatar img { max-width: 44px; }
}
/* ===== end LXB mobile responsive layer ===== */

/* wrapper overflow fix */
@media (max-width: 768px) {
  .wrapper { min-width: 0 !important; width: auto !important; max-width: 100% !important; box-sizing: border-box; }
  #container { max-width: 100% !important; box-sizing: border-box; }
  html, body { max-width: 100% !important; overflow-x: hidden !important; }
}

/* mobile menu welcome fix */
@media (max-width: 768px) {
  ul.menu { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; align-items: center; padding-left: 0 !important; margin: 0 !important; list-style: none; }
  ul.menu li { float: none !important; }
  ul.menu li a { white-space: nowrap; padding: 5px 8px !important; font-size: clamp(11px, 3.2vw, 14px) !important; }
  #panel, #panel .upper, #panel .upper .wrapper { width: auto !important; max-width: 100% !important; min-width: 0 !important; display: block !important; float: none !important; box-sizing: border-box; }
  .welcome { float: none !important; display: block !important; width: 100% !important; max-width: 100% !important; white-space: normal !important; word-break: normal !important; overflow-wrap: normal !important; text-align: center; }
}