/* --- ZÁKLADNÍ STYLY --- */
.container {
    display: flex;
    gap: 30px;
    margin-top: 20px;
}
.main-content {
    flex: 3;
}
.sidebar {
    flex: 1;
    background-color: #2a2a2e;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #3a3a3c;
    align-self: flex-start; /* Zarovná sidebar nahoru */
}
.sidebar h2 {
    margin-top: 0;
    text-align: center;
}
.table-container { 
    overflow-x: auto; 
}
table { 
    width: 100%; 
    border-collapse: collapse; 
}
th, td { 
    padding: 12px 15px; 
    text-align: left; 
    border-bottom: 1px solid #3a3a3c; 
}
thead { 
    background-color: #333336; 
}

/* --- BAREVNÉ ODLIŠENÍ TEXTU --- */
.prijem { color: #2ecc71; font-weight: 700; }
.vydaj { color: #e74c3c; font-weight: 700; }
.prevod { color: #3498db; font-weight: 700; } /* Přidáno pro převody */
td.account-cell { 
    color: #a0a0a0; 
    font-size: 0.9em; 
}

/* --- FORMULÁŘ V SIDEBARU --- */
.recurring-form label { 
    display: block; 
    margin-bottom: 5px; 
    color: #a0a0a0; 
    font-size: 0.9em;
}
.recurring-form input, .recurring-form select {
    width: 100%; 
    padding: 10px; 
    margin-bottom: 15px;
    background-color: #3a3a3c; 
    color: #f5f5f5; 
    border: 1px solid #555; 
    border-radius: 4px; 
    box-sizing: border-box;
}
.recurring-form button {
    width: 100%; 
    padding: 12px; 
    background-color: #4a90e2; 
    color: #fff;
    border: none; 
    border-radius: 4px; 
    font-weight: bold; 
    cursor: pointer; 
    transition: background-color 0.3s;
}
.recurring-form button:hover { 
    background-color: #357ABD; 
}

/* --- TLAČÍTKA AKCÍ V TABULCE (UPRAVIT / SMAZAT) --- */
td.actions {
    display: flex;
    gap: 10px;
    align-items: center;
    white-space: nowrap; /* Zabrání zalamování tlačítek */
}
td.actions form {
    margin: 0; /* Odstraní výchozí mezeru formuláře */
}
.btn-edit, .btn-delete {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    transition: all 0.2s ease-in-out;
}
.btn-edit {
    background-color: #3498db;
    color: white;
    border: 1px solid #3498db;
}
.btn-edit:hover {
    background-color: #2980b9;
}
.btn-delete {
    background: none;
    border: 1px solid #c0392b;
    color: #c0392b;
}
.btn-delete:hover {
    background-color: #c0392b;
    color: #fff;
}

/* --- HORNÍ SOUHRNNÝ BOX --- */
.summary-box-recurring { 
    background-color: #2a2a2e; 
    padding: 20px; 
    border-radius: 8px; 
    border: 1px solid #3a3a3c; 
    margin-bottom: 30px; 
}
.summary-box-recurring h3 { 
    margin-top: 0; 
    text-align: center; 
    color: #f5f5f5; 
    border-bottom: 1px solid #3a3a3c; 
    padding-bottom: 10px; 
    margin-bottom: 10px; 
}
.summary-box-recurring .stat { 
    display: flex; 
    justify-content: space-between; 
    font-size: 1.1em; 
    padding: 8px 0; 
}
.summary-box-recurring .stat span { 
    color: #a0a0a0; 
}
.summary-box-recurring .stat strong { 
    font-weight: bold; 
}

/* --- STYLY PRO SAMOSTATNOU EDITAČNÍ STRÁNKU (edit_recurring.php) --- */
.container-edit {
    max-width: 600px;
    margin: 30px auto;
    padding: 30px;
    background: #2a2a2e;
    border-radius: 8px;
    border: 1px solid #3a3a3c;
}
.container-edit header h1 {
    text-align: center;
    margin-bottom: 30px;
}
.edit-form .form-actions {
    margin-top: 20px;
    display: flex;
    gap: 15px;
    align-items: center;
}
.edit-form .form-actions button {
    flex: 2; /* Tlačítko pro uložení bude větší */
}
.edit-form .btn-cancel {
    flex: 1; /* Tlačítko zrušit bude menší */
    display: inline-block;
    padding: 12px;
    background-color: #7f8c8d;
    color: white;
    text-align: center;
    text-decoration: none;
    border-radius: 4px;
    font-weight: bold;
    transition: background-color 0.2s;
}
.edit-form .btn-cancel:hover {
    background-color: #6c7a7b;
}


/* --- RESPONZIVNÍ DESIGN PRO MOBILNÍ ZAŘÍZENÍ --- */
@media (max-width: 900px) {
    .container {
        flex-direction: column; /* Zobrazí sidebar pod hlavním obsahem */
        gap: 20px;
    }
    .main-content, .sidebar {
        flex: 1 1 100%; /* Obě sekce zaberou plnou šířku */
    }
}

@media (max-width: 600px) {
    th, td {
        padding: 10px 8px;
    }
    td.actions {
        flex-direction: column; /* Tlačítka pod sebou pro lepší klikání */
        align-items: stretch; /* Tlačítka budou stejně široká */
    }
    td.actions a, td.actions button {
        width: 100%;
        box-sizing: border-box;
    }
    h1 {
        font-size: 1.8em;
    }
    .container-edit {
        padding: 20px;
        margin: 20px 10px;
    }
}