/*
Theme Name: Only Way Is Burgh Red
Theme URI: https://onlywayisburgh.football/
Author: Ricky Kelly
Description: Clean red and white football theme for The Only Way Is Burgh fan site. Built around the Burgh match shortcodes.
Version: 1.2.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 8.0
License: GPLv2 or later
Text Domain: only-way-is-burgh-red
*/

:root{
  --burgh-red:#b00012;
  --burgh-red-dark:#76000c;
  --burgh-red-bright:#d6001c;
  --burgh-black:#111111;
  --burgh-white:#ffffff;
  --burgh-bg:#f3f3f3;
  --burgh-line:#dddddd;
  --burgh-text:#151515;
  --burgh-muted:#666666;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--burgh-bg);
  color:var(--burgh-text);
  font-family:Arial, Helvetica, sans-serif;
  font-size:16px;
  line-height:1.55;
}

a{color:var(--burgh-red);font-weight:800;text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}

.site-topline{height:7px;background:var(--burgh-black)}
.site-header{background:var(--burgh-white);border-bottom:1px solid var(--burgh-line)}
.brand-banner{background:var(--burgh-red-dark)}
.brand-banner img{display:block;width:100%;height:auto;margin:0 auto}

.header-inner{max-width:1180px;margin:0 auto;padding:0 14px}
.site-branding-text{position:absolute;left:-9999px}

.main-navigation{background:var(--burgh-black)}
.main-navigation .menu-wrap{max-width:1180px;margin:0 auto;padding:0 14px}
.main-navigation ul{margin:0;padding:0;list-style:none;display:flex;gap:0;flex-wrap:wrap}
.main-navigation a{
  display:block;
  color:var(--burgh-white);
  padding:14px 16px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.02em;
  font-size:14px;
}
.main-navigation a:hover,
.main-navigation .current-menu-item>a{
  background:var(--burgh-red);
  color:var(--burgh-white);
  text-decoration:none;
}

.site-main{max-width:1180px;margin:0 auto;padding:24px 14px 44px}
.content-wrap{background:var(--burgh-white);border:1px solid var(--burgh-line);padding:22px}

.entry-title,h1{font-size:34px;line-height:1.15;margin:0 0 18px;font-weight:900;color:var(--burgh-black)}
h2{font-size:24px;line-height:1.2;margin:0 0 14px;color:var(--burgh-black);font-weight:900}
h3{font-size:20px;margin:20px 0 10px;color:var(--burgh-black)}
p{margin:0 0 16px}

.front-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
.front-section{
  background:var(--burgh-white);
  border:1px solid var(--burgh-line);
  border-top:5px solid var(--burgh-red);
  padding:18px;
  box-shadow:0 2px 8px rgba(0,0,0,.05);
}
.front-section.full{grid-column:1/-1}
.front-section-title{margin:0 0 14px;font-size:24px;font-weight:900;color:var(--burgh-black)}

/* Shortcode output tidy-up */
.front-section > :last-child{margin-bottom:0}
.burgh-card,
.match-card,
.fixture-card,
.result-card{
  background:var(--burgh-white)!important;
  border:1px solid var(--burgh-line)!important;
  border-left:5px solid var(--burgh-red)!important;
  border-radius:0!important;
  box-shadow:none!important;
}

button,input[type="submit"],.button,.wp-block-button__link,
a[class*="button"],a[class*="centre"],a[class*="match"]{
  background:var(--burgh-red);
  color:var(--burgh-white)!important;
  border:0;
  padding:10px 14px;
  font-weight:900;
  border-radius:0;
  cursor:pointer;
}
button:hover,input[type="submit"]:hover,.button:hover,.wp-block-button__link:hover{background:var(--burgh-black);text-decoration:none}
input,select,textarea{max-width:100%;border:1px solid #ccc;padding:10px;font:inherit}

table{width:100%;border-collapse:collapse;background:var(--burgh-white);margin:12px 0 22px;border:1px solid var(--burgh-line);font-size:15px}
th,td{padding:10px;border:1px solid var(--burgh-line);text-align:left;vertical-align:middle}
th{background:var(--burgh-red);color:var(--burgh-white);font-weight:900}
tr:nth-child(even) td{background:#fafafa}
tr:hover td{background:#fff5f6}

.post-list{display:grid;gap:18px}.post-card{background:var(--burgh-white);border:1px solid var(--burgh-line);border-top:5px solid var(--burgh-red);padding:18px}.post-card h2{margin-top:0}
.site-footer{border-top:1px solid var(--burgh-line);background:var(--burgh-black);color:#ddd}.footer-inner{max-width:1180px;margin:0 auto;padding:18px 14px;font-size:14px}.site-footer a{color:#fff}

@media(max-width:800px){
  .front-grid{grid-template-columns:1fr}
  .main-navigation ul{display:block}
  .main-navigation li{border-top:1px solid #333}
  .main-navigation a{padding:12px 14px}
  .site-main{padding-top:16px}
  .entry-title,h1{font-size:28px}
  .front-section{padding:14px}
  table{display:block;overflow-x:auto;white-space:nowrap}
}
