/*
Theme Name: Pulsart
Version: 9.0.0 - Final Stable Layout
*/

/* --- 1. FONT & DESIGN SYSTEM SETUP --- */
@font-face { font-family: "Hespress-Medium"; src: url("https://i1.hespress.com/wp-content/themes/hespress/fonts/Hespress-Medium.woff") format("woff"); font-display: swap; }
@font-face { font-family: "Hespress-Bold"; src: url("https://i1.hespress.com/wp-content/themes/hespress/fonts/Hespress-Bold.woff") format("woff"); font-display: swap; }
@import url('https://fonts.googleapis.com/css2?family=Lalezar&display=swap');

:root {
    --brand-primary: #cfa031;
    --brand-dark: #111827;
    --text-primary: #ffffff;
    --text-secondary: #9ca3af;
    --border-color: #374151;
    --font-body: "Hespress-Medium", sans-serif;
    --font-heading: "Hespress-Bold", sans-serif;
    --font-display: "Lalezar", cursive;
}

/* --- 2. GLOBAL STYLES & RTL SETUP --- */
body {
    font-family: var(--font-body);
    margin: 0;
    background-color: var(--brand-dark);
    color: var(--text-primary);
    direction: rtl;
}
* { box-sizing: border-box; }
a { text-decoration: none; color: var(--brand-primary); transition: color 0.2s ease; }
a:hover { color: var(--text-primary); }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); }

/* --- 3. CORE & HEADER LAYOUT (RTL Corrected) --- */
.site-content { max-width: 1200px; margin: 0 auto; padding: 20px; }
.site-header { max-width: 1200px; margin: 0 auto; padding: 20px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--border-color); }
.site-title a { font-family: var(--font-display); font-size: 36px; color: var(--text-primary); }
.main-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; }
.main-navigation a { font-family: var(--font-heading); font-size: 16px; color: var(--text-primary); margin-left: 30px; }

/* --- 4. HOMEPAGE GRID & WIDGETS --- */
.home-grid-container {
    display: flex; /* Mobile: A simple column */
    flex-direction: column;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}
/* Mobile order: main content appears before the sidebar */
.main-content-area { order: 1; }
.sidebar-area { order: 2; }

@media (min-width: 992px) {
    .home-grid-container {
        display: grid; /* Desktop: Switch to a two-column grid */
        grid-template-columns: 350px 1fr; /* Defines a 350px left column and a flexible right column */
        gap: 30px;
    }
    /* Assign sections to the grid columns in the correct RTL order */
    .sidebar-area { grid-column: 1 / 2; }   /* This puts the sidebar on the LEFT */
    .main-content-area { grid-column: 2 / 3; } /* This puts the main content on the RIGHT */
}

.widget { margin-bottom: 40px; }
.widget-title { font-family: var(--font-display); font-size: 2rem; color: var(--brand-primary); margin: 0 0 20px 0; padding-bottom: 10px; border-bottom: 1px solid var(--border-color); }

/* --- 5. POST COLUMNS SECTION --- */
#home-posts-columns-section { border-top: 1px solid var(--border-color); padding-top: 40px; margin-top: 20px; }
.posts-columns-wrapper { display: grid; grid-template-columns: 1fr; gap: 40px; }
@media (min-width: 768px) { .posts-columns-wrapper { grid-template-columns: repeat(3, 1fr); } }
.column-title { font-family: 'Lalezar', cursive; font-size: 28px; color: var(--brand-primary); margin: 0 0 20px 0; }

/* --- 6. SINGLE POST & ARCHIVE PAGES --- */
.article-container { max-width: 750px; margin: 40px auto; }
.article-page-content p:first-of-type::first-letter { font-family: var(--font-display); font-size: 6rem; float: right; line-height: 0.8; margin-left: 15px; margin-top: 10px; color: var(--brand-primary); }
.archive-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }