/*
 Theme Name:   Astra Child - PluginHaus
 Theme URI:    https://pluginhaus.de
 Description:  Child Theme für PluginHaus basierend auf Astra
 Author:       PluginHaus
 Author URI:   https://pluginhaus.de
 Template:     astra
 Version:      1.0.2
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  astra-child-pluginhaus
*/

/* ==========================================================================
   PluginHaus Design System
   ========================================================================== */

:root {
    /* Primary Colors */
    --ph-primary: #2563eb;
    --ph-primary-dark: #1d4ed8;
    --ph-primary-light: #3b82f6;

    /* Accent Colors - using blue instead of green */
    --ph-accent: #3b82f6;
    --ph-accent-dark: #2563eb;
    --ph-accent-light: #60a5fa;

    /* Neutral Colors */
    --ph-gray-50: #f9fafb;
    --ph-gray-100: #f3f4f6;
    --ph-gray-200: #e5e7eb;
    --ph-gray-300: #d1d5db;
    --ph-gray-400: #9ca3af;
    --ph-gray-500: #6b7280;
    --ph-gray-600: #4b5563;
    --ph-gray-700: #374151;
    --ph-gray-800: #1f2937;
    --ph-gray-900: #111827;

    /* Semantic Colors */
    --ph-success: #2563eb;
    --ph-warning: #f59e0b;
    --ph-error: #ef4444;
    --ph-info: #3b82f6;

    /* Spacing */
    --ph-space-xs: 0.25rem;
    --ph-space-sm: 0.5rem;
    --ph-space-md: 1rem;
    --ph-space-lg: 1.5rem;
    --ph-space-xl: 2rem;
    --ph-space-2xl: 3rem;
    --ph-space-3xl: 4rem;

    /* Border Radius */
    --ph-radius-sm: 0.25rem;
    --ph-radius-md: 0.5rem;
    --ph-radius-lg: 0.75rem;
    --ph-radius-xl: 1rem;
    --ph-radius-full: 9999px;

    /* Shadows */
    --ph-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --ph-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --ph-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --ph-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
}

/* ==========================================================================
   Typography
   ========================================================================== */

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    color: var(--ph-gray-800);
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    line-height: 1.3;
    color: var(--ph-gray-900);
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.ph-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    border-radius: var(--ph-radius-md);
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    border: none;
}

.ph-btn-primary {
    background: var(--ph-primary);
    color: #fff;
}

.ph-btn-primary:hover {
    background: var(--ph-primary-dark);
    color: #fff;
}

.ph-btn-secondary {
    background: var(--ph-gray-100);
    color: var(--ph-gray-700);
    border: 1px solid var(--ph-gray-300);
}

.ph-btn-secondary:hover {
    background: var(--ph-gray-200);
    color: var(--ph-gray-800);
}

.ph-btn-accent {
    background: var(--ph-accent);
    color: #fff;
}

.ph-btn-accent:hover {
    background: var(--ph-accent-dark);
    color: #fff;
}

.ph-btn-lg {
    padding: 1rem 2rem;
    font-size: 1.125rem;
}

.ph-btn-sm {
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
}

/* ==========================================================================
   Hero Section
   ========================================================================== */

.ph-hero {
    background: linear-gradient(135deg, var(--ph-primary) 0%, var(--ph-primary-dark) 100%);
    color: #fff;
    padding: var(--ph-space-3xl) var(--ph-space-lg);
    text-align: center;
}

.ph-hero h1 {
    color: #fff;
    font-size: 2.5rem;
    margin-bottom: var(--ph-space-md);
}

@media (min-width: 768px) {
    .ph-hero h1 {
        font-size: 3.5rem;
    }
}

.ph-hero p {
    font-size: 1.25rem;
    opacity: 0.9;
    max-width: 700px;
    margin: 0 auto var(--ph-space-xl);
}

.ph-hero-buttons {
    display: flex;
    gap: var(--ph-space-md);
    justify-content: center;
    flex-wrap: wrap;
}

