

/********** FORMULARZE ********************************************************/

/* teksty informacyjne */
.form-loader span { padding-left: 20px; background: url(loader.gif) left center no-repeat; } /* tekst pojawiający się w czasie wysyłania formularza */
.form-failure { color: red; } /* tekst gdy wysłanie formularza nie powiodło się */
.form-success { color: green; } /* tekst gdy wysłanie formularza powiodło się */

/* tu ustawiamy szerokości elementów */
form { width: 500px; margin: 0 auto; padding: 0; } /* szerokość i wycentrowanie formularza */
form label.title { width: 180px; } /* szerokość tytułu inputa */
form input.textinput { width: 180px; } /* szerokość inputa typu text, number, email, date */
form textarea { width: 180px; height:100px;} /* szerokość textarea */
form select { width: 145px; } /* szerokość select */
/* specjalne ustawienia dla typu daterange: */
form .daterange-wrap .startdate { width: 90px; } /* div zawierający wszystko dla pierwszej daty */
form .daterange-wrap .enddate {  width: 90px; } /* div zawierający wszystko dla drugiej daty */
form .daterange-wrap div label.title {  width: 30px; }
form .daterange-wrap div input.date { width: 70px; }

form fieldset { border: none; padding: 0; margin: 0; } /* pola pogrupowane są w elementy fieldset */
form fieldset.with-legend {
	border: 1px solid #096;
	padding: 20px;
	margin-bottom: 10px;
} /* fieldset zawiereający element legend (tytuł fieldseta) */
form fieldset.with-legend legend { font-size: 11px; color: #666; } /* tytuł fieldseta */

form .fieldwrap { margin-bottom: 5px; clear: both; overflow: hidden; } /* to jest div "owijający" input, jego tytuł i informację o nim */
/* dla każdego typu pola mamy też specjalne klasy dla powyższego div'a: */
form .text-wrap {}
form .textarea-wrap {}
form .email-wrap {}
form .date-wrap {}
form .daterange-wrap {}
form .number-wrap {}
form .checkbox-wrap {}
form .select-wrap {}
form .file-wrap {}

form label.title { display: block; float: left; border-bottom: 1px dashed #aaa; color: #555; } /* tytuł inputa */
form .focus label.title { border-bottom: 1px dashed #666; color: #000; } /* tytuł aktywnego inputa */

form label.message { font-size: 11px; } /* informacja o stanie inputa (czy wymagane, czy dobry format, etc.) */
form label.info { color: #aaa; } /* informacja o stanie inputa (ten sam element co wyżej) w stanie informacyjnym */
form label.error { color: red; } /* informacja o stanie inputa (ten sam element co wyżej) w stanie błędu (kolor czcionki powinien być taki sam jak wartość 'error_color' w pliku konfiguracyjnym formularza (sample_form.php)) */

/* inputy i typy pól */
form input.textinput { background: #f6f6f6; border: 1px solid #aaa; } /* input typu text (ta klasa objemuje pola typu: text, date, number, email) */
form .focus input.textinput { background: #ddd; border: 1px solid #666; }
form input.text {}
form input.date {}
form input.number {}
form input.email {}
form input.checkbox {}
form input.file {}
form textarea { background: #f6f6f6; border: 1px solid #aaa; }
form .focus textarea { background: #ddd; border: 1px solid #666; }
form select { background: #f6f6f6; border: 1px solid #aaa; }
form .focus select { background: #ddd; border: 1px solid #666; }

/* specjalne ustawienia dla typu daterange: */
form .daterange-wrap label.title { }
form .daterange-wrap .startdate { float: left; } /* div zawierający wszystko dla pierwszej daty */
form .daterange-wrap .enddate { float: left; } /* div zawierający wszystko dla drugiej daty */
form .daterange-wrap div label.title { border: none; text-align: right; padding-right: 5px; }
form .daterange-wrap div input.date {}
form .daterange-wrap div label.message { display: block; text-align: right; padding-right: 30px; }

/* specjalne pola zgrupowane (radios, checkboxes) */
form fieldset.group { border: none; padding: 0; margin-bottom: 5px; padding-top: 5px; }
form fieldset.group legend { font-size: 11px; color: #555; border-bottom: 1px dashed #aaa; }
form fieldset.group .fieldwrap { margin-left: 250px; }
form fieldset.group label.message { padding-left: 400px; }

/* przyciski */
form .buttons { padding: 10px 15px; overflow: hidden; }
form .buttons button { border: 1px solid #000; background: #ddd; padding: 4px 6px; }
form .buttons .submit { color: #000; font-weight: bold; }
form .buttons .reset { color: #999; float: right; }

#ui-datepicker-div {font-family: Verdana, Geneva, "DejaVu Sans", "Bitstream Vera Sans", "Liberation Sans", sans-serif; font-size:11px; } /* div zawierający kalendarzyk */