/* 
============================================
FRÝDLANTSKÁ PADESÁTKA - RESPONZIVNÍ CSS
============================================
Created :: 2026-01-22
Updated :: 2026-01-22

Breakpoints:
- Mobile: < 576px
- Tablet: 576px - 768px
- Small Desktop: 768px - 992px
- Desktop: 992px - 1200px
- Large Desktop: > 1200px
============================================
*/

/* ==========================================
   BREAKPOINT: MAX 1200px (Menší desktop)
   ========================================== */

@media (max-width: 1200px) {
    /* Container Trasy */
    #container_trasy {
        padding: 90px 20px 120px 20px;
    }
    
    #container_trasy .boxies {
        gap: 25px;
    }
    
    /* Container Pochod Info */
    #container_pochod_info {
        padding: 100px 40px 90px 40px;
        gap: 25px;
    }
    
    #container_pochod_info > .box {
        max-width: calc(25% - 20px);
    }
}

/* ==========================================
   BREAKPOINT: MAX 992px (Tablet landscape)
   ========================================== */

@media (max-width: 992px) {
    /* Header */
    #container_header {
        padding: 60px 20px 80px 20px;
    }
    
    #container_header li:nth-child(3) {
        font-size: 3.5rem;
    }
    
    #container_header li:nth-child(3) span {
        font-size: 3.5rem;
    }
    
    #container_header.sub li:nth-child(3),
    #container_header.sub h1 {
        font-size: 2.5rem;
    }
    
    /* Container Trasy - 2 sloupce */
    #container_trasy .boxies {
        grid-template-columns: repeat(2, 1fr);
    }
    
    #container_trasy .buttons {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* Třetí box na celou šířku */
    #container_trasy .boxies .box:nth-child(3) {
        grid-column: 1 / -1;
        max-width: 400px;
        justify-self: center;
    }
    
    #container_trasy .buttons .box:nth-child(3) {
        grid-column: 1 / -1;
    }
    
    /* Container Pochod Info - 2 sloupce */
    #container_pochod_info {
        padding: 90px 30px 80px 30px;
        justify-content: center;
    }
    
    #container_pochod_info > .box {
        flex: 1 1 calc(50% - 20px);
        max-width: calc(50% - 20px);
        min-width: 250px;
    }
    
    /* Partneři */
    .partneri-logos img {
        max-width: 120px;
        max-height: 60px;
    }
}

/* ==========================================
   BREAKPOINT: MAX 960px (Menu breakpoint)
   ========================================== */

@media (max-width: 960px) {
    /* Skrýt desktop menu, zobrazit burger */
    #menu {
        display: none;
    }
    
    .nav_toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}

@media (min-width: 961px) {
    .nav_toggle {
        display: none;
    }
    
    #menu {
        display: block;
    }
}

/* ==========================================
   BREAKPOINT: MAX 768px (Tablet portrait)
   ========================================== */