.ph-hero .ph-btn-primary {
    background: #fff;
    color: var(--ph-primary);
}

.ph-hero .ph-btn-primary:hover {
    background: var(--ph-gray-100);
}

.ph-hero .ph-btn-secondary {
    background: rgba(255,255,255,0.15);
    color: #fff;
    border: 2px solid #fff;
}

.ph-hero .ph-btn-secondary:hover {
    background: rgba(255,255,255,0.25);
    border-color: #fff;
}

/* ==========================================================================
   Feature Cards
   ========================================================================== */

.ph-features {
    padding: var(--ph-space-3xl) var(--ph-space-lg);
    background: var(--ph-gray-50);
}

.ph-features-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--ph-space-xl);
    max-width: 1200px;
    margin: 0 auto;
}

@media (max-width: 1024px) {
    .ph-features-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .ph-features-grid {
        grid-template-columns: 1fr;
    }
}

.ph-feature-card {
    background: #fff;
    padding: var(--ph-space-xl);
    border-radius: var(--ph-radius-lg);
    box-shadow: var(--ph-shadow-md);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    text-align: center;
}

.ph-feature-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--ph-shadow-lg);
}

.ph-feature-icon {
    width: 48px;
    height: 48px;
    background: var(--ph-primary-light);
    color: #fff;
    border-radius: var(--ph-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin: 0 auto var(--ph-space-md);
}

.ph-feature-card h3 {
    font-size: 1.25rem;
    margin-bottom: var(--ph-space-sm);
}

.ph-feature-card p {
    color: var(--ph-gray-600);
    margin: 0;
}

/* ==========================================================================
   Pricing Section
   ========================================================================== */

.ph-pricing {
    padding: var(--ph-space-3xl) var(--ph-space-lg);
}

.ph-pricing-header {
    text-align: center;
    max-width: 700px;
    margin: 0 auto var(--ph-space-2xl);
}

.ph-pricing-header h2 {
    font-size: 2rem;
    margin-bottom: var(--ph-space-sm);
}

.ph-pricing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: var(--ph-space-lg);
    max-width: 1200px;
    margin: 0 auto;
}

.ph-pricing-card {
    background: #fff;
    border: 2px solid var(--ph-gray-200);
    border-radius: var(--ph-radius-lg);
    padding: var(--ph-space-xl);
    text-align: center;
    transition: border-color 0.2s ease;
}

.ph-pricing-card:hover {
    border-color: var(--ph-primary-light);
}

.ph-pricing-card.featured {
    border-color: var(--ph-primary);
    position: relative;
}

.ph-pricing-card.featured::before {
    content: 'Beliebt';
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--ph-primary);
    color: #fff;
    padding: 0.25rem 1rem;
    border-radius: var(--ph-radius-full);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
}

.ph-pricing-card h3 {
    font-size: 1.25rem;
    margin-bottom: var(--ph-space-sm);
}

.ph-pricing-price {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--ph-gray-900);
    margin: var(--ph-space-md) 0;
}

.ph-pricing-price span {
    font-size: 1rem;
    font-weight: 400;
    color: var(--ph-gray-500);
}

.ph-pricing-features {
    list-style: none;
    padding: 0;
    margin: var(--ph-space-lg) 0;
    text-align: left;
}

.ph-pricing-features li {
    padding: var(--ph-space-sm) 0;
    color: var(--ph-gray-600);
    display: flex;
    align-items: center;
    gap: var(--ph-space-sm);
}

.ph-pricing-features li::before {
    content: '\2713';
    color: var(--ph-accent);
    font-weight: bold;
}

/* ==========================================================================
   Section Headers
   ========================================================================== */

.ph-section {
    padding: var(--ph-space-3xl) var(--ph-space-lg);
}

.ph-section-header {
    text-align: center;
    max-width: 700px;
    margin: 0 auto var(--ph-space-2xl);
}

.ph-section-header h2 {
    font-size: 2rem;
    margin-bottom: var(--ph-space-sm);
}

