.towp-shortcode input, .towp-shortcode textarea {
    font-size: var(--text-pc-size);
}

.towp-shortcode input::placeholder, .towp-shortcode textarea::placeholder {
    color: var(--color-text);
}

.towp-shortcode input[type=text], .towp-shortcode input[type=tel], .towp-shortcode input[type=email] {
    background-color: var(--color-background);
    border: none;
    border-bottom: 1px solid var(--color-underline);
    color: var(--color-text);
    padding: 16px;
	width:100%;
    font-size: var(--text-pc-size);
}

.towp-shortcode textarea {
    background-color: var(--color-background);
    border: none;
    border-bottom: 1px solid var(--color-underline);
    color: var(--color-text);
    min-height: 150px;
    padding: 16px;
	width:100%;
}

.towp-shortcode input[type=submit] {
    background-color: var(--color-button);
    color: var(--color-text-button);
	border:none;
	 padding-top: 15px;
    padding-right: 48px;
    padding-bottom: 15px;
    padding-left: 48px;
	cursor:pointer;
}

.towp-shortcode input[type=submit]:hover {
    background-color: var(--color-button-hover);
}

.towp-shortcode form {
    display: flex;
    flex-wrap: wrap;
    gap: 20px; /* Přidá mezery mezi prvky */
}

.towp-form-shortocde-input {
    width: calc(50% - 10px);
}

.towp_message_field,
.towp-shotcode-btn-wrap {
    width: 100%;
    text-align: right;
}



/* Pro mobilní zařízení do 567px */
@media (max-width: 567px) {
    .towp-form-shortocde-input,
    .towp_message_field,
    .towp-form-shortocde-terms {
        width: 100%;
    }

    .towp-shortcode input, .towp-shortcode textarea {
        font-size: var(--text-mob-size);
    }

    .towp-shortcode input[type=text], .towp-shortcode input[type=tel], .towp-shortcode input[type=email], .towp-shortcode textarea {
        font-size: var(--text-mob-size);
    }
}

/* HISTORIE (timeline 2002/2006/2018/2022) na uvodni strance.
   Sekce ma v Divi nastavenou CSS tridu "ns-timeline".
   Mezi 981 a 1350 px jsou 4 sloupce uz moc uzke (jmeno i rok
   se lamou na treti radek), proto sekci prepneme do layoutu 2x2
   driv, nez to udela Divi (to prepina az na 980 px).
   Divi 5 radi sloupce pres CSS grid (radek ma tridu et_grid_row),
   proto se prepisuje grid-template-columns, ne flex.
   Pokud se texty lamou i pri jine sirce, staci upravit hodnotu
   max-width v media query nize. */
@media only screen and (min-width:981px) and (max-width:1350px) {
    .ns-timeline .et_pb_row.et_grid_row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        row-gap: 30px !important;
    }
}
