/**
 * Page Header Widget Styles
 * 
 * Simple page header with title and subtitle for inner pages
 * 
 * @package DrYazdani
 * @since 1.0.0
 * 
 * Dependencies: design-system.css
 */

/* ==========================================================================
   Container
   ========================================================================== */

.dryazdani-page-header {
    position: relative;
    width: 100%;
    background-color: var(--dryazdani-bg-light);
    padding: var(--dryazdani-space-16) var(--dryazdani-space-6);
}

/* Container styles inherited from .dryazdani-container */

.dryazdani-page-header__content {
    text-align: center;
}


/* ==========================================================================
   Title
   ========================================================================== */

.dryazdani-page-header__title {
    font-family: var(--dryazdani-font-heading);
    font-size: var(--dryazdani-text-4xl);
    font-weight: var(--dryazdani-font-semibold);
    color: var(--dryazdani-text-primary);
    line-height: var(--dryazdani-leading-tight);
    margin-block-end: var(--dryazdani-space-6);
    margin-block-start: 0;
}


/* ==========================================================================
   Subtitle
   ========================================================================== */

.dryazdani-page-header__subtitle {
    font-family: var(--dryazdani-font-body);
    font-size: var(--dryazdani-text-xl);
    font-weight: var(--dryazdani-font-normal);
    color: var(--dryazdani-text-body);
    line-height: var(--dryazdani-leading-relaxed);
    margin: 0;
    max-width: 800px;
    margin-inline: auto;
}


/* ==========================================================================
   RTL Support
   ========================================================================== */

html[dir="rtl"] .dryazdani-page-header__title,
html[dir="rtl"] .dryazdani-page-header__subtitle {
    font-family: var(--dryazdani-font-arabic);
}


/* ==========================================================================
   Responsive Breakpoints
   ========================================================================== */

/* Tablet (768px+) */
@media (min-width: 768px) {
    .dryazdani-page-header {
        padding: var(--dryazdani-space-20) var(--dryazdani-space-8);
    }

    .dryazdani-page-header__title {
        font-size: var(--dryazdani-text-5xl);
    }
}

/* Desktop (1024px+) */
@media (min-width: 1024px) {
    .dryazdani-page-header {
        padding: var(--dryazdani-space-24) var(--dryazdani-space-12);
    }

    .dryazdani-page-header__title {
        font-size: var(--dryazdani-text-6xl);
    }
}


/* ==========================================================================
   Accessibility
   ========================================================================== */

/* Focus states handled by design system */

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .dryazdani-page-header * {
        animation: none !important;
        transition: none !important;
    }
}