@media (max-width: 768px) {
    /* Header */
    #header_zahlavi {
        clip-path: polygon(0 0, 100% 0, 100% calc(100% - 40px), 0 100%);
        padding-bottom: 40px;
    }
    
    #header_zahlavi.podstranka {
        clip-path: polygon(0 0, 100% 0, 100% calc(100% - 30px), 0 100%);
        padding-bottom: 30px;
    }
    
    #zahlavi .logo img {
        max-width: 100px;
    }
    
    #container_header {
        padding: 50px 15px 70px 15px;
    }
    
    #container_header li:first-child {
        font-size: 1.5rem;
    }
    
    #container_header li:nth-child(2) {
        margin-bottom: 30px;
        font-size: 0.875rem;
    }
    
    #container_header li:nth-child(3) {
        font-size: 2.5rem;
    }
    
    #container_header li:nth-child(3) span {
        font-size: 2.5rem;
    }
    
    #container_header li:nth-child(4) {
        font-size: 1rem;
    }
    
    #container_header.sub {
        padding: 30px 15px 50px 15px;
    }
    
    #container_header.sub li:nth-child(3),
    #container_header.sub h1 {
        font-size: 2rem;
    }
    
    #container_header.sub li:nth-child(4) {
        font-size: 1rem;
    }
    
    /* Prvky */
    .prvky {
        margin: 50px auto;
        padding: 0 20px;
    }
    
    .prvek_hp_uvod .tinymce p {
        font-size: 1rem;
    }
    
    /* Container Pochod Info */
    #container_pochod_info {
        padding: 70px 25px 80px 25px;
        clip-path: polygon(0 30px, 100% 0, 100% calc(100% - 30px), 0 100%);
        flex-direction: column;
        align-items: center;
        gap: 35px;
    }
    
    #container_pochod_info > .box {
        flex: 1 1 100%;
        max-width: 500px;
        min-width: auto;
        width: 100%;
        text-align: center;
    }
    
    #container_pochod_info h3 {
        display: block;
    }
    
    #container_pochod_info h3::after {
        left: 50%;
        transform: translateX(-50%);
    }
    
    #container_pochod_info p {
        display: block;
    }
    
    /* Container Trasy */
    #container_trasy {
        padding: 70px 20px 100px 20px;
        clip-path: polygon(0 30px, 100% 0, 100% calc(100% - 30px), 0 100%);
    }
    
    #container_trasy h3 {
        font-size: 2rem;
        margin-bottom: 40px;
    }
    
    #container_trasy .boxies {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    #container_trasy .boxies .box:nth-child(3) {
        max-width: 100%;
    }
    
    #container_trasy .box h4 {
        font-size: 1.75rem;
    }
    
    /* Zobrazit mobilní tlačítka, skrýt desktopové */
    #container_trasy .button_respo {
        display: block;
    }
    
    #container_trasy .buttons {
        display: none;
    }
    
    /* Articles */
    .article_hp,
    .article_hp_2 {
        margin: 50px auto;
    }
    
    .article_hp_2 h2 {
        font-size: 1.75rem;
    }
    
    .article_hp .hlavnistrana,
    .article_hp_2 .hlavnistrana {
        padding: 20px;
    }
    
    /* News */
    .next_articles {
        padding: 0 20px;
    }
    
    .vypis_box.news h2 {
        font-size: 1.25rem;
    }
    
    /* Content obsah */
    #content_obsah {
        padding: 40px 20px 60px 20px;
    }
    
    #content_obsah.struktura,
    #content_obsah.udalosti {
        margin: 40px auto 60px auto;
    }
    
    /* Formulář */
    .udalost_registrace_form {
        padding: 40px 25px;
        margin-top: 40px;
    }
    
    .udalost_registrace_form h2 {
        font-size: 1.5rem;
    }
    
    /* Patička */
    #paticka {
        padding: 90px 20px 60px 20px;
        clip-path: polygon(0 30px, 100% 0, 100% 100%, 0 100%);
        gap: 30px 40px;
    }
    
    #paticka .column {
        flex: 1 1 100%;
        max-width: 100%;
        text-align: center;
    }
    
    #paticka h4::after {
        left: 50%;
        transform: translateX(-50%);
    }
    
    .social-icons {
        justify-content: center;
    }
    
    /* Copyright */
    #copyright {
        padding: 25px 20px 35px 20px;
    }
    
    #copyright span {
        display: block;
    }
    
    #copyright span:not(:first-child)::before {
        display: none;
    }
    
    /* Partneři */
    .partneri-logos {
        gap: 20px 30px;
    }
    
    .partneri-logos img {
        max-width: 100px;
        max-height: 50px;
    }
}

/* ==========================================
   BREAKPOINT: MAX 576px (Mobile)
   ========================================== */

