/*
Theme Name: D4Wealth
Theme URI: https://example.com/d4wealth
Author: D4Wealth
Author URI: https://example.com
Description: A modern wealth, money-making, investing and finance magazine theme. Post daily articles and videos, run ads, and grow your audience. Faithful to the D4Wealth design.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: d4wealth
Tags: blog, news, magazine, two-columns, custom-menu, featured-images, sticky-post, threaded-comments
*/

/* ============================================================
   Tailwind utility classes come from the enqueued Play CDN.
   This file holds the custom component styles + theme tokens.
   ============================================================ */

:root { --brand-dark:#0a0f1f; --brand-gold:#f5a800; }
* { -webkit-tap-highlight-color: transparent; }
body { font-family:'Inter', sans-serif; background:#f8fafc; margin:0; }
a { text-decoration:none; }

.card-hover { transition: all .3s cubic-bezier(.4,0,.2,1); }
.card-hover:hover { transform: translateY(-6px); box-shadow:0 15px 30px -10px rgba(0,0,0,.12); }
.hero-overlay { background: linear-gradient(to right, rgba(11,19,43,.95) 0%, rgba(11,19,43,.7) 50%, rgba(11,19,43,.2) 100%); }
.hide-scrollbar::-webkit-scrollbar { display:none; }
.hide-scrollbar { -ms-overflow-style:none; scrollbar-width:none; }
.line-clamp-2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* Logo mark */
.logo-mark { width:34px; height:38px; position:relative; display:inline-block; }
.logo-mark i { position:absolute; display:block; transform:skew(-28deg); border-radius:2px; }
.logo-mark i:nth-child(1){ width:10px; height:32px; background:#f5a800; left:5px; top:2px; }
.logo-mark i:nth-child(2){ width:10px; height:18px; background:#fff; left:16px; top:18px; }
.logo-mark i:nth-child(3){ width:10px; height:14px; background:#4f9cf8; left:26px; top:22px; }

/* Slides */
.hero-slide, .news-slide { display:none; animation: fadeIn .8s ease-in-out; }
.hero-slide.active, .news-slide.active { display:block; }
@keyframes fadeIn { from { opacity:.4; transform:scale(.98);} to { opacity:1; transform:scale(1);} }

/* Play button */
.play-btn { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:56px; height:56px; background:rgba(255,255,255,.92); border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 20px rgba(0,0,0,.3); transition:all .3s ease; }
.play-btn i { color:#0b132b; font-size:20px; margin-left:3px; }
.group:hover .play-btn { transform:translate(-50%,-50%) scale(1.08); background:#f5a800; }

/* Ad banners / slots */
.ad-banner { border-radius:10px; overflow:hidden; position:relative; transition:transform .2s ease, box-shadow .2s ease; width:100%; }
.ad-banner:hover { transform:scale(1.01); box-shadow:0 8px 30px rgba(0,0,0,.12); }
.ad-banner .ad-label { position:absolute; top:6px; right:10px; background:rgba(0,0,0,.5); color:#fff; font-size:8px; font-weight:600; padding:2px 10px; border-radius:20px; letter-spacing:.5px; z-index:5; backdrop-filter:blur(4px); }
.ad-banner .ad-content { display:flex; align-items:center; justify-content:center; padding:14px 24px; gap:16px; min-height:70px; width:100%; }
.ad-banner .ad-icon { font-size:24px; flex-shrink:0; }
.ad-banner .ad-text h4 { font-weight:700; font-size:14px; margin:0 0 1px; }
.ad-banner .ad-text p { font-size:12px; opacity:.8; margin:0; }
.ad-banner .ad-btn { padding:5px 18px; border-radius:30px; font-weight:600; font-size:11px; border:none; cursor:pointer; transition:all .2s; white-space:nowrap; }
.ad-banner.gold { background:linear-gradient(135deg,#fbbf24,#f59e0b); color:#0f172a; }
.ad-banner.blue { background:linear-gradient(135deg,#3b82f6,#2563eb); color:#fff; }
.ad-banner.purple { background:linear-gradient(135deg,#8b5cf6,#7c3aed); color:#fff; }
.ad-banner.pink { background:linear-gradient(135deg,#ec4899,#db2777); color:#fff; }
.ad-banner.orange { background:linear-gradient(135deg,#f97316,#ea580c); color:#fff; }
.ad-banner.teal { background:linear-gradient(135deg,#14b8a6,#0d9488); color:#fff; }
.ad-banner .ad-btn.white { background:#fff; color:#0f172a; }
.ad-banner.compact .ad-content { min-height:56px; padding:10px 20px; }
.ad-slot { background:linear-gradient(135deg,#f8fafc,#eef2f7); border:1px dashed #cbd5e1; border-radius:12px; padding:22px; text-align:center; color:#94a3b8; font-size:13px; }

/* ================= HEADER / NAV ================= */
.site-header { background:#0a0f1f; border-bottom:1px solid rgba(255,255,255,.06); position:sticky; top:0; z-index:100; }
.header-top { display:flex; align-items:center; justify-content:space-between; padding:10px 0; gap:16px; }
.header-search { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); border-radius:8px; padding:7px 14px 7px 36px; font-size:13px; color:#fff; width:240px; transition:all .3s ease; }
.header-search:focus { background:rgba(255,255,255,.12); border-color:#f5a800; outline:none; width:280px; }
.header-search::placeholder { color:rgba(255,255,255,.35); }
.search-icon-wrapper { position:absolute; left:10px; top:50%; transform:translateY(-50%); color:rgba(255,255,255,.3); font-size:13px; }
.header-actions { display:flex; align-items:center; gap:12px; }
.header-actions a { color:rgba(255,255,255,.6); font-size:13px; font-weight:500; transition:color .2s; }
.header-actions a:hover { color:#fff; }
.btn-get-started { background:#f5a800; color:#0a0f1f !important; padding:6px 16px; border-radius:6px; font-weight:600; font-size:12px; }
.btn-get-started:hover { background:#f5b300; }

/* Menu built from wp_nav_menu */
.primary-nav { padding:4px 0 8px; border-top:1px solid rgba(255,255,255,.04); }
.primary-nav ul { list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:2px; flex-wrap:wrap; }
.primary-nav li { position:relative; }
.primary-nav > ul > li > a { font-size:13px; font-weight:500; color:rgba(255,255,255,.7); padding:6px 14px; border-radius:4px; transition:all .2s ease; display:inline-flex; align-items:center; gap:5px; }
.primary-nav > ul > li > a:hover { color:#f5a800; background:rgba(255,255,255,.05); }
.primary-nav > ul > li.current-menu-item > a,
.primary-nav > ul > li.current_page_item > a { color:#f5a800; }
.primary-nav .menu-item-has-children > a::after { content:"\f078"; font-family:"Font Awesome 6 Free"; font-weight:900; font-size:9px; opacity:.4; }
.primary-nav .sub-menu { position:absolute; top:100%; left:0; margin-top:4px; min-width:230px; background:#fff; border-radius:8px; box-shadow:0 12px 40px rgba(0,0,0,.15); border:1px solid rgba(0,0,0,.06); padding:6px 0; display:block; flex-direction:column; opacity:0; visibility:hidden; transform:translateY(4px); transition:all .2s cubic-bezier(.4,0,.2,1); pointer-events:none; z-index:50; }
.primary-nav li:hover > .sub-menu { opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto; }
.primary-nav .sub-menu li { width:100%; }
.primary-nav .sub-menu a { display:block; padding:8px 16px; color:#1e293b; font-size:13px; transition:all .15s ease; }
.primary-nav .sub-menu a:hover { background:#f1f5f9; color:#0a0f1f; }

.mobile-menu-btn { display:none; background:none; border:none; color:#fff; font-size:20px; padding:4px 8px; cursor:pointer; }

/* ================= MOBILE ================= */
@media (max-width:1023px){
  .mobile-menu-btn { display:block; }
  .header-search { width:140px; } .header-search:focus { width:160px; }
  .primary-nav { display:none; }
  .header-actions .hide-mobile { display:none; }
  .mobile-drawer { position:fixed; top:0; left:0; width:85%; max-width:340px; height:100%; background:#0a0f1f; z-index:200; transform:translateX(-100%); transition:transform .35s cubic-bezier(.4,0,.2,1); padding:20px; overflow-y:auto; box-shadow:4px 0 30px rgba(0,0,0,.5); }
  .mobile-drawer.open { transform:translateX(0); }
  .mobile-drawer ul { list-style:none; margin:0; padding:0; }
  .mobile-drawer a { display:block; padding:10px 12px; border-radius:8px; color:#e2e8f0; font-weight:500; font-size:15px; }
  .mobile-drawer .sub-menu a { color:#94a3b8; font-size:14px; padding-left:24px; }
  .mobile-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:150; backdrop-filter:blur(4px); }
  .mobile-overlay.active { display:block; }
  .drawer-header { display:flex; justify-content:space-between; align-items:center; padding-bottom:16px; border-bottom:1px solid rgba(255,255,255,.06); margin-bottom:16px; }
  .drawer-close { background:none; border:none; color:rgba(255,255,255,.6); font-size:22px; cursor:pointer; }
  body.admin-bar .site-header { top:0; }
  body { padding-bottom:70px; }
  .bottom-tabs { position:fixed; bottom:0; left:0; right:0; background:#0a0f1f; border-top:1px solid rgba(255,255,255,.06); padding:6px 0 env(safe-area-inset-bottom,8px); z-index:100; backdrop-filter:blur(20px); display:flex; justify-content:space-around; align-items:center; }
  .tab-item { display:flex; flex-direction:column; align-items:center; gap:2px; padding:4px 12px; border-radius:8px; cursor:pointer; background:none; border:none; color:rgba(255,255,255,.4); min-width:56px; }
  .tab-item i { font-size:20px; } .tab-item span { font-size:9px; font-weight:500; color:rgba(255,255,255,.35); }
  .tab-item.active i, .tab-item.active span { color:#f5a800; }
  .tab-center-btn { background:#f5a800; color:#0a0f1f; width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:22px; margin-top:-16px; box-shadow:0 4px 20px rgba(245,168,0,.4); border:none; cursor:pointer; }
}
@media (min-width:1024px){ .mobile-drawer, .mobile-overlay, .bottom-tabs { display:none !important; } }

/* News category tabs */
.news-category-btn { transition:all .2s ease; cursor:pointer; border:none; }
.news-category-btn.active { background:#f5a800; color:#0a0f1f; }
.news-category-btn:not(.active):hover { background:#e5e7eb; }
.news-card { transition:all .3s ease; }
.news-card:hover { transform:translateY(-4px); box-shadow:0 12px 30px rgba(0,0,0,.08); }

/* Article typography */
.article-body p { margin-bottom:1.25rem; line-height:1.85; color:#334155; font-size:17px; }
.article-body h2 { font-size:26px; font-weight:700; color:#0a0f1f; margin:2rem 0 1rem; }
.article-body h3 { font-size:21px; font-weight:700; color:#0a0f1f; margin:1.5rem 0 .75rem; }
.article-body ul, .article-body ol { margin:0 0 1.25rem 1.25rem; color:#334155; line-height:1.8; }
.article-body li { margin-bottom:.4rem; }
.article-body img { border-radius:12px; margin:1.5rem 0; height:auto; max-width:100%; }
.article-body a { color:#2563eb; text-decoration:underline; }
.article-body blockquote { border-left:4px solid #f5a800; padding:.5rem 0 .5rem 1.25rem; margin:1.5rem 0; color:#475569; font-style:italic; }

/* WP core alignment helpers */
.alignleft { float:left; margin:0 1.5rem 1rem 0; }
.alignright { float:right; margin:0 0 1rem 1.5rem; }
.aligncenter { display:block; margin-left:auto; margin-right:auto; }
.wp-caption-text { font-size:13px; color:#64748b; text-align:center; }
.sticky, .bypostauthor { }

/* Comments */
.comment-list { list-style:none; padding:0; }
.comment-list .children { list-style:none; margin-left:1.5rem; }
.comment-body { background:#f8fafc; border:1px solid #e2e8f0; border-radius:10px; padding:16px; margin-bottom:14px; }
.comment-author img { border-radius:50%; }

/* Pagination */
.d4-pagination { display:flex; gap:6px; justify-content:center; flex-wrap:wrap; margin-top:2.5rem; }
.d4-pagination .page-numbers { padding:8px 14px; border:1px solid #e2e8f0; border-radius:8px; color:#334155; font-weight:600; font-size:14px; background:#fff; }
.d4-pagination .page-numbers.current { background:#f5a800; border-color:#f5a800; color:#0a0f1f; }
.d4-pagination .page-numbers:hover:not(.current) { background:#f1f5f9; }

/* Widgets */
.d4-widget { background:#fff; border:1px solid #e2e8f0; border-radius:12px; padding:20px; margin-bottom:24px; }
.d4-widget .widget-title { font-size:14px; font-weight:700; color:#0a0f1f; text-transform:uppercase; letter-spacing:.05em; margin:0 0 14px; padding-bottom:10px; border-bottom:2px solid #f5a800; display:inline-block; }
.d4-widget ul { list-style:none; margin:0; padding:0; }
.d4-widget ul li { padding:8px 0; border-bottom:1px solid #f1f5f9; font-size:14px; }
.d4-widget ul li a { color:#334155; } .d4-widget ul li a:hover { color:#0a0f1f; }
.footer-widget .widget-title { color:#fff; border-color:#334155; }
.footer-widget ul li { border-color:rgba(255,255,255,.06); }
.footer-widget ul li a { color:#9ca3af; } .footer-widget ul li a:hover { color:#fff; }