/* Záměrně střídmé — plugin běží na cizích šablonách a nemá jim do vzhledu mluvit.
   Barvy se berou z currentColor, ať sedí do světlého i tmavého tématu. */

.s60-odstoupeni {
    max-width: 44rem;
    margin: 0 auto;
}

.s60-odstoupeni-pole {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    margin-bottom: 1.25rem;
}

.s60-odstoupeni-pole label {
    font-weight: 600;
}

.s60-odstoupeni-pole input,
.s60-odstoupeni-pole textarea {
    width: 100%;
    padding: .6rem .7rem;
    font: inherit;
    border: 1px solid currentColor;
    border-radius: 4px;
    background: transparent;
    color: inherit;
}

.s60-odstoupeni-pole small {
    opacity: .75;
}

/* Návnada na roboty. Ne display:none — část botů takové pole přeskakuje.
   Takhle je mimo obrazovku, ale pro robota vypadá jako běžné pole. */
.s60-odstoupeni-navnada {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.s60-odstoupeni-btn {
    padding: .7rem 1.4rem;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid currentColor;
    border-radius: 4px;
    background: transparent;
    color: inherit;
}

.s60-odstoupeni-btn:hover {
    opacity: .85;
}

.s60-odstoupeni-rekap {
    width: 100%;
    border-collapse: collapse;
    margin: 1rem 0 1.5rem;
}

.s60-odstoupeni-rekap th,
.s60-odstoupeni-rekap td {
    padding: .5rem .6rem;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid rgba(128, 128, 128, .35);
}

.s60-odstoupeni-rekap th {
    width: 32%;
    font-weight: 600;
}

.s60-odstoupeni-chyba,
.s60-odstoupeni-varovani {
    padding: .8rem 1rem;
    margin: 0 0 1.25rem;
    border-left: 4px solid #b32d2e;
    background: rgba(179, 45, 46, .08);
}

@media (max-width: 40rem) {
    .s60-odstoupeni-rekap th,
    .s60-odstoupeni-rekap td {
        display: block;
        width: auto;
        border-bottom: 0;
    }
    .s60-odstoupeni-rekap td {
        border-bottom: 1px solid rgba(128, 128, 128, .35);
        padding-top: 0;
    }
}