/* Start custom CSS *//* ============================================================
   SJO Preparation Centre — Oferta — CSS
   Wklej do: WordPress → Wygląd → Personalizuj → Dodatkowy CSS
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800&family=Lora:wght@600&display=swap');

.sjo-prep-oferta *, .sjo-prep-oferta *::before, .sjo-prep-oferta *::after { box-sizing: border-box; }

.sjo-prep-oferta {
  --dark-green: #1B4D3E; --mid-green: #2D6A4F; --light-green: #52B788;
  --pale-green: #D8F3DC; --very-pale: #F0FAF2;
  --sun: #F7A833; --sun-light: #FEF3DC;
  --navy: #1A2C4E;
  --text: #2C2C2A; --muted: #5F5E5A;
  --border: #C8E6C9; --radius: 16px; --white: #fff;
  font-family: 'Nunito', sans-serif !important;
  color: var(--text); width: 100%;
}

/* ── HERO ── */
.sjo-prep-oferta .spo-hero {
  background: linear-gradient(135deg, #1B4D3E 0%, #2D6A4F 55%, #52B788 100%) !important;
  padding: 3rem !important; border-radius: var(--radius) !important;
  margin-bottom: 2rem !important; position: relative !important; overflow: hidden !important;
  display: flex !important; align-items: center !important; gap: 2rem !important;
}
.sjo-prep-oferta .spo-hero::before {
  content: '' !important; position: absolute !important;
  right: -80px !important; top: -80px !important;
  width: 300px !important; height: 300px !important;
  background: rgba(255,255,255,.07) !important; border-radius: 50% !important;
}
.sjo-prep-oferta .spo-hero-text { flex: 1; position: relative !important; }
.sjo-prep-oferta .spo-hero-badge {
  display: inline-block !important; background: var(--sun) !important;
  color: var(--navy) !important; font-size: 13px !important; font-weight: 800 !important;
  padding: 5px 16px !important; border-radius: 50px !important;
  margin-bottom: 1rem !important; font-family: 'Nunito', sans-serif !important;
  white-space: nowrap !important;
}
.sjo-prep-oferta .spo-hero h1 {
  font-family: 'Lora', serif !important; font-size: 2.2rem !important;
  font-weight: 600 !important; color: #fff !important;
  line-height: 1.2 !important; margin: 0 0 .75rem !important;
}
.sjo-prep-oferta .spo-hero h1 em { color: var(--sun) !important; font-style: normal !important; }
.sjo-prep-oferta .spo-hero p {
  font-size: 15px !important; color: rgba(255,255,255,.88) !important;
  line-height: 1.6 !important; margin: 0 !important;
  font-family: 'Nunito', sans-serif !important;
}
.sjo-prep-oferta .spo-hero-logo {
  flex-shrink: 0 !important; background: white !important;
  border-radius: 12px !important; padding: 14px 20px !important;
  position: relative !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.2) !important;
}
.sjo-prep-oferta .spo-hero-logo img {
  height: 50px !important; width: auto !important; display: block !important;
}

/* ── CEFR DIAGRAM ── */
.sjo-prep-oferta .spo-cefr {
  background: var(--very-pale) !important; border-radius: var(--radius) !important;
  padding: 2rem !important; margin-bottom: 2rem !important;
  border: 1.5px solid var(--border) !important; text-align: center !important;
}
.sjo-prep-oferta .spo-cefr h2 {
  font-family: 'Lora', serif !important; font-size: 1.3rem !important;
  font-weight: 600 !important; color: var(--dark-green) !important;
  margin: 0 0 1.25rem !important;
}
.sjo-prep-oferta .spo-cefr img {
  max-width: 100% !important; border-radius: 10px !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.1) !important; display: block !important;
  margin: 0 auto !important;
}

/* ── SECTION TITLE ── */
.sjo-prep-oferta .spo-section-title {
  font-family: 'Lora', serif !important; font-size: 1.5rem !important;
  font-weight: 600 !important; color: var(--text) !important;
  margin: 0 0 1.5rem !important; text-align: center !important;
}