.ph-section-header p {
    color: var(--ph-gray-600);
    font-size: 1.125rem;
}

/* ==========================================================================
   WCAG Levels
   ========================================================================== */

.ph-wcag-levels {
    display: flex;
    gap: var(--ph-space-md);
    justify-content: center;
    flex-wrap: wrap;
    margin: var(--ph-space-xl) 0;
}

.ph-wcag-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--ph-space-xs);
    padding: 0.5rem 1rem;
    border-radius: var(--ph-radius-full);
    font-weight: 600;
    font-size: 0.875rem;
}

.ph-wcag-badge.level-a {
    background: #fef3c7;
    color: #92400e;
}

.ph-wcag-badge.level-aa {
    background: #d1fae5;
    color: #065f46;
}

.ph-wcag-badge.level-aaa {
    background: #dbeafe;
    color: #1e40af;
}

.ph-wcag-badge.bitv {
    background: #fce7f3;
    color: #9d174d;
}

/* ==========================================================================
   Comparison Table
   ========================================================================== */

.ph-comparison-table {
    width: 100%;
    border-collapse: collapse;
    margin: var(--ph-space-xl) 0;
}

.ph-comparison-table th,
.ph-comparison-table td {
    padding: var(--ph-space-md);
    text-align: left;
    border-bottom: 1px solid var(--ph-gray-200);
}

.ph-comparison-table th {
    background: var(--ph-gray-50);
    font-weight: 600;
}

.ph-comparison-table .check {
    color: var(--ph-accent);
    font-size: 1.25rem;
}

.ph-comparison-table .cross {
    color: var(--ph-gray-400);
    font-size: 1.25rem;
}

/* ==========================================================================
   FAQ Section
   ========================================================================== */

.ph-faq {
    max-width: 800px;
    margin: 0 auto;
}

.ph-faq-item {
    border-bottom: 1px solid var(--ph-gray-200);
    padding: var(--ph-space-lg) 0;
}

.ph-faq-item h3 {
    font-size: 1.125rem;
    margin-bottom: var(--ph-space-sm);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.ph-faq-item p {
    color: var(--ph-gray-600);
    margin: 0;
}

/* ==========================================================================
   Footer
   ========================================================================== */

.site-footer {
    background: var(--ph-gray-900);
    color: var(--ph-gray-300);
    padding: var(--ph-space-2xl) var(--ph-space-lg);
}

.site-footer a {
    color: var(--ph-gray-300);
    text-decoration: none;
}

.site-footer a:hover {
    color: #fff;
}

.ph-footer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--ph-space-xl);
    max-width: 1200px;
    margin: 0 auto;
}

.ph-footer-col h4 {
    color: #fff;
    font-size: 1rem;
    margin-bottom: var(--ph-space-md);
}

.ph-footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ph-footer-col li {
    margin-bottom: var(--ph-space-sm);
}

.ph-footer-bottom {
    border-top: 1px solid var(--ph-gray-700);
    margin-top: var(--ph-space-2xl);
    padding-top: var(--ph-space-lg);
    text-align: center;
    font-size: 0.875rem;
}

/* ==========================================================================
   Legal Pages
   ========================================================================== */

.ph-legal-page {
    max-width: 800px;
    margin: 0 auto;
    padding: var(--ph-space-2xl) var(--ph-space-lg);
}

.ph-legal-page h1 {
    margin-bottom: var(--ph-space-xl);
}

.ph-legal-page h2 {
    font-size: 1.5rem;
    margin-top: var(--ph-space-xl);
    margin-bottom: var(--ph-space-md);
}

.ph-legal-page h3 {
    font-size: 1.25rem;
    margin-top: var(--ph-space-lg);
    margin-bottom: var(--ph-space-sm);
}

.ph-legal-page p,
.ph-legal-page ul,
.ph-legal-page ol {
    margin-bottom: var(--ph-space-md);
}

.ph-legal-page ul,
.ph-legal-page ol {
    padding-left: var(--ph-space-xl);
}

/* ==========================================================================
   WooCommerce Overrides
   ========================================================================== */

