/*
Theme Name: Tranzeet TV
Theme URI: https://tranzeettv.com
Description: Custom secure child theme for Tranzeet TV, rebuilt from scratch after the previous theme was compromised. Hand-coded single/archive templates + Elementor homepage.
Author: Daniel
Template: hello-elementor
Version: 1.0.0
Text Domain: tranzeettv
*/

/* ==========================================================================
   Design tokens
   ========================================================================== */
:root{
  --tz-navy:#0b1f3a;
  --tz-navy-dark:#071730;
  --tz-green:#1fa463;
  --tz-gold:#f2b705;
  --tz-white:#ffffff;
  --tz-off-white:#f4f6f9;
  --tz-gray:#8a94a6;
  --tz-border:#1c3358;
  --tz-radius:8px;
  --tz-font-heading:'Poppins', sans-serif;
  --tz-font-body:'Inter', sans-serif;
}

body{
  font-family:var(--tz-font-body);
  color:#1a2233;
  background:var(--tz-off-white);
}

h1,h2,h3,h4,.tz-heading{
  font-family:var(--tz-font-heading);
  font-weight:600;
  color:var(--tz-navy);
}

a{ color:inherit; text-decoration:none; }

.tz-badge{
  display:inline-block;
  background:var(--tz-green);
  color:#fff;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.5px;
  padding:3px 9px;
  border-radius:4px;
}

.tz-card{
  background:#fff;
  border-radius:var(--tz-radius);
  overflow:hidden;
  box-shadow:0 1px 3px rgba(11,31,58,.08);
  transition:transform .2s ease, box-shadow .2s ease;
}
.tz-card:hover{ transform:translateY(-3px); box-shadow:0 8px 20px rgba(11,31,58,.12); }
.tz-card img{ width:100%; aspect-ratio:16/10; object-fit:cover; display:block; }
.tz-card .tz-card-body{ padding:14px 16px; }
.tz-card .tz-date{ color:var(--tz-gray); font-size:12px; margin-top:6px; }

/* ==========================================================================
   Header
   ========================================================================== */
.tz-header{
  background:var(--tz-navy);
  position:sticky;
  top:0;
  z-index:999;
  box-shadow:0 2px 10px rgba(0,0,0,.15);
}
.tz-header-inner{
  max-width:1240px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 20px;
}
.tz-logo img{ height:42px; width:auto; display:block; }

.tz-nav ul{ display:flex; gap:26px; list-style:none; margin:0; padding:0; }
.tz-nav a{ color:var(--tz-off-white); font-size:14px; font-weight:600; text-transform:uppercase; letter-spacing:.3px; }
.tz-nav a:hover{ color:var(--tz-gold); }
.tz-nav li{ position:relative; }
.tz-nav .sub-menu{
  display:none; position:absolute; top:100%; left:0; min-width:190px;
  background:var(--tz-navy-dark); border:1px solid var(--tz-border); border-radius:6px;
  padding:8px 0; list-style:none; margin:0;
}
.tz-nav li:hover > .sub-menu{ display:block; }
.tz-nav .sub-menu a{ display:block; padding:8px 16px; text-transform:none; font-weight:500; }

.tz-header-actions{ display:flex; align-items:center; gap:16px; }
.tz-btn-live{
  background:var(--tz-green); color:#fff; font-size:13px; font-weight:700;
  padding:8px 14px; border-radius:6px; border:none; cursor:pointer;
}
.tz-account-link{ color:#fff; font-size:14px; }
.tz-mobile-toggle{ display:none; background:none; border:none; color:#fff; font-size:22px; cursor:pointer; }

@media (max-width:900px){
  .tz-nav{ display:none; }
  .tz-mobile-toggle{ display:block; }
}

/* Off-canvas mobile menu */
.tz-mobile-panel{
  position:fixed; top:0; right:-320px; width:300px; height:100%;
  background:var(--tz-navy-dark); z-index:1100; transition:right .25s ease;
  padding:20px; overflow-y:auto;
}
.tz-mobile-panel.is-open{ right:0; }
.tz-mobile-panel ul{ list-style:none; margin:0; padding:0; }
.tz-mobile-panel a{ display:block; color:#fff; padding:12px 0; border-bottom:1px solid var(--tz-border); }
.tz-mobile-overlay{
  display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:1050;
}
.tz-mobile-overlay.is-open{ display:block; }

/* Live scores modal */
.tz-modal{ display:none; position:fixed; inset:0; z-index:1200; background:rgba(0,0,0,.7); }
.tz-modal.is-open{ display:flex; align-items:center; justify-content:center; }
.tz-modal-box{ background:#fff; width:90%; max-width:900px; height:80vh; border-radius:var(--tz-radius); overflow:hidden; position:relative; }
.tz-modal-box iframe{ width:100%; height:100%; border:0; }
.tz-modal-close{ position:absolute; top:8px; right:12px; font-size:26px; color:#fff; background:var(--tz-navy); border-radius:50%; width:34px; height:34px; cursor:pointer; border:none; z-index:2; }

/* ==========================================================================
   Footer
   ========================================================================== */
.tz-footer{ background:var(--tz-navy-dark); color:var(--tz-off-white); padding:50px 20px 20px; margin-top:60px; }
.tz-footer-inner{ max-width:1240px; margin:0 auto; }
.tz-footer-social{ display:flex; gap:14px; margin:18px 0; }
.tz-footer-social a{ color:#fff; background:var(--tz-border); width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.tz-footer-bottom{ text-align:center; font-size:13px; color:var(--tz-gray); border-top:1px solid var(--tz-border); padding-top:16px; margin-top:16px; }