@media (max-width: 576px) {
    /* Header */
    #header_zahlavi {
        clip-path: polygon(0 0, 100% 0, 100% calc(100% - 30px), 0 100%);
        padding-bottom: 30px;
    }
    
    #zahlavi .in {
        padding-top: 15px;
        padding-bottom: 15px;
    }
    
    #zahlavi .logo img {
        max-width: 80px;
    }
    
    #container_header {
        padding: 40px 15px 60px 15px;
    }
    
    #container_header li:first-child {
        font-size: 1.25rem;
    }
    
    #container_header li:nth-child(2) {
        margin-bottom: 25px;
        font-size: 0.75rem;
    }
    
    #container_header li:nth-child(3) {
        font-size: 1.75rem;
    }
    
    #container_header li:nth-child(3) span {
        font-size: 1.75rem;
    }
    
    #container_header li:nth-child(4) {
        font-size: 0.875rem;
    }
    
    #container_header.sub li:nth-child(3),
    #container_header.sub h1 {
        font-size: 1.5rem;
    }
    
    /* Drawer menu */
    .nav_drawer_inner {
        width: 100%;
        padding: 70px 20px 30px 20px;
    }
    
    .menu_all li a {
        padding: 15px 10px;
        font-size: 1rem;
    }
    
    /* Container Pochod Info */
    #container_pochod_info {
        padding: 50px 15px 60px 15px;
        gap: 25px;
    }
    
    #container_pochod_info h3 {
        font-size: 1.125rem;
    }
    
    #container_pochod_info p {
        font-size: 0.9375rem;
    }
    
    /* Container Trasy */
    #container_trasy {
        padding: 50px 15px 80px 15px;
    }
    
    #container_trasy h3 {
        font-size: 1.5rem;
        margin-bottom: 30px;
    }
    
    #container_trasy .box {
        padding: 25px 20px;
    }
    
    #container_trasy .box h4 {
        font-size: 1.5rem;
    }
    
    #container_trasy .button_respo a {
        padding: 10px 25px;
        font-size: 0.9375rem;
    }
    
    /* Articles */
    .article_hp,
    .article_hp_2 {
        margin: 40px auto;
        padding: 0 15px;
    }
    
    .article_hp_2 h2 {
        font-size: 1.5rem;
    }
    
    .article_hp .hlavnistrana,
    .article_hp_2 .hlavnistrana {
        padding: 15px;
        border-left-width: 4px;
    }
    
    .article_hp .tinymce p,
    .article_hp_2 .tinymce p {
        font-size: 1rem;
    }
    
    .article_hp_2 .button a {
        padding: 14px 30px;
        font-size: 1rem;
    }
    
    /* Content */
    #content_obsah {
        padding: 30px 15px 50px 15px;
    }
    
    /* Události */
    .udalosti_vypis .udalost {
        padding: 20px;
        gap: 10px 20px;
    }
    
    .udalosti_vypis .udalost strong {
        flex: 0 0 auto;
        font-size: 0.875rem;
    }
    
    .udalosti_vypis .udalost a {
        flex: 1 1 100%;
        font-size: 1rem;
    }
    
    /* Formulář */
    .udalost_registrace_form {
        padding: 30px 15px;
        border-radius: 8px;
    }
    
    .udalost_registrace_form h2 {
        font-size: 1.25rem;
        margin-bottom: 30px;
    }
    
    .form_line {
        margin-bottom: 20px;
    }
    
    .form_line input,
    .form_line select,
    .form_line textarea {
        padding: 12px 14px;
    }
    
    .btn_primary,
    .udalost_registrace_form button[type="submit"] {
        padding: 15px 30px;
        font-size: 1rem;
    }
    
    /* Událost info tabulka */
    .udalost_info_table th,
    .udalost_info_table td {
        padding: 12px 10px;
        font-size: 0.875rem;
    }
    
    .udalost_info_table th {
        width: 45%;
    }
    
    /* Success stránka */
    .success_message {
        padding: 30px 20px;
    }
    
    .success_message p {
        font-size: 1rem;
    }
    
    .registrace_summary h2 {
        font-size: 1.25rem;
    }
    
    .registrace_summary th,
    .registrace_summary td {
        padding: 10px;
        font-size: 0.875rem;
    }
    
    .qr_platba {
        padding: 20px;
    }
    
    .qr_platba img {
        max-width: 180px;
    }
    
    /* Tinymce */
    .tinymce h2 {
        font-size: 1.25rem;
    }
    
    .tinymce h3 {
        font-size: 1.125rem;
    }
    
    /* News */
    .vypis_box.news {
        padding: 20px 0;
    }
    
    .vypis_box.news h2 {
        font-size: 1.125rem;
    }
    
    /* Patička */
    #paticka {
        padding: 70px 15px 50px 15px;
        gap: 25px;
    }
    
    #paticka h4 {
        font-size: 1.125rem;
        margin-bottom: 15px;
    }
    
    #paticka ul li {
        margin-bottom: 10px;
        font-size: 0.9375rem;
    }
    
    .social-icon {
        width: 40px;
        height: 40px;
    }
    
    .social-icon i {
        font-size: 18px;
    }
    
    .column_logo .logo img {
        max-width: 100px;
    }
    
    /* Copyright */
    #copyright span,
    #copyright a {
        font-size: 0.75rem;
    }
    
    /* Partneři */
    .partneri-logos {
        gap: 15px 20px;
        padding: 0 15px;
    }
    
    .partneri-logos img {
        max-width: 80px;
        max-height: 40px;
    }
    
    /* Kontakty */
    ul.kontakty li {
        font-size: 1rem;
    }
}