.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button {
    background: var(--ph-primary) !important;
    color: #fff !important;
    border-radius: var(--ph-radius-md) !important;
    font-weight: 600 !important;
    padding: 0.75rem 1.5rem !important;
    transition: background 0.2s ease !important;
}

.woocommerce .button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    background: var(--ph-primary-dark) !important;
}

.woocommerce .button.alt,
.woocommerce button.button.alt {
    background: var(--ph-accent) !important;
}

.woocommerce .button.alt:hover,
.woocommerce button.button.alt:hover {
    background: var(--ph-accent-dark) !important;
}

.woocommerce-message,
.woocommerce-info {
    border-top-color: var(--ph-primary) !important;
}

.woocommerce-message::before,
.woocommerce-info::before {
    color: var(--ph-primary) !important;
}

/* Product Cards */
.woocommerce ul.products li.product {
    border: 1px solid var(--ph-gray-200);
    border-radius: var(--ph-radius-lg);
    padding: var(--ph-space-lg);
    transition: box-shadow 0.2s ease;
}

.woocommerce ul.products li.product:hover {
    box-shadow: var(--ph-shadow-lg);
}

.woocommerce ul.products li.product .price {
    color: var(--ph-primary) !important;
    font-weight: 700;
    font-size: 1.25rem !important;
}

/* ==========================================================================
   PluginHaus Dashboard Improvements
   ========================================================================== */

.pluginhaus-dashboard {
    background: var(--ph-gray-50);
    border-radius: var(--ph-radius-lg);
    padding: var(--ph-space-xl);
}

.pluginhaus-token-balance {
    background: linear-gradient(135deg, var(--ph-primary) 0%, var(--ph-primary-dark) 100%);
    color: #fff;
    padding: var(--ph-space-xl);
    border-radius: var(--ph-radius-lg);
    text-align: center;
    margin-bottom: var(--ph-space-xl);
}

.pluginhaus-token-balance .token-count {
    font-size: 3rem;
    font-weight: 700;
    display: block;
}

.pluginhaus-token-balance .token-label {
    opacity: 0.9;
}

/* ==========================================================================
   Responsive Adjustments
   ========================================================================== */

@media (max-width: 768px) {
    .ph-hero {
        padding: var(--ph-space-2xl) var(--ph-space-md);
    }

    .ph-hero h1 {
        font-size: 2rem;
    }

    .ph-hero p {
        font-size: 1rem;
    }

    .ph-features,
    .ph-pricing,
    .ph-section {
        padding: var(--ph-space-2xl) var(--ph-space-md);
    }

    .ph-pricing-grid {
        grid-template-columns: 1fr;
    }

    .ph-comparison-table {
        font-size: 0.875rem;
    }

    .ph-comparison-table th,
    .ph-comparison-table td {
        padding: var(--ph-space-sm);
    }
}

/* ==========================================================================
   Utility Classes
   ========================================================================== */

.ph-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--ph-space-lg);
}

.ph-text-center {
    text-align: center;
}

.ph-text-muted {
    color: var(--ph-gray-500);
}

.ph-mt-0 { margin-top: 0; }
.ph-mt-1 { margin-top: var(--ph-space-sm); }
.ph-mt-2 { margin-top: var(--ph-space-md); }
.ph-mt-3 { margin-top: var(--ph-space-lg); }
.ph-mt-4 { margin-top: var(--ph-space-xl); }

.ph-mb-0 { margin-bottom: 0; }
.ph-mb-1 { margin-bottom: var(--ph-space-sm); }
.ph-mb-2 { margin-bottom: var(--ph-space-md); }
.ph-mb-3 { margin-bottom: var(--ph-space-lg); }
.ph-mb-4 { margin-bottom: var(--ph-space-xl); }

.ph-hidden {
    display: none !important;
}

@media (max-width: 768px) {
    .ph-hidden-mobile {
        display: none !important;
    }
}

@media (min-width: 769px) {
    .ph-hidden-desktop {
        display: none !important;
    }
}

