/*
Theme Name: PW247 Omni-Responsive + Link Fix
Theme URI: https://prowrestling247.com/
Author: PW247 Engineering
Description: DEFINITIVE BROADCAST INFRASTRUCTURE. Fixed z-index layering bug on 3D cards. Fully responsive Omni-Screen layout, Archive.org Iframe Audio & Video, 25% transparent gradients, Native Gutenberg Blocks.
Version: 230.0
License: GNU General Public License v2 or later
Text Domain: pw247
*/
:root { --y: #ffcc00; --r: #cc0000; --glass: rgba(5,5,5,0.5); }
* { box-sizing: border-box; }
body { background: #000 !important; color: #fff !important; font-family: 'Arial Black', sans-serif !important; margin: 0; padding-top: 135px !important; padding-bottom: 135px !important; overflow-x: hidden; }
a { text-decoration: none; color: inherit; transition: 0.2s; }

/* 3D FLIP CARD LOGIC */
.card-container { perspective: 1000px; height: 100%; min-height: 420px; }
.card-inner { position: relative; width: 100%; height: 100%; min-height: 420px; transition: transform 0.6s; transform-style: preserve-3d; cursor: pointer; }
.card-container:hover .card-inner { transform: rotateY(180deg); }
.card-front, .card-back { position: absolute; width: 100%; height: 100%; backface-visibility: hidden; overflow: hidden; border: 1px solid #1a1a1a; border-radius: 4px; }
.card-front { background: #111; }
.card-front img { width: 100%; height: 100%; object-fit: cover; }

/* FRONT CARD OVERLAY FOR TITLE */
/* Lowered Z-index slightly so it doesn't block the card flip, but stays above image */
.card-front-overlay { position: absolute; bottom: 0; left: 0; width: 100%; background: linear-gradient(0deg, rgba(0,0,0,0.95) 0%, rgba(204,0,0,0.4) 60%, transparent 100%); padding: 30px 15px 15px; border-bottom: 3px solid var(--y); z-index: 5; pointer-events: none; }
.card-front-title { color: #fff; font-size: 15px; text-transform: uppercase; font-style: italic; line-height: 1.2; font-family: 'Arial Black', sans-serif; text-shadow: 2px 2px 0px #000; }
.card-front-title span { color: var(--y); }

.card-back { background: #000; transform: rotateY(180deg); display: flex; flex-direction: column; padding: 25px; border: 2px solid var(--y); box-shadow: inset 0 0 15px rgba(255,204,0,0.2); }
.card-title-box { background: #000; border: 1px solid var(--y); outline: 1px solid #fff; padding: 12px; margin-bottom: 15px; position: relative; z-index:2; }
.card-title-box h3 { color: #fff; margin: 0; font-size: 15px; text-transform: uppercase; font-style: italic; line-height: 1.2; }
.card-gradient { background: linear-gradient(135deg, var(--r) 0%, #000 100%); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; opacity: 0.4; }
.card-excerpt { font-size: 12px; line-height: 1.5; color: #eee; font-family: sans-serif; overflow: hidden; position:relative; z-index:2; }

/* THE FIX: Ensure the link wrapper acts as a block and has the highest z-index on the back of the card */
.card-more { margin-top: auto; text-align: right; position:relative; z-index: 100; }
.card-more a { color: var(--y); font-weight: 900; font-size: 24px; letter-spacing: -2px; display:inline-block; padding:10px; cursor:pointer; }
.card-more a:hover { color: #fff; }

/* SINGLE POST TRADING CARD UI */
.tc-header { background: rgba(0, 0, 0, 0.5); border: 1px solid var(--y); padding: 25px; display: flex; gap: 25px; align-items: center; margin-bottom: 0; }
.tc-thumb { width: 150px; height: 150px; flex-shrink: 0; border: 2px solid var(--y); overflow: hidden; background: #000; }
.tc-thumb img { width: 100%; height: 100%; object-fit: cover; }
.tc-meta-area { flex: 1; }
.tc-title { color: #fff; font-size: 28px; text-transform: uppercase; font-style: italic; margin: 0 0 10px 0; line-height: 1.1; }
.tc-title span { color: var(--y); }
.tc-meta { font-size: 13px; color: #ccc; font-weight: 900; letter-spacing: 1px; }

/* DOUBLE BORDER CONTENT BOX */
.tc-content-wrap { padding: 4px; background: rgba(255, 204, 0, 0.5); margin-top: 5px; } 
.tc-content-inner { padding: 2px; background: rgba(0, 0, 0, 0.5); } 
.tc-content { background: linear-gradient(180deg, rgba(0,0,0,0.25) 0%, rgba(204,0,0,0.25) 50%, rgba(255,204,0,0.25) 100%); backdrop-filter: blur(10px); color: #fff; padding: 40px; font-family: 'Arial', sans-serif; line-height: 1.8; font-size: 16px; text-shadow: 1px 1px 3px rgba(0,0,0,0.9); }

/* --- CUSTOM EMBED MEDIA PLAYERS --- */
.pw247-embed-player { background: linear-gradient(135deg, #000 0%, #3a0000 50%, var(--y) 100%); border: 2px solid var(--y); padding: 15px; margin: 25px 0; display: flex; align-items: center; gap: 20px; box-shadow: 0 0 15px rgba(255,204,0,0.3); font-family: 'Arial Black', sans-serif; }
.pw247-audio-thumb { width: 80px; height: 80px; flex-shrink: 0; border: 2px solid var(--y); background: #000; box-shadow: 0 0 10px #000; overflow: hidden; display: flex; justify-content: center; align-items: center; }
.pw247-audio-thumb img { width: 100%; height: 100%; object-fit: cover; }
.pw247-audio-info { flex-grow: 1; display: flex; flex-direction: column; gap: 10px; overflow: hidden; }
.pw247-audio-title-bar { color: #fff; font-size: 16px; font-weight: 900; font-style: italic; text-transform: uppercase; text-shadow: 2px 2px 4px rgba(0,0,0,0.8); border-bottom: 1px solid rgba(255,255,255,0.2); padding-bottom: 5px; }
.pw247-audio-title-bar span { color: var(--y); }
.pw247-audio-controls { display: flex; align-items: center; gap: 15px; width: 100%; }
.pw247-embed-play-btn { background: rgba(0,0,0,0.5); border: 1px solid var(--y); color: #fff; padding: 8px 20px; font-weight: 900; cursor: pointer; clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%); transition: 0.2s; text-transform: uppercase; }
.pw247-embed-play-btn:hover { background: var(--y); color: #000; }
.pw247-time-display { color: #fff; font-size: 12px; font-weight: 900; letter-spacing: 1px; flex-shrink: 0; min-width: 45px; text-align: center; text-shadow: 1px 1px 2px #000; }
.pw247-progress-bar { flex-grow: 1; height: 10px; background: rgba(0,0,0,0.5); border: 1px solid #222; position: relative; cursor: pointer; }
.pw247-progress-fill { height: 100%; background: linear-gradient(90deg, var(--r), var(--y)); width: 0%; pointer-events: none; }

.pw247-video-container { border: 2px solid var(--y); background: linear-gradient(135deg, #000 0%, #3a0000 50%, var(--y) 100%); padding: 10px; margin: 25px 0; position: relative; box-shadow: 0 0 15px rgba(255,204,0,0.3); }
.pw247-video-wrapper { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; background:#000; border:1px solid #000; }
.pw247-video-wrapper iframe, .pw247-video-wrapper video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.pw247-video-bar { background: rgba(0,0,0,0.8); height: 30px; display: flex; align-items: center; justify-content: space-between; padding: 0 15px; font-size: 11px; font-weight: 900; letter-spacing: 2px; color: #fff; margin-top: 10px; border:1px solid #222; }

/* ==========================================================================
   OMNI-SCREEN RESPONSIVE ENGINE
   ========================================================================== */
.pw247-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; margin-bottom: 40px; }

@media (max-width: 1200px) {
    .pw247-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 992px) {
    .pw247-grid { grid-template-columns: repeat(2, 1fr); }
    .tc-header { flex-direction: column; text-align: center; gap: 15px; }
    .tc-thumb { margin: 0 auto; }
}

@media (max-width: 768px) {
    .pw247-grid { grid-template-columns: 1fr; }
    body { padding-top: 0 !important; padding-bottom: 240px !important; }
    
    #pw-h { position: relative !important; height: auto !important; padding-bottom: 0; }
    .t-move { font-size: 12px; }
    
    .l-row { flex-direction: column; height: auto !important; padding: 15px !important; gap: 10px; text-align: center; }
    .logo-container { flex-direction: column; justify-content: center; width: 100%; }
    .logo-container img { max-width: 100% !important; height: auto !important; max-height: 80px; }
    .net-bug { display: none; } 
    
    #n-row { height: auto !important; padding: 12px 0; overflow-x: auto; -webkit-overflow-scrolling: touch; justify-content: flex-start; }
    .u-list { width: max-content; padding: 0 20px; }
    
    #pw-f { height: auto !important; padding: 15px 0 0 0 !important; }
    .f-ctrl { display: flex !important; flex-direction: column; gap: 15px; padding: 15px !important; align-items: center; justify-content: center; }
    .prime-logo { display: none; } 
    .f-ded { height: auto !important; padding: 12px !important; line-height: 1.5; white-space: normal; }
    
    .pw247-embed-player { flex-direction: column; text-align: center; }
    .pw247-audio-info { align-items: center; }
    .pw247-audio-controls { flex-wrap: wrap; justify-content: center; gap: 12px; }
    .pw247-time-display { width: 100%; order: 3; margin-top: 5px; } 
    .pw247-progress-bar { min-width: 200px; }
}