/* ── EGZAMIN CARD ── */
.sjo-prep-oferta .spo-exam-card {
  background: var(--white) !important; border-radius: var(--radius) !important;
  border: 1.5px solid var(--border) !important;
  overflow: hidden !important; margin-bottom: 1.25rem !important;
  box-shadow: 0 3px 12px rgba(0,0,0,.05) !important;
}
.sjo-prep-oferta .spo-exam-header {
  background: linear-gradient(135deg, #1B4D3E, #2D6A4F) !important;
  padding: 1.25rem 1.75rem !important;
  display: flex !important; align-items: center !important;
  justify-content: space-between !important; gap: 1rem !important; flex-wrap: wrap !important;
}
.sjo-prep-oferta .spo-exam-header-left {
  display: flex !important; align-items: center !important; gap: 14px !important;
}
.sjo-prep-oferta .spo-cefr-badge {
  background: var(--sun) !important; color: var(--navy) !important;
  font-family: 'Nunito', sans-serif !important; font-size: 13px !important;
  font-weight: 900 !important; padding: 4px 14px !important;
  border-radius: 50px !important; white-space: nowrap !important;
  flex-shrink: 0 !important;
}
.sjo-prep-oferta .spo-exam-header h2 {
  font-family: 'Lora', serif !important; font-size: 1.2rem !important;
  font-weight: 600 !important; color: #fff !important; margin: 0 !important;
}
.sjo-prep-oferta .spo-exam-logo img {
  height: 36px !important; width: auto !important; display: block !important;
  background: white !important; border-radius: 6px !important; padding: 4px 8px !important;
}

/* ── BODY EGZAMINU ── */
.sjo-prep-oferta .spo-exam-body { padding: 1.5rem 1.75rem !important; }
.sjo-prep-oferta .spo-exam-body p {
  font-size: 14px !important; color: var(--muted) !important;
  line-height: 1.7 !important; margin: 0 0 1rem !important;
  font-family: 'Nunito', sans-serif !important;
}
.sjo-prep-oferta .spo-exam-body p:last-child { margin-bottom: 0 !important; }
.sjo-prep-oferta .spo-exam-body strong { color: var(--text) !important; }
.sjo-prep-oferta .spo-exam-body em { font-style: italic !important; }

/* ── META GRID (Dla kogo / Ocenianie) ── */
.sjo-prep-oferta .spo-exam-meta {
  display: grid !important; grid-template-columns: 1fr 1fr !important;
  gap: 12px !important; margin-bottom: 1.25rem !important;
}
.sjo-prep-oferta .spo-meta-card {
  background: var(--very-pale) !important; border-radius: 12px !important;
  padding: 1rem 1.25rem !important; border: 1.5px solid var(--pale-green) !important;
}
.sjo-prep-oferta .spo-meta-label {
  font-size: 11px !important; font-weight: 800 !important;
  text-transform: uppercase !important; letter-spacing: .5px !important;
  color: var(--mid-green) !important; margin-bottom: .35rem !important;
  display: block !important; font-family: 'Nunito', sans-serif !important;
}
.sjo-prep-oferta .spo-meta-card p {
  font-size: 13px !important; color: var(--text) !important;
  line-height: 1.5 !important; margin: 0 !important;
  font-family: 'Nunito', sans-serif !important;
}

/* ── TABELA STRUKTURY ── */
.sjo-prep-oferta .spo-structure-label {
  font-size: 12px !important; font-weight: 800 !important;
  text-transform: uppercase !important; letter-spacing: .5px !important;
  color: var(--mid-green) !important; margin-bottom: .6rem !important;
  display: block !important; font-family: 'Nunito', sans-serif !important;
}
.sjo-prep-oferta .spo-structure-table { width: 100% !important; border-collapse: collapse !important; margin-bottom: 1.25rem !important; }
.sjo-prep-oferta .spo-structure-table th {
  background: var(--dark-green) !important; color: #fff !important;
  padding: .7rem 1rem !important; font-size: 12px !important; font-weight: 700 !important;
  text-align: center !important; font-family: 'Nunito', sans-serif !important;
}
.sjo-prep-oferta .spo-structure-table th:first-child { border-radius: 8px 0 0 0 !important; }
.sjo-prep-oferta .spo-structure-table th:last-child { border-radius: 0 8px 0 0 !important; }
.sjo-prep-oferta .spo-structure-table td {
  padding: .7rem 1rem !important; font-size: 14px !important; font-weight: 700 !important;
  color: var(--dark-green) !important; text-align: center !important;
  background: var(--very-pale) !important; border: 1px solid var(--pale-green) !important;
  font-family: 'Nunito', sans-serif !important;
}

/* ── TARCZE YLE ── */
.sjo-prep-oferta .spo-shields {
  display: flex !important; align-items: center !important; gap: 8px !important;
  padding: .75rem 1rem !important; background: var(--sun-light) !important;
  border-radius: 10px !important; border: 1.5px solid #FAC775 !important;
  margin-bottom: 1rem !important; font-family: 'Nunito', sans-serif !important;
}
.sjo-prep-oferta .spo-shields-icons { font-size: 1.3rem !important; letter-spacing: 3px !important; }
.sjo-prep-oferta .spo-shields-text { font-size: 13px !important; color: #854F0B !important; font-weight: 700 !important; }

/* ── SKALA PUNKTOWA ── */
.sjo-prep-oferta .spo-scale {
  background: var(--navy) !important; border-radius: 10px !important;
  padding: .75rem 1.25rem !important; margin-bottom: 1rem !important;
  font-size: 13px !important; color: rgba(255,255,255,.9) !important;
  font-family: 'Nunito', sans-serif !important; line-height: 1.5 !important;
}
.sjo-prep-oferta .spo-scale strong { color: var(--sun) !important; }

/* ── WAGI OCENIANIA ── */
.sjo-prep-oferta .spo-weights {
  display: flex !important; gap: 8px !important; flex-wrap: wrap !important; margin-bottom: 1rem !important;
}
.sjo-prep-oferta .spo-weight-chip {
  background: var(--pale-green) !important; color: var(--dark-green) !important;
  border-radius: 50px !important; padding: 5px 14px !important;
  font-size: 12px !important; font-weight: 700 !important;
  font-family: 'Nunito', sans-serif !important;
}

/* ── DIVIDER ── */
.sjo-prep-oferta .spo-divider {
  height: 3px !important; background: linear-gradient(90deg, #1B4D3E, #52B788, #F7A833) !important;
  border-radius: 2px !important; margin: 2rem 0 !important;
}

/* ── CTA ── */
.sjo-prep-oferta .spo-cta {
  background: linear-gradient(135deg, #1B4D3E, #2D6A4F) !important;
  border-radius: var(--radius) !important; padding: 2.5rem 2rem !important;
  text-align: center !important; margin-top: 2rem !important;
}
.sjo-prep-oferta .spo-cta h2 {
  font-family: 'Lora', serif !important; font-size: 1.5rem !important;
  font-weight: 600 !important; color: #fff !important; margin: 0 0 .75rem !important;
}
.sjo-prep-oferta .spo-cta p {
  font-size: 15px !important; color: rgba(255,255,255,.85) !important;
  margin: 0 0 1.75rem !important; font-family: 'Nunito', sans-serif !important;
}
.sjo-prep-oferta .spo-cta-btns { display: flex !important; gap: 12px !important; justify-content: center !important; flex-wrap: wrap !important; }
.sjo-prep-oferta .spo-btn-primary {
  background: var(--sun) !important; color: var(--navy) !important;
  border: none !important; border-radius: 50px !important; padding: 14px 32px !important;
  font-family: 'Nunito', sans-serif !important; font-size: 15px !important;
  font-weight: 800 !important; text-decoration: none !important;
  display: inline-block !important; transition: all .2s !important;
}
.sjo-prep-oferta .spo-btn-primary:hover { background: #e09520 !important; transform: translateY(-1px) !important; color: var(--navy) !important; }
.sjo-prep-oferta .spo-btn-outline {
  background: transparent !important; color: #fff !important;
  border: 2px solid rgba(255,255,255,.5) !important; border-radius: 50px !important;
  padding: 12px 28px !important; font-family: 'Nunito', sans-serif !important;
  font-size: 15px !important; font-weight: 700 !important;
  text-decoration: none !important; display: inline-block !important;
}
.sjo-prep-oferta .spo-btn-outline:hover { background: rgba(255,255,255,.12) !important; color: #fff !important; }
.sjo-prep-oferta .spo-chips { display: flex !important; gap: 10px !important; justify-content: center !important; flex-wrap: wrap !important; margin-top: 1.25rem !important; }
.sjo-prep-oferta .spo-chip {
  background: rgba(255,255,255,.12) !important; border: 1.5px solid rgba(255,255,255,.25) !important;
  border-radius: 50px !important; padding: 7px 16px !important; font-size: 13px !important;
  font-weight: 700 !important; color: #fff !important; text-decoration: none !important;
  font-family: 'Nunito', sans-serif !important;
}
.sjo-prep-oferta .spo-chip:hover { background: rgba(255,255,255,.22) !important; color: #fff !important; }

/* ── RESPONSYWNOŚĆ ── */
@media (max-width: 768px) {
  .sjo-prep-oferta .spo-hero { flex-direction: column !important; padding: 2rem 1.5rem !important; text-align: center !important; }
  .sjo-prep-oferta .spo-hero h1 { font-size: 1.7rem !important; }
  .sjo-prep-oferta .spo-exam-header { flex-direction: column !important; align-items: flex-start !important; }
  .sjo-prep-oferta .spo-exam-meta { grid-template-columns: 1fr !important; }
  .sjo-prep-oferta .spo-structure-table { font-size: 12px !important; }
  .sjo-prep-oferta .spo-structure-table th, .sjo-prep-oferta .spo-structure-table td { padding: .5rem !important; }
}

/* ── AKORDEON ── */
.sjo-prep-oferta .spo-exam-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}
.sjo-prep-oferta .spo-exam-card.spo-open .spo-exam-body {
  max-height: 2000px;
}
.sjo-prep-oferta .spo-exam-header {
  cursor: pointer !important;
  user-select: none !important;
}
.sjo-prep-oferta .spo-exam-header:hover {
  filter: brightness(1.1) !important;
}
.sjo-prep-oferta .spo-arrow {
  color: rgba(255,255,255,.7) !important;
  font-size: 1.2rem !important;
  transition: transform 0.35s !important;
  flex-shrink: 0 !important;
  margin-left: auto !important;
}
.sjo-prep-oferta .spo-exam-card.spo-open .spo-exam-header {
  background: linear-gradient(135deg, #0F3028, #1B4D3E) !important;
}
/* ============================================================
   SJO Preparation Centre — Tabele Kalendarz + Cennik — CSS
   Wklej do: WordPress → Wygląd → Personalizuj → Dodatkowy CSS
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800&family=Lora:wght@600&display=swap');

.sjo-prep-tables *, .sjo-prep-tables *::before, .sjo-prep-tables *::after { box-sizing: border-box; }

.sjo-prep-tables {
  --dark-green: #1B4D3E; --mid-green: #2D6A4F; --light-green: #52B788;
  --pale-green: #D8F3DC; --very-pale: #F0FAF2;
  --navy: #1A2C4E; --navy-light: #E8EDF5;
  --sun: #F7A833; --sun-light: #FEF3DC;
  --cb-blue: #1565C0; --cb-light: #E3F2FD;
  --pb-green: #2D6A4F; --pb-light: #D8F3DC;
  --text: #2C2C2A; --muted: #5F5E5A;
  --border: #C8E6C9; --radius: 16px; --white: #fff;
  font-family: 'Nunito', sans-serif !important;
  display: flex !important; flex-direction: column !important; gap: 2rem !important;
}

/* ── SEKCJA ── */
.spt-section {
  background: var(--white) !important; border-radius: var(--radius) !important;
  border: 1.5px solid var(--border) !important;
  overflow: hidden !important;
  box-shadow: 0 4px 20px rgba(0,0,0,.06) !important;
}

/* ── HEADER SEKCJI ── */
.spt-header {
  background: linear-gradient(135deg, #1B4D3E, #2D6A4F) !important;
  padding: 1.5rem 2rem !important;
  display: flex !important; align-items: center !important;
  justify-content: space-between !important; gap: 1.5rem !important; flex-wrap: wrap !important;
}
.spt-header-text {
  display: flex !important; align-items: center !important; gap: 1rem !important;
}
.spt-section-icon { font-size: 2.2rem !important; flex-shrink: 0 !important; }
.spt-title {
  font-family: 'Lora', serif !important; font-size: 1.3rem !important;
  font-weight: 600 !important; color: #fff !important; margin: 0 0 .2rem !important;
}
.spt-subtitle {
  font-size: 13px !important; color: rgba(255,255,255,.75) !important;
  margin: 0 !important; font-family: 'Nunito', sans-serif !important;
}

/* ── FILTRY ── */
.spt-filters {
  display: flex !important; gap: 8px !important; flex-wrap: wrap !important;
}
.spt-filter-btn {
  background: rgba(255,255,255,.15) !important; color: #fff !important;
  border: 1.5px solid rgba(255,255,255,.3) !important; border-radius: 50px !important;
  padding: 6px 16px !important; font-size: 13px !important; font-weight: 700 !important;
  cursor: pointer !important; transition: all .2s !important;
  font-family: 'Nunito', sans-serif !important;
}
.spt-filter-btn:hover { background: rgba(255,255,255,.25) !important; }
.spt-filter-btn.active {
  background: var(--sun) !important; color: var(--navy) !important;
  border-color: var(--sun) !important;
}

/* ── TABELA ── */
.spt-table-wrap { overflow-x: auto !important; }
.spt-table {
  width: 100% !important; border-collapse: collapse !important;
  font-family: 'Nunito', sans-serif !important; min-width: 600px !important;
}
.spt-table thead tr { background: var(--very-pale) !important; }
.spt-table thead th {
  padding: .9rem 1.25rem !important; font-size: 12px !important; font-weight: 800 !important;
  color: var(--mid-green) !important; text-align: left !important;
  text-transform: uppercase !important; letter-spacing: .5px !important;
  border-bottom: 2px solid var(--pale-green) !important;
}
.spt-table--cennik { min-width: 300px !important; max-width: 580px !important; margin: 0 auto !important; display: table !important; }
.spt-row-even { background: #fff !important; }
.spt-row-odd { background: var(--very-pale) !important; }
.spt-table tbody tr { transition: background .15s !important; }
.spt-table tbody tr:hover { background: var(--pale-green) !important; }
.spt-table tbody td {
  padding: .85rem 1.25rem !important; font-size: 14px !important;
  color: var(--text) !important; border-bottom: 1px solid var(--pale-green) !important;
  vertical-align: middle !important;
}
.spt-table tbody tr:last-child td { border-bottom: none !important; }
.spt-col-egzamin { font-weight: 700 !important; }
.spt-col-format { text-align: center !important; }
.spt-col-date { text-align: center !important; font-size: 13px !important; color: var(--muted) !important; }
.spt-col-cena {
  text-align: center !important; font-weight: 800 !important;
  font-size: 15px !important; color: var(--dark-green) !important;
  font-family: 'Lora', serif !important;
  background: var(--pale-green) !important;
  width: 160px !important;
}
.spt-table--cennik .spt-col-egzamin {
  font-size: 14px !important; font-weight: 600 !important;
}
.spt-asterisk { color: var(--mid-green) !important; font-size: 11px !important; }

/* ── BADGE PB / CB ── */
.spt-badge {
  display: inline-block !important; border-radius: 50px !important;
  padding: 4px 12px !important; font-size: 12px !important; font-weight: 800 !important;
  font-family: 'Nunito', sans-serif !important; white-space: nowrap !important;
}
.spt-badge--pb {
  background: var(--pb-light) !important; color: var(--pb-green) !important;
  border: 1.5px solid #A5D6A7 !important;
}
.spt-badge--cb {
  background: var(--cb-light) !important; color: var(--cb-blue) !important;
  border: 1.5px solid #90CAF9 !important;
}

/* ── INFO LISTA ── */
.spt-info-list {
  list-style: none !important; margin: 0 !important;
  padding: .75rem 1.5rem !important; display: flex !important;
  gap: 1rem !important; flex-wrap: wrap !important;
  background: var(--very-pale) !important; border-top: 1px solid var(--pale-green) !important;
}
.spt-info-list li {
  font-size: 12px !important; color: var(--muted) !important;
  font-family: 'Nunito', sans-serif !important;
  padding-left: .75rem !important; position: relative !important;
}
.spt-info-list li::before {
  content: '•' !important; position: absolute !important;
  left: 0 !important; color: var(--light-green) !important;
}

/* ── PRZYCISKI OFERT ── */
.spt-oferty {
  padding: 1.25rem 1.5rem !important; display: flex !important;
  gap: 10px !important; flex-wrap: wrap !important;
  border-top: 1px solid var(--pale-green) !important;
}
.spt-oferta-btn {
  background: var(--very-pale) !important; color: var(--dark-green) !important;
  border: 1.5px solid var(--pale-green) !important; border-radius: 50px !important;
  padding: 8px 20px !important; font-size: 13px !important; font-weight: 700 !important;
  text-decoration: none !important; transition: all .2s !important;
  font-family: 'Nunito', sans-serif !important;
}
.spt-oferta-btn:hover {
  background: var(--pale-green) !important; border-color: var(--light-green) !important;
  color: var(--dark-green) !important;
}
.spt-empty {
  text-align: center !important; padding: 2rem !important;
  color: var(--muted) !important; font-size: 14px !important;
  font-family: 'Nunito', sans-serif !important;
}

/* ── RESPONSYWNOŚĆ ── */
@media (max-width: 768px) {
  .spt-header { flex-direction: column !important; align-items: flex-start !important; }
  .spt-filters { width: 100% !important; }
  .spt-info-list { flex-direction: column !important; gap: .4rem !important; }
}

/* ── ZAWSZE WIDOCZNE (wersja bez JS) ── */
.sjo-prep-oferta .spo-exam-body--visible {
  max-height: none !important;
  overflow: visible !important;
  padding: 1.5rem 1.75rem !important;
}

/* ── CENNIK — nagłówek kolumny cena wyśrodkowany ── */
.spt-table--cennik thead th:last-child {
  text-align: center !important;
  width: 160px !important;
}
.spt-table--cennik tbody tr:hover .spt-col-cena {
  background: #C8E6C9 !important;
}

/* ── HERO Z ZDJĘCIEM ── */
.sjo-prep-oferta .spo-hero-inner {
  display: flex !important; align-items: center !important; gap: 2rem !important;
}
.sjo-prep-oferta .spo-hero-text { flex: 1 !important; min-width: 0 !important; }
.sjo-prep-oferta .spo-hero-photo {
  flex-shrink: 0 !important; width: 42% !important; max-width: 380px !important;
  border-radius: 12px !important; overflow: hidden !important;
}
.sjo-prep-oferta .spo-hero-photo img {
  width: 100% !important; height: auto !important;
  max-width: 100% !important; max-height: 280px !important;
  object-fit: cover !important; display: block !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.2) !important;
}
.sjo-prep-oferta .spo-hero-logo {
  margin-top: 1.25rem !important;
  display: inline-block !important;
  background: white !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  width: auto !important;
}
.sjo-prep-oferta .spo-hero-logo img {
  height: 40px !important; width: auto !important; display: block !important;
  max-width: 160px !important;
}
@media (max-width: 768px) {
  .sjo-prep-oferta .spo-hero-inner { flex-direction: column !important; }
  .sjo-prep-oferta .spo-hero-photo { width: 100% !important; max-width: 100% !important; }
  .sjo-prep-oferta .spo-hero-photo img { max-height: 200px !important; }
}

/* ── SEKCJA CENNIKA — zwężona i wyśrodkowana ── */
.sjo-prep-tables .spt-section:last-child {
  max-width: 620px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}/* End custom CSS */