/* ==========================================================================
   Global Overrides - Site Title, Full Width, Colors
   ========================================================================== */

/* Hide site title next to logo */
.site-title,
.site-description,
.ast-site-title-wrap .site-title {
    display: none !important;
}

/* Hide page titles on pages (especially homepage) */
.page .entry-title,
.page-id-15 .entry-title,
.home .entry-title,
.ast-archive-description,
.page .ast-archive-description {
    display: none !important;
}

/* Full width layout */
.ast-container,
.site-content > .ast-container {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-comment-list li.depth-1,
.ast-separate-container .comment-respond,
.single.ast-separate-container .ast-author-details,
.ast-separate-container .ast-related-posts-wrap,
.ast-separate-container .ast-woocommerce-container {
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}

/* Content sections with max-width for readability */
.ph-section,
.ph-features,
.ph-pricing,
.ph-hero,
.entry-content > *:not(.alignfull):not(.alignwide):not(.ph-hero):not(.ph-features):not(.ph-pricing):not(.ph-section) {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--ph-space-lg);
    padding-right: var(--ph-space-lg);
}

/* Hero and feature sections full width background */
.ph-hero,
.ph-features,
.ph-pricing,
.ph-section {
    max-width: 100%;
    padding-left: var(--ph-space-lg);
    padding-right: var(--ph-space-lg);
}

