/*
Theme Name: Pengeluaran Macau
Theme URI: https://data.berapakeluartotomacau.com/
Author: Pengeluaran Macau
Description: Lightweight custom WordPress theme for Pengeluaran Macau, inspired by a dark Macau data/result layout. Includes an admin settings panel, editable homepage sections, responsive navigation and optional Macau Results custom post type.
Version: 1.2.0
Requires at least: 6.2
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: pengeluaran-macau
*/

:root{
  --pm-bg:#050a0d;
  --pm-bg-2:#091318;
  --pm-panel:#0d171d;
  --pm-panel-2:#111d24;
  --pm-red:#e00000;
  --pm-red-dark:#9f0000;
  --pm-gold:#f4c400;
  --pm-gold-2:#ffd94a;
  --pm-white:#fff;
  --pm-muted:#aeb8bd;
  --pm-border:#8a6814;
  --pm-max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--pm-bg);color:#f5f5f5;font-family:Arial,Helvetica,sans-serif;line-height:1.65}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
.container{width:min(var(--pm-max),calc(100% - 28px));margin-inline:auto}
.site-top{background:#030609;border-bottom:1px solid #252d31;font-size:12px}
.top-inner{display:flex;justify-content:space-between;align-items:center;min-height:34px;gap:12px}
.top-actions{display:flex;gap:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 18px;border-radius:5px;border:1px solid transparent;font-weight:800;text-transform:uppercase;font-size:12px;cursor:pointer}
.btn-red{background:var(--pm-red);color:#fff}
.btn-red:hover{background:#ff1c1c}
.btn-gold{background:var(--pm-gold);color:#111}
.site-header{background:#05090c}
.brand-wrap{min-height:118px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#170a0a 0%,#080b0d 100%)}
.brand-link{display:flex;align-items:center;justify-content:center}
.brand-logo{display:block;max-height:105px;width:auto}
.navbar{background:linear-gradient(180deg,#f00000,#a80000);border-top:1px solid #ff4040;border-bottom:3px solid #570000}
.nav-inner{min-height:48px;display:flex;align-items:center;justify-content:center}
.primary-menu{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:2px}
.primary-menu li{margin:0}
.primary-menu a{display:block;padding:12px 16px;font-weight:800;font-size:13px;text-transform:uppercase}
.primary-menu a:hover,.primary-menu .current-menu-item>a{background:rgba(0,0,0,.2)}
.menu-toggle{display:none;background:transparent;border:0;color:#fff;font-size:25px}
.hero{margin:16px 0;background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.35)),url("assets/images/demo-hero.jpg") center/cover;border:1px solid #333;border-radius:8px;overflow:hidden}
.hero-inner{min-height:285px;display:flex;align-items:center;justify-content:center;text-align:center;padding:42px 20px}
.hero h1{margin:0;color:var(--pm-gold);font-size:clamp(30px,5vw,56px);line-height:1.05;text-transform:uppercase;text-shadow:0 2px 8px #000}
.hero p{margin:13px auto 0;max-width:760px;color:#fff;font-size:18px}
.hero-badge{display:inline-block;margin-top:18px;padding:8px 25px;border:2px solid var(--pm-gold);border-radius:999px;font-weight:900;letter-spacing:1px;background:#030608c9}
.bank-strip{background:#070d11;border:1px solid #202a30;border-radius:6px;padding:12px;margin:14px 0}
.bank-title{color:var(--pm-gold);font-weight:900;margin-right:12px}
.bank-list{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.bank-pill{padding:7px 14px;background:#17222a;border:1px solid #34434d;border-radius:4px;font-weight:800;font-size:13px}
.quick-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:16px 0}
.quick-card{background:linear-gradient(180deg,#101c22,#081015);border:1px solid var(--pm-border);border-radius:5px;padding:16px 10px;text-align:center;min-height:88px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px}
.quick-card:hover{border-color:var(--pm-gold);transform:translateY(-1px)}
.content-section{background:linear-gradient(180deg,#081116,#050b0e);border:1px solid #17242b;border-radius:7px;padding:24px;margin:16px 0}
.section-title{color:var(--pm-gold);font-size:25px;line-height:1.25;margin:0 0 12px}
.section-subtitle{color:var(--pm-muted);margin-top:-4px}
.content-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:24px}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}
.feature-card{border:1px solid var(--pm-border);border-radius:5px;padding:18px;background:#0c171d}
.feature-icon{font-size:25px;color:var(--pm-gold)}
.feature-card h3{font-size:15px;margin:8px 0;color:#fff}
.feature-card p{font-size:13px;color:var(--pm-muted);margin:0}
.cta{background:linear-gradient(90deg,#4d0000,#e00000,#4d0000);border:1px solid #ff4444;border-radius:7px;padding:22px;margin:16px 0;display:flex;align-items:center;justify-content:space-between;gap:20px}
.cta h2{margin:0;color:#fff;font-size:24px}
.result-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.result-card{border:1px solid var(--pm-border);background:#0c151a;border-radius:6px;padding:16px}
.result-card .date{color:var(--pm-gold);font-weight:800}
.result-number{font-size:32px;font-weight:900;letter-spacing:5px;color:#fff;margin:6px 0}
.entry-meta{font-size:12px;color:var(--pm-muted)}
.site-footer{background:#020507;border-top:2px solid #1a2227;margin-top:25px}
.footer-inner{padding:25px 0;display:flex;justify-content:space-between;gap:20px;align-items:center}
.footer-copy{color:#8e999f;font-size:12px}
.footer-menu{display:flex;gap:16px;flex-wrap:wrap;font-size:12px}
.footer-menu a:hover{color:var(--pm-gold)}
.widget-area{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:24px 0}
.widget-area h2,.widget-area h3{color:var(--pm-gold)}
input,textarea,select{width:100%;background:#0b1318;border:1px solid #34434d;color:#fff;padding:10px;border-radius:4px}
button,input[type=submit]{font:inherit}


/* Announcement marquee */
.announcement-bar{background:linear-gradient(90deg,#190000,#b80000,#190000);border-bottom:1px solid #ff4b4b;box-shadow:0 2px 8px rgba(0,0,0,.35)}
.announcement-inner{display:flex;align-items:center;min-height:40px;overflow:hidden}
.announcement-label{flex:0 0 auto;background:var(--pm-gold);color:#111;font-size:11px;font-weight:900;padding:7px 12px;margin-right:10px;border-radius:3px;text-transform:uppercase;letter-spacing:.4px}
.announcement-viewport{overflow:hidden;white-space:nowrap;flex:1;position:relative}
.announcement-track{display:inline-flex;min-width:max-content;animation:pm-marquee var(--pm-marquee-duration,18s) linear infinite;animation-direction:var(--pm-marquee-direction,normal)}
.announcement-track span{display:inline-block;padding-right:70px;color:#fff;font-weight:800;font-size:13px}
@keyframes pm-marquee{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.pm-timer-label,.pm-released-label{font-size:11px;font-weight:900;letter-spacing:1px;color:var(--pm-gold);text-transform:uppercase}
.pm-countdown{font-size:30px;line-height:1.1;font-weight:900;letter-spacing:3px;color:#fff;text-shadow:0 0 12px rgba(244,196,0,.25);margin:8px 0}
.pm-download-button{margin-top:12px}
.pm-released-state[hidden],.pm-countdown-state[hidden]{display:none}


/* Flip-style Macau result countdown */
.pm-countdown-heading{margin:18px 0 16px;text-align:center;color:#fff;font-size:24px;line-height:1.2;font-weight:700}
.pm-flip-countdown{display:flex;align-items:flex-start;justify-content:center;gap:6px;margin:0 auto;width:100%;overflow:hidden}
.pm-time-unit{flex:0 1 105px;min-width:0;text-align:center}
.pm-flip-digits{display:flex;justify-content:center;gap:5px}
.pm-flip-digit{position:relative;display:flex;align-items:center;justify-content:center;width:48px;height:74px;background:#303030;border:1px solid #3b3b3b;border-radius:3px;color:#d2d2d2;font-size:56px;line-height:1;font-weight:800;font-family:Arial,Helvetica,sans-serif;box-shadow:0 3px 8px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.03);overflow:hidden;text-shadow:0 1px 0 rgba(255,255,255,.08)}
.pm-flip-digit::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(0,0,0,.55);box-shadow:0 1px 0 rgba(255,255,255,.06)}
.pm-flip-digit.is-flipping{animation:pm-flip-number .32s ease-in-out}
@keyframes pm-flip-number{0%{transform:perspective(180px) rotateX(0deg)}45%{transform:perspective(180px) rotateX(-16deg)}100%{transform:perspective(180px) rotateX(0deg)}}
.pm-time-label{margin-top:12px;color:#fff;font-size:16px;line-height:1;font-weight:500}
.pm-time-colon{flex:0 0 16px;align-self:flex-start;margin-top:14px;color:#222;font-size:38px;line-height:74px;font-weight:700}
.pm-scheduled-time{text-align:center;margin-top:14px}
.pm-released-state{text-align:center;padding:20px 0 5px}
.pm-released-label{margin-bottom:5px}
.pm-download-button{display:inline-flex;justify-content:center;align-items:center;min-height:44px;margin-top:14px}
@media (max-width:900px){.pm-time-unit{flex-basis:84px}.pm-flip-digit{width:38px;height:64px;font-size:47px}.pm-time-colon{font-size:31px;line-height:64px}}
@media (max-width:700px){.pm-countdown-heading{font-size:21px}.pm-flip-countdown{gap:3px}.pm-time-unit{flex-basis:64px}.pm-flip-digits{gap:3px}.pm-flip-digit{width:29px;height:50px;font-size:35px}.pm-time-colon{flex-basis:9px;margin-top:5px;font-size:24px;line-height:50px}.pm-time-label{font-size:12px;margin-top:9px}}

@media (max-width:900px){
  .quick-grid{grid-template-columns:repeat(3,1fr)}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .content-grid{grid-template-columns:1fr}
  .result-list{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:700px){
  .top-inner{padding:4px 0}
  .brand-wrap{min-height:90px}
  .brand-logo{max-height:72px;max-width:90%}
  .nav-inner{justify-content:space-between;padding:0 12px}
  .menu-toggle{display:block}
  .primary-menu{display:none;width:100%;flex-direction:column;padding:8px 0}
  .primary-menu.is-open{display:flex}
  .primary-menu a{padding:10px 12px}
  .hero-inner{min-height:230px}
  .hero p{font-size:15px}
  .quick-grid{grid-template-columns:repeat(2,1fr)}
  .feature-grid,.result-list{grid-template-columns:1fr}
  .cta{flex-direction:column;align-items:flex-start}
  .footer-inner{flex-direction:column;align-items:flex-start}
}