/*
Theme Name: jTax Motywv2
Theme URI: https://piersa.pl/
Author: (Wpisz swoją nazwę autora)
Description: Nowoczesny, minimalistyczny motyw dla Kancelarii Podatkowej jTax, oparty na Tailwind CSS.
Version: 1.0
Requires at least: 5.0
Tested up to: 6.5
Requires PHP: 7.4
Tags: minimalist, business, tax, tailwind
*/

/* Custom styles from our prototype */
body {
    font-family: 'Lato', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Poppins', sans-serif;
}
.bg-brand-blue { background-color: #1a325d; }
.text-brand-blue { color: #1a325d; }
.border-brand-blue { border-color: #1a325d; }
.bg-brand-red { background-color: #d12727; }
.text-brand-red { color: #d12727; }
.hover\:bg-brand-red-dark:hover { background-color: #b92222; }
.section-padding { padding: 6rem 1rem; }
@media (max-width: 768px) { .section-padding { padding: 4rem 1rem; } }

.header-scrolled { 
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); 
    background-color: white; 
    padding-top: 0.75rem; 
    padding-bottom: 0.75rem; 
}

/* WordPress Core CSS Classes */
.alignwide {
    margin-left: -50px;
    margin-right: -50px;
    max-width: 1200px;
}
.alignfull {
    margin-left: calc(-100vw / 2 + 100% / 2);
    margin-right: calc(-100vw / 2 + 100% / 2);
    max-width: 100vw;
}
.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* Styling for wp_nav_menu (Desktop) */
.primary-menu-container {
    display: none; /* Hide default container */
}
@media (min-width: 1024px) {
    .primary-menu-container {
        display: flex; /* Show on desktop */
        align-items: center;
        space-x: 2rem; /* space-x-8 */
    }
}
.primary-menu-container ul {
    display: flex;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 2rem; /* space-x-8 */
}
.primary-menu-container a {
    font-weight: 600; /* font-semibold */
    color: #1a325d; /* text-brand-blue */
    transition: color 0.3s;
}
.primary-menu-container a:hover {
    color: #d12727; /* hover:text-brand-red */
}
.primary-menu-container .current-menu-item a {
    font-weight: 700; /* font-bold */
    color: #d12727; /* text-brand-red */
}

/* Styling for wp_nav_menu (Mobile) */
.mobile-menu-container ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.mobile-menu-container a {
    display: block;
    text-align: center;
    padding: 0.75rem 1rem; /* py-3 px-4 */
    font-size: 1.125rem; /* text-lg */
    font-weight: 600; /* font-semibold */
    color: #1a325d; /* text-brand-blue */
}
.mobile-menu-container a:hover {
    background-color: #F9FAFB; /* hover:bg-gray-50 */
}
.mobile-menu-container .current-menu-item a {
    font-weight: 700; /* font-bold */
    color: #d12727; /* text-brand-red */
}


/* =========================================
   STYLE DLA TREŚCI WPISÓW (KLASA .PROSE)
   NAPRAWA WORDPRESS + TAILWIND
   ========================================= */

/* 1. JUSTOWANIE TEKSTU */
.prose p {
    text-align: justify;  /* Włącza justowanie */
    margin-bottom: 1.5em;
    line-height: 1.75;
    color: #374151;
    font-size: 1.05rem;
}

/* 2. STANDARDOWE KLASY WORDPRESSA (Obrazki i opływanie - POPRAWIONE) */

/* Ustawienia wspólne dla obrazków wyrównanych */
.prose .alignleft, 
.prose .alignright {
    margin-bottom: 1em;
    display: inline; /* Naprawia dziwne zachowania blokowe */
}

/* Obrazek do lewej */
.prose .alignleft {
    float: left;
    margin-right: 1.5em;
}

/* Obrazek do prawej */
.prose .alignright {
    float: right;
    margin-left: 1.5em;
}

/* Obrazek na środku */
.prose .aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1.5em;
    clear: both;
}

/* === KLUCZOWA POPRAWKA === */
/* Tailwind wymusza width: 100%. Musimy to zresetować dla obrazków opływanych,
   żeby respektowały wielkość ustawioną myszką w edytorze WP */

.prose .alignleft img, 
.prose .alignright img {
    width: auto !important;      /* Obrazek ma taką szerokość jak w edytorze */
    max-width: 100%;             /* Ale nie może wyjść poza ekran */
    height: auto;                /* Zachowaj proporcje */
}

/* Ograniczenie dla bardzo dużych zdjęć (opcjonalne) */
/* Jeśli wstawisz gigantyczne zdjęcie bez zmniejszania, 
   zajmie ono max 50% szerokości tekstu, żeby nie zepsuć czytania */
.prose .alignleft, .prose .alignright {
    max-width: 50%; 
}

/* "Clearfix" */
.prose::after {
    content: "";
    display: table;
    clear: both;
}

/* 3. POZOSTAŁE STYLE TYPOGRAFII (Nagłówki, Listy) */

/* Nagłówki */
.prose h1, .prose h2, .prose h3, .prose h4, .prose h5, .prose h6 {
    color: #1a325d;       /* Twój Brand Blue */
    font-weight: 800;     /* Extra Bold */
    margin-top: 2em;
    margin-bottom: 0.8em;
    line-height: 1.2;
    clear: both;          /* Ważne: nagłówek zawsze pod obrazkiem */
}

.prose h2 { font-size: 1.8rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 10px; }
.prose h3 { font-size: 1.5rem; }

/* Listy */
.prose ul, .prose ol {
    margin-bottom: 1.5em;
    padding-left: 2em;
    overflow: hidden; /* Zapobiega wchodzeniu punktorów na obrazek */
}

.prose ul { list-style-type: disc; }
.prose ol { list-style-type: decimal; }

.prose li {
    margin-bottom: 0.5em;
}

/* Linki */
.prose a {
    color: #dc2626; /* Brand Red */
    text-decoration: underline;
    font-weight: 600;
}

/* Cytaty */
.prose blockquote {
    border-left: 4px solid #dc2626;
    background-color: #f9fafb;
    padding: 1rem 1.5rem;
    font-style: italic;
    color: #4b5563;
    margin: 2em 0;
    clear: both;
}

/* Podpisy pod zdjęciami (wp-caption) */
.wp-caption {
    max-width: 100%;
    margin-bottom: 1.5em;
}
.wp-caption-text {
    font-size: 0.9em;
    color: #6b7280;
    text-align: center;
    margin-top: 0.5em;
}