.ph-hero > *,
.ph-features > *,
.ph-pricing > *,
.ph-section > * {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Override green checkmarks to blue */
.ph-pricing-features li::before,
.ph-comparison-table .check {
    color: var(--ph-primary) !important;
}

/* Footer link colors - ensure they are light gray, not green */
.site-footer,
footer,
.ast-footer-overlay,
.ast-small-footer {
    background: var(--ph-gray-900) !important;
}

.site-footer a,
footer a,
.ast-footer-overlay a,
.ast-small-footer a,
.ast-small-footer .ast-footer-copyright a {
    color: var(--ph-gray-300) !important;
    text-decoration: none;
}

.site-footer a:hover,
footer a:hover,
.ast-footer-overlay a:hover,
.ast-small-footer a:hover {
    color: #fff !important;
}

/* Astra default link color override */
a {
    color: var(--ph-primary);
}

a:hover {
    color: var(--ph-primary-dark);
}

/* Header full width */
.ast-primary-header-bar,
.site-header,
.main-header-bar {
    max-width: 100%;
}

.ast-primary-header-bar .site-primary-header-wrap,
.main-header-bar-wrap .main-header-bar {
    max-width: 1400px;
    margin: 0 auto;
    padding-left: var(--ph-space-lg);
    padding-right: var(--ph-space-lg);
}

/* Remove boxed appearance */
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post,
.ast-page-builder-template .site-content > .ast-container {
    background: transparent;
    box-shadow: none;
}

body.ast-separate-container {
    background: #fff;
}

/* WooCommerce button colors - blue not green */
.woocommerce .button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce a.button.alt {
    background: var(--ph-primary) !important;
}

.woocommerce .button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce a.button.alt:hover {
    background: var(--ph-primary-dark) !important;
}

/* ==========================================================================
   Main Navigation - Override green to blue
   ========================================================================== */

/* Primary menu links */
.main-header-menu a,
.ast-header-break-point .main-header-menu a,
.main-header-bar .main-header-menu > .menu-item > a,
.ast-header-sections-navigation .main-header-menu > .menu-item > a,
nav.site-navigation a,
.ast-nav-menu a,
.ast-header-sections-navigation a {
    color: var(--ph-gray-700) !important;
}

.main-header-menu a:hover,
.main-header-bar .main-header-menu > .menu-item > a:hover,
.ast-header-sections-navigation .main-header-menu > .menu-item > a:hover,
nav.site-navigation a:hover,
.ast-nav-menu a:hover,
.ast-header-sections-navigation a:hover,
.main-header-menu .current-menu-item > a,
.main-header-menu .current_page_item > a {
    color: var(--ph-primary) !important;
}

/* Mobile menu */
.ast-header-break-point .main-header-menu a,
.ast-mobile-popup-drawer .main-header-menu a,
.ast-mobile-popup-content a {
    color: var(--ph-gray-700) !important;
}

.ast-header-break-point .main-header-menu a:hover,
.ast-mobile-popup-drawer .main-header-menu a:hover {
    color: var(--ph-primary) !important;
}

/* ==========================================================================
   Footer - Override green to gray/white
   ========================================================================== */

/* Footer text and links */
.ast-small-footer,
.ast-small-footer p,
.site-footer-primary-section,
.site-footer-above-section,
.site-footer-below-section,
footer .ast-footer-copyright,
.ast-footer-copyright {
    color: var(--ph-gray-400) !important;
}

.ast-small-footer a,
.site-footer-primary-section a,
.site-footer-above-section a,
.site-footer-below-section a,
footer .ast-footer-copyright a,
.ast-footer-copyright a,
.ast-small-footer .ast-footer-site-title a {
    color: var(--ph-gray-300) !important;
}

.ast-small-footer a:hover,
.site-footer-primary-section a:hover,
.site-footer-above-section a:hover,
.site-footer-below-section a:hover,
footer .ast-footer-copyright a:hover,
.ast-footer-copyright a:hover {
    color: #fff !important;
}

/* Hide Astra credit completely */
.ast-small-footer .ast-footer-site-title,
.ast-footer-copyright .ast-footer-site-title,
.site-footer .ast-footer-site-title,
.ast-small-footer-section-1 .ast-footer-site-title,
.ast-small-footer-section-2 .ast-footer-site-title,
a[href*="developer.flavor"],
a[href*="developer_link"],
a[href*="developer_flavor"],
a[href*="flavor_text"],
.flavor-developer-link,
.developer-link,
a[href*="developer.flavor.developer"],
a[href*="flavor.developer"],
[class*="developer-flavor"],
[class*="flavor-developer"] {
    display: none !important;
}

/* Hide any element containing "Powered by" or "developer" links */
.ast-small-footer-section-1:has(a[href*="developer"]),
.ast-small-footer-section-2:has(a[href*="developer"]),
.ast-small-footer-section-1:has(a[href*="flavor"]),
.ast-small-footer-section-2:has(a[href*="flavor"]) {
    display: none !important;
}

/* Hide Astra footer section 1 (usually contains credit) */
.ast-small-footer-section-1 {
    display: none !important;
}

/* ==========================================================================
   Product Cards - Homepage
   ========================================================================== */

.ph-product-grid {
    gap: var(--ph-space-lg);
}

.ph-product-card {
    background: #fff;
    padding: var(--ph-space-xl);
    border-radius: var(--ph-radius-lg);
    box-shadow: var(--ph-shadow-md);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.ph-product-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--ph-shadow-lg);
}

.ph-product-card.featured {
    border: 2px solid var(--ph-primary);
    position: relative;
}

.ph-product-card.featured::before {
    content: "Verfügbar";
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--ph-primary);
    color: #fff;
    padding: 4px 16px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
}

.ph-product-card.coming-soon {
    opacity: 0.7;
    background: #f9fafb;
}

.ph-product-card h3 {
    font-size: 1.5rem;
    margin-bottom: var(--ph-space-md);
}

.ph-product-card p {
    flex-grow: 1;
}

.ph-product-card ul {
    text-align: left;
    margin: var(--ph-space-md) 0;
    padding-left: var(--ph-space-lg);
}

.ph-product-card li {
    margin-bottom: var(--ph-space-xs);
}

.ph-badge-coming-soon {
    display: inline-block;
    background: var(--ph-gray-200);
    color: var(--ph-gray-600);
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 0.875rem;
    margin-top: auto;
}

/* CTA Section */
.ph-cta-section {
    background: linear-gradient(135deg, var(--ph-primary) 0%, var(--ph-primary-dark) 100%);
    color: #fff;
    padding: var(--ph-space-3xl) var(--ph-space-xl);
    border-radius: var(--ph-radius-lg);
    margin: var(--ph-space-2xl) 0;
}

.ph-cta-section h2,
.ph-cta-section p {
    color: #fff;
}

.ph-cta-section .wp-block-button__link {
    background: #fff;
    color: var(--ph-primary);
}

.ph-cta-section .wp-block-button__link:hover {
    background: #f3f4f6;
}

.ph-cta-section .is-style-outline .wp-block-button__link {
    background: transparent !important;
    border: 2px solid #fff !important;
    color: #fff !important;
}

.ph-cta-section .is-style-outline .wp-block-button__link:hover {
    background: rgba(255,255,255,0.15) !important;
    border-color: #fff !important;
    color: #fff !important;
}

/* Product Highlight Section */
.ph-product-highlight {
    align-items: center;
    gap: var(--ph-space-2xl);
}

.ph-product-highlight ul {
    margin: var(--ph-space-lg) 0;
}

.ph-product-highlight li {
    margin-bottom: var(--ph-space-sm);
}

/* Stats Box */
.ph-stats-box {
    background: #fff;
    padding: var(--ph-space-xl);
    border-radius: var(--ph-radius-lg);
    box-shadow: var(--ph-shadow-md);
    text-align: center;
    margin-top: var(--ph-space-lg);
}

.ph-price-highlight {
    font-size: 1.25rem;
    color: var(--ph-primary);
    margin-top: var(--ph-space-md);
}

.ph-price-highlight strong {
    font-size: 1.75rem;
}

/* ==========================================================================
   Custom Footer with Legal Links
   ========================================================================== */

.ph-footer-legal {
    background: var(--ph-gray-900);
    padding: var(--ph-space-lg) var(--ph-space-xl);
    border-top: 1px solid var(--ph-gray-800);
}

.ph-footer-container {
    max-width: var(--ph-container-width);
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--ph-space-md);
}

.ph-footer-copyright {
    color: var(--ph-gray-400);
    font-size: 0.875rem;
}

.ph-footer-links {
    display: flex;
    gap: var(--ph-space-lg);
    flex-wrap: wrap;
}

.ph-footer-links a {
    color: var(--ph-gray-400);
    font-size: 0.875rem;
    text-decoration: none;
    transition: color 0.2s ease;
}

.ph-footer-links a:hover {
    color: #fff;
}

/* Hide the duplicate Astra footer */
.site-footer .site-below-footer-wrap {
    display: none;
}

@media (max-width: 768px) {
    .ph-footer-container {
        flex-direction: column;
        text-align: center;
    }

    .ph-footer-links {
        justify-content: center;
    }
}

/* ==========================================================================
   Outline Buttons - Dark backgrounds (Hero & CTA sections)
   ========================================================================== */

.ph-hero .is-style-outline .wp-block-button__link,
.ph-hero .wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-group.ph-hero .is-style-outline .wp-block-button__link {
    background: transparent !important;
    border: 2px solid #fff !important;
    color: #fff !important;
}

.ph-hero .is-style-outline .wp-block-button__link:hover,
.ph-hero .wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-group.ph-hero .is-style-outline .wp-block-button__link:hover {
    background: rgba(255,255,255,0.15) !important;
    border-color: #fff !important;
    color: #fff !important;
}

/* ==========================================================================
   Outline Buttons - Light backgrounds (Pricing cards, general sections)
   Excludes CTA sections which have dark backgrounds
   ========================================================================== */

.ph-pricing-card .is-style-outline .wp-block-button__link,
.ph-section:not(.ph-cta-section) .is-style-outline .wp-block-button__link {
    background: transparent !important;
    border: 2px solid var(--ph-primary) !important;
    color: var(--ph-primary) !important;
}

.ph-pricing-card .is-style-outline .wp-block-button__link:hover,
.ph-section:not(.ph-cta-section) .is-style-outline .wp-block-button__link:hover {
    background: var(--ph-primary) !important;
    color: #fff !important;
}