/* ==========================================
   BREAKPOINT: MAX 400px (Small mobile)
   ========================================== */

@media (max-width: 400px) {
    #container_header li:nth-child(3) {
        font-size: 1.5rem;
    }
    
    #container_header li:nth-child(3) span {
        font-size: 1.5rem;
    }
    
    #container_header.sub li:nth-child(3),
    #container_header.sub h1 {
        font-size: 1.25rem;
    }
    
    #container_trasy h3 {
        font-size: 1.25rem;
    }
    
    #container_trasy .box h4 {
        font-size: 1.25rem;
    }
    
    .article_hp_2 h2 {
        font-size: 1.25rem;
    }
}

/* ==========================================
   PRINT STYLES
   ========================================== */

@media print {
    /* Skrýt nepotřebné prvky */
    #header_zahlavi,
    #menu,
    .nav_toggle,
    .nav_drawer,
    footer,
    .admin_box,
    .button,
    .button_desktop,
    .button_respo {
        display: none !important;
    }
    
    /* Reset clip-path */
    #container_pochod_info,
    #container_trasy,
    #paticka {
        clip-path: none;
    }
    
    /* Základní tisk */
    body {
        font-size: 12pt;
        line-height: 1.5;
        color: #000;
        background: #fff;
    }
    
    #content_obsah {
        max-width: 100%;
        padding: 0;
    }
    
    a {
        color: #000;
        text-decoration: underline;
    }
    
    /* Page breaks */
    h1, h2, h3 {
        page-break-after: avoid;
    }
    
    table, img {
        page-break-inside: avoid;
    }
}

/* ==========================================
   LANDSCAPE ORIENTATION
   ========================================== */

@media (max-width: 768px) and (orientation: landscape) {
    #container_header {
        padding: 30px 20px 50px 20px;
    }
    
    #container_header li:nth-child(2) {
        margin-bottom: 20px;
    }
    
    #container_header li:nth-child(3) {
        font-size: 2rem;
    }
    
    #container_header li:nth-child(3) span {
        font-size: 2rem;
    }
    
    #container_pochod_info {
        flex-direction: row;
        flex-wrap: wrap;
    }
    
    #container_pochod_info > .box {
        flex: 1 1 calc(50% - 15px);
        max-width: calc(50% - 15px);
        text-align: left;
    }
    
    #container_pochod_info h3::after {
        left: 0;
        transform: none;
    }
}

/* ==========================================
   HIGH CONTRAST / ACCESSIBILITY
   ========================================== */

@media (prefers-contrast: high) {
    :root {
        --color-primary: #4caf50;
        --color-primary-dark: #388e3c;
    }
    
    #container_trasy .boxies .box {
        border-width: 2px;
    }
    
    .form_line input,
    .form_line select,
    .form_line textarea {
        border-width: 2px;
    }
}

/* ==========================================
   REDUCED MOTION
   ========================================== */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    
    html {
        scroll-behavior: auto;
    }
}

/* ==========================================
   STARTOVNÍ LISTINA - UPRAVY
   ========================================== */

@media (max-width: 576px) {

  table.startlistina { border-radius: 0; overflow: visible; }
  table.startlistina thead { display: none; }

  table.startlistina, table.startlistina tbody, table.startlistina tr, table.startlistina td { display: block; width: 100%; }

  table.startlistina tbody { margin: 0; }
  table.startlistina tr { margin: 0 0 14px 0; padding: 12px 12px; border-radius: 10px; border: 1px solid rgba(0,0,0,0.10); background: rgba(255,255,255,0.95); }
  table.startlistina td { padding: 10px 0; border: 0; display: flex; justify-content: space-between; align-items: center; gap: 15px; }
  table.startlistina td + td { border-top: 1px dashed rgba(0,0,0,0.10); }

  table.startlistina td::before { content: attr(data-label); font-weight: 700; opacity: 0.75; flex: 0 0 auto; }
  table.startlistina td { text-align: right; }
  table.startlistina td::before { text-align: left; }

  table.startlistina td:first-child { padding-top: 0; }
  table.startlistina td:last-child { padding-bottom: 0; }

  table.startlistina td[data-label="#"] { justify-content: flex-start; }
  table.startlistina td[data-label="#"]::before { display: none; }
  table.startlistina td[data-label="#"] { font-weight: 700; opacity: 0.8; }

  table.startlistina td[data-label="Stav"] { align-items: flex-start; }
  table.startlistina td[data-label="Stav"] span.badge { margin-left: auto; }

}