/*
 * Formularze: kontakt, komunikaty błędów/sukcesu, gwiazdki ocen
 */

/* ==============================================
   FORMULARZ KONTAKTOWY
   ============================================== */

.content .kontakt input[type='text'] {
    width: 100%;
    border: none;
    background: var(--color-grey);
    padding: 7px 10px;
    margin-bottom: 10px;
}

.content .kontakt input[type='text']::placeholder {
    font-style: italic;
}

.content .kontakt textarea {
    width: 100%;
    border: none;
    background: var(--color-grey);
    padding: 5px 10px;
    height: 160px;
}

.content .kontakt textarea::placeholder {
    font-style: italic;
}

.content .kontakt .submit-form input[type='submit'] {
    background: url('../../images/submit-form.jpg') no-repeat;
    width: 34px;
    height: 34px;
    border: none;
}

/* ==============================================
   IKONY KONTAKTOWE
   ============================================== */

.content .kontakt .adres-icon,
.content .kontakt .mail-icon,
.content .kontakt .tel-icon {
    font-family: var(--font-bold);
    background-position: left center;
    background-repeat: no-repeat;
    padding: 0 0 0 60px;
    margin-bottom: 20px;
}

.content .kontakt .adres-icon {
    background-image: url('../../images/home-icon.jpg');
}

.content .kontakt .mail-icon {
    background-image: url('../../images/mail-icon.jpg');
}

.content .kontakt .tel-icon {
    background-image: url('../../images/tel-icon.jpg');
}

/* Przycisk wyślij */
.content .kontakt input.kontakt-button {
    background: var(--color-orange);
    color: var(--color-white);
    font-family: var(--font-bold);
    padding: 8px 25px 8px 23px;
    border: none;
}

/* ==============================================
   KOMUNIKATY BŁĘDÓW / SUKCESU
   ============================================== */

.content .error,
.content .ok {
    padding: 6px 15px;
    font-size: 15px;
    font-family: var(--font-thin);
    margin: 0 0 25px 0;
}

.content .error {
    background: #ff0500;
}

.content .ok {
    background: #00cc22;
}

.content .error p,
.content .ok p {
    color: var(--color-white);
    margin: 0;
}

/* ==============================================
   GWIAZDKI OCEN
   ============================================== */

.article-star-rating {
    color: #fde16d;
    -webkit-text-stroke: 1px #777;
    text-shadow: 1px 1px #999;
}