/*------------------------------------------------------------------

[Dashboard Stylesheet]

	Project:		Adminia Admin
	Version:		1.0
	Last change:	05/11/2012
	Assigned to:	Rod Howard (rh)



[Table of contents]

	1. Max Width: 979px
	2. Max Width: 767px

-------------------------------------------------------------------*/

/* CSS Custom Properties for Responsive Design */
:root {
  /* Kolory */
  --color-text-nav: #383838;
  --color-bg-light-gray: #ebebeb;
  --color-bg-gradient-start: #d5f1ff;
  --color-bg-gradient-end: #b8e5ff;
  --color-bg-success: #dff0d8;
  --color-primary-dark: #4A515B;

  /* Wysokości navbar */
  --navbar-height-desktop: 110px;
  --navbar-height-mobile: 100px;
  --navbar-height-small: 115px;

  /* Content padding */
  --content-padding-desktop: 110px;
  --content-padding-mobile: 115px;
  --content-padding-reset: 0px;

  /* Szerokości tabela_wybor */
  --tabela-wybor-width-tablet: 85%;
  --tabela-wybor-width-mobile: 95%;

  /* Szerokości span6 */
  --span6-width-standard: 48%;
  --span6-width-narrow: 46%;
  --span6-margin-right: 4%;

  /* Modal widths */
  --modal-width-tablet: 560px;
  --modal-width-mobile: 95%;

  /* Font sizes */
  --font-size-h-mobile: 14px;
  --font-size-h1-mobile: 20px;
  --font-size-title-mobile: 18px;
  --font-size-small-mobile: 12px;
  --font-size-button-mobile: 20px;

  /* Spacing */
  --padding-small: 5px;
  --padding-medium: 10px;
  --padding-reset: 0px;
}

/*------------------------------------------------------------------
[1. Max Width: 979px]
*/

/* małe rozdzielczosci desktop */
@media (max-width: 1200px) and (min-width: 980px) {
	.container {
	    width: 100%;
	}

	#TRESC {
		margin: 0px;
		width: 75%;
	}

	#left-panel {
		margin: 0px;
		width: 25%;
	}

	.container > .row {
		margin: 0 auto;
	}

	h1, h2, h3 {
	    line-height: 20px;
	}


	#tabela_wybor .row-fluid:first-child {
		width: 80%;
		margin: 0 auto;
	}
}


/* tablety i małe rozdzielczosci desktop */
@media (max-width: 979px) and (min-width: 768px) {
	.visible-desktop {
	    display: block !important;
	}

	.hidden-desktop {
		display: none !important;
	}

	#TRESC {
		margin: 0px;
		width: 100%;
		margin-top: 10px;
	}

	.container > .row {
		margin: 0 auto;
	}

	.container {
		width: 100%;
	}

	#tabela_wybor {
		width: var(--tabela-wybor-width-tablet) !important;
		margin: 0 auto !important;
		padding: var(--padding-small);
	}

	#tabela_wybor .span6 {
		width: var(--span6-width-standard) !important;
		float: left !important;
		margin-left: 0 !important;
		margin-right: var(--span6-margin-right) !important;
		display: block !important;
	}

	#tabela_wybor .span6:last-child,
	#tabela_wybor .span6:nth-child(2) {
		margin-right: 0 !important;
	}

	#tabela_wybor .span6 {
		margin-bottom: 0px;
	}

	#tabela_wybor .test-option-section {
		display: flex !important;
		flex-direction: column !important;
		height: auto;
		min-height: 80px;
		padding: var(--padding-medium);
		width: 100%;
		box-sizing: border-box;
	}

	#tabela_wybor label {
		max-width: 250px !important;
	}

	#tabela_wybor .btn {
		width: 75% !important;
	}


	#tabela_wybor .row-fluid:first-child {
		width: 70%;
		margin: 0 auto;
	}


	#modal_register_form, #modal_kup_pakiet_punktow {
		width: var(--modal-width-tablet) !important;
	}

	.arkusz_menu_button {
		padding: 8px !important;
		font-size:110% !important;
	}


	#tabs-testy .kwalifikacja_rok_menu_button {
		line-height: 32px !important;
	}

	body .navbar .navbar-inner {
		min-height: var(--navbar-height-desktop);
	}

	body.nofixed .navbar .navbar-inner {
		min-height: var(--navbar-height-desktop);
	}

	body.nofixed #content {
    	padding-top: var(--content-padding-reset);
	}

	body #content {
    	padding-top: var(--content-padding-desktop);
	}

	.search_box {
		max-width: 100%;
	}

	/* Bootstrap Grid clearfix dla formularza testu */
	#tabela_wybor .row-fluid {
		display: block !important;
	}

	#tabela_wybor .row-fluid:after {
		content: "";
		display: table;
		clear: both;
	}

	/* Ukrycie lewego panelu na tabletach - rozwiązuje problem z layoutem */
	#left-panel {
		display: none !important;
	}

	/* Menu mobilne na tabletach - kopiowane z mobile CSS */
	#menu-header {
		display: block;
	}

	#menu-header.nav-collapse.in.collapse {
		margin-top: var(--navbar-height-mobile);
	}

	body.nofixed #menu-header.nav-collapse.in.collapse {
		margin-top: -20px;
	}

	#menu-header ul {
		margin-top: 20px;
	}

	body.nofixed #menu-header {
		margin-top: 0px;
	}

	.nav-collapse .nav>li>a, .nav-collapse .dropdown-menu a {
		color: var(--color-text-nav);
	}

	/* Przycisk hamburger widoczny na tabletach */
	.btn-navbar {
		display: block !important;
	}

	/* Nav collapse ukryty domyślnie na tabletach */
	.nav-collapse {
		display: none;
	}

	.nav-collapse.in {
		display: block !important;
	}
}



/*------------------------------------------------------------------
[2. Max Width: 767px - telefony i tablety]
*/

@media (max-width: 767px) {


	#content {
		padding-top: var(--content-padding-mobile);
	}

	body {
	 	 padding-right: 5px;
     	 padding-left: 5px;
    }

	p, div, span {
		line-height: 125%;
	}

	h1, h2, h3 {
	    line-height: 20px;
	}

	.navbar {
		box-shadow: none;
	}

	.navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top {
		right: 10px;
    	left: 10px;
	}

	body.nofixed .navbar {
		margin-bottom: 3px;
	}

	.widget-content {
	    padding: var(--padding-small);
	    min-height: 300px;
	}
	/*
	.sidebar-extra {
		display: none;
	}
	*/

	h1 {
		margin-bottom: .25em;
		font-size: var(--font-size-h1-mobile);
	}

	h2 {
		margin-bottom: .5em;
		font-size: var(--font-size-h-mobile);
		color: var(--color-primary-dark);
	}

	h1#test-naglowek {
		font-size: var(--font-size-h-mobile);
		color: var(--color-primary-dark);
	}

	h3 {
		margin-bottom: .5em;
		font-size: var(--font-size-h-mobile);
	}

	div#TRESC h1 {
		margin-top: 1px;
		margin-bottom: 2px;
	}

	div#TRESC h2 {
		margin-top: 1px;
		margin-bottom: 3px;
	}

	#tabela_wybor {
		width: var(--tabela-wybor-width-mobile) !important;
		margin: var(--padding-medium) auto !important;
		text-align: center !important;
		padding: var(--padding-small);
	}

	#tabela_wybor .row-fluid {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}

	#tabela_wybor .span6 {
		width: var(--span6-width-standard) !important;
		margin-bottom: var(--padding-reset);
		flex: 0 0 var(--span6-width-standard);
		margin-left: 0 !important;
		margin-right: var(--span6-margin-right) !important;
	}

	#tabela_wybor .span6:last-child,
	#tabela_wybor .span6:nth-child(2) {
		margin-right: 0 !important;
	}

	#tabela_wybor .test-option-section {
		height: auto;
		padding: var(--padding-medium);
		margin-bottom: 8px;
		background-color: var(--color-bg-light-gray) !important;
		text-align: center;
		border: 2px solid var(--color-bg-light-gray);
		border-radius: 4px;
		box-sizing: border-box;
	}

	#tabela_wybor .test-option-title {
		font-size: var(--font-size-title-mobile);
		margin-bottom: 6px;
	}

	#potwierdzenie_testu select {
		font-size: 30px;
		height: 60px;
		max-width: 170px;
	}

	#tabela_wybor label {
		font-size: var(--font-size-h-mobile);
		text-align: center;
		max-width: 70%;
		margin: 0 auto;
	}

	#tabela_wybor .test-buttons-section {
		text-align: center;
	}

	/* Zbliżenie checkboxów do siebie */
	#tabela_wybor .test-buttons-section label.checkbox {
		margin-bottom: 3px;
		display: inline-block;
		margin-right: 15px;
		vertical-align: middle;
	}

	#tabela_wybor .test-buttons-section label.checkbox input[type="checkbox"] {
		vertical-align: middle;
		margin-right: 3px;
	}

	#tabela_wybor .test-buttons-section br {
		display: none;
	}

	/* Pozwól na łamanie linii w przyciskach wieloliniowych */
	#tabela_wybor .test-buttons-section .btn-multiline .btn-line-break {
		display: block !important;
	}

	#tabela_wybor .test-buttons-section .btn-multiline {
		white-space: normal !important;
		line-height: 1.1;
	}

	/* Zapewnienie clearfix dla row-fluid */
	#tabela_wybor .row-fluid:after {
		content: "";
		display: table;
		clear: both;
	}

	#tabela_premium {
		width: 100%;
	}

	#tabela_zakup_punktow {
		width: 100%;
		text-align: center;
	}

	#tabela_zakup_punktow label {
		max-width: 100%;
	}


	#question_buttons .btn {
		width:100%;
		margin: 5px 0px;
	}

	.imagemodal {

	}

	#sidebar_mobile {
		max-width: 180px;
		background: linear-gradient(to bottom, var(--color-bg-gradient-start) 0%, var(--color-bg-gradient-end) 100%) !important;
		font-weight: bold;
		margin: var(--padding-medium) var(--padding-reset);
	}

	.table_answers {
		margin: 5px 0px;
		margin-bottom: 10px;
	}


	.modal {
		max-width: 100%;
		max-height: 95%;
	}


	#menu-header {
		display: block;
	}


	#menu-header.nav-collapse.in.collapse  {
	 	margin-top: var(--navbar-height-mobile);
	}

	body.nofixed #menu-header.nav-collapse.in.collapse  {
	 	margin-top: -20px;
	}


	#menu-header ul {
		margin-top: 20px;
	}

	body.nofixed #menu-header {
		margin-top: 0px;
	}

	#menu-bottom {
		display: block;
		position: fixed;
		bottom: 0px;
		left: 0px;
		right: 0px;
	}

	.menu-bottom-content {
		width: 100%;
		text-align: center;
		box-sizing: border-box;
		padding: 3px 0px;
	}

	#menu-bottom .menu-bottom-content .menu-option {
		display: inline-block;
		width: 32%;
		box-sizing: border-box;
	}

	#menu-bottom .menu-bottom-content .menu-option .btn {
		width: 95%;
		padding: 4px 2px;
	}

	#main-nav {
		display: none;
	}

	#login-header {
		display: none;
	}

	.navbar {
		margin-bottom: 5px;
	}


	.navbar .navbar-inner {
		min-height: var(--navbar-height-desktop);
	}


	#left-panel {
		display: none;
	}

	.tab-content-premium {
		background-color: var(--color-bg-success);
	    padding: var(--padding-reset);
	}

	.nav-tabs>li>a, .nav-pills>li>a {
		padding-left: 5px;
		padding-right: 5px;
		padding-bottom: var(--padding-reset);
		padding-top: 0px;
	}

	.highlighted {
		font-weight: bold;
		line-height: 1.5;
		font-size: 125%;
	}

	.highlighted a {
		color: #008000;
	}

	.lista_testow_dzial ul {
		padding-left: 0px;
	}

	ul.lista_zawodow_powiazanych {
		padding-left: 5px;
	}

	ul.lista_zawodow li {
		padding-left: 2px;
	}

	#modal_kup_pakiet_punktow {
		width: var(--modal-width-mobile);
	}

	#modal_kup_pakiet_punktow .modal-body {
		padding-bottom: 70px;
	}

	#modal_kup_pakiet_punktow h2 {
		margin-top: 0px;
	}

	#modal_register_form {
		width: var(--modal-width-mobile);
	}

	#modal_register_form .modal-body{
		padding: var(--padding-medium);
		padding-top: var(--padding-reset);
	}

	#modal_register_form h2 {
		line-height: 10px;
	}

	#tabela_wybor .btn {
		width: 90%;
		min-height: 60px;
		font-size: var(--font-size-button-mobile);
		margin-bottom: var(--padding-medium);
	}

	#modal_register_form div.controls_checkbox {
		margin-left: 0px;
	}

	#modal_pobierz_test a#register_generator {
		margin-top: 15px;
	}

	#modal_pobierz_arkusz a#register_arkusze {
		margin-top: 15px;
	}

	#tabs-testy.nav-tabs > li, #tabs-testy.nav-pills > li {
		max-width: 32%;
		margin: var(--padding-small) var(--padding-reset);
		padding: var(--padding-reset);
		font-size: var(--font-size-small-mobile);
	}

	ul#tabs-testy {
		margin-bottom: 5px;
	}

	.table_kwalifikacje_links a.btn-small {
		padding: 5px 5px;
		line-height: 14px;
	}

	.arkusz_menu_button {
		padding: 2px var(--padding-small);
		font-size:80%;
		line-height: var(--font-size-h-mobile);
	}

	#tabs-testy .kwalifikacja_rok_menu_button {
		line-height: var(--font-size-h-mobile);
		padding: 2px;
	}

	div.korzysci_pakiet_premium ul li {
	    padding-left: 0px;
	}

	#modal_udostepnij_wynik .modal-body{
    	overflow-y: scroll;
	}

	#register_form #register_email_control {
		text-align: center;
	}

	#button_kontynuj_test {
		padding-bottom: 15px;
	}


	.sprawdz_odp_nopremium, .sprawdz_odp_premium {
		max-width:155px;
		padding: 5px 0px;
	}
	.highlighted_color {
		padding-top: 5px;
	}


	.highlighted_color a {
		font-size: var(--font-size-title-mobile);
	}

	div.korzysci_pakiet_premium ul li {
		line-height: var(--font-size-h-mobile);
		font-size: var(--font-size-h-mobile);
	}

	#tabela_zakup_punktow {
		margin-bottom: 5px;
	}

	div.alert.info_testy {
		width: 90%;
		padding: var(--padding-small);
		margin: 0 auto;
		margin-bottom: var(--padding-small);
	}

	ul.lista_zawodow li {
	    margin: 5px 0px 0px 20px;
	}

	.navbar-fixed-top .navbar-inner {
		padding: 0px 20px;
		border-width: 1px;
    	border-radius: 4px;
	}

	.navbar-inner {
		padding-left: 10px;
		padding-right: 10px;
	}

	/*
	.navbar {
		margin-left: -6px;
		margin-right: -6px;
	}
	*/

	/*
	.navbar.navbar-fixed-top {
		margin-left: -21px;
		margin-right: -21px;
	}*/

	.search_box {
		width: 100%;
	}

	.gssb_c {
		width: 100px !important;
	}


	#premium_button_mobile_fixed {
		display: block;
		position: fixed;
		bottom: 10px;
		left: 2%;
		right: 0px;
		width: 96%;
	}

	.premium_button_mobile_container {
		box-sizing: border-box;
		padding: 3px 10px;
	}

	.alert.alert-success.alert-wyjasnienie {
		padding: 3px;
		font-size: 13px;
		line-height: 125%;
	}

	.alert.alert-danger.alert-informacje {
		font-size: var(--font-size-small-mobile);
		padding: var(--padding-small) 2px;
		line-height: 1em;
	}

	.alert.alert-warning.alert-testy-wiedzy {
		font-size: var(--font-size-small-mobile);
		padding: var(--padding-small) 2px;
		line-height: 1em;
	}


	.lista_testow_dzial li {
		padding: 2px 0px 2px 0px;
	}

	.lista_testow_dzial li.link_test_online {
		padding: 2px 0px 2px 14px;
	}

	.lista_zawodow_powiazanych li:before {
		margin: 5px;;
	}


	.lista_zawodow_powiazanych li {
		padding: 0px;;
	}

	.link_test_online:before {
	    margin: 0 2px 0 -15px;
	}

	.link_test_pdf:before {
	    margin: 0 3px 0 -15px;
	}


	#back-to-top {
		display: none!important;
	}


    .form-horizontal .control-label {
        float: none;
        width: auto;
        padding-top: 0;
        text-align: left;
    }

    .form-horizontal .controls {
        margin-left: 0;
    }

    .form-horizontal .control-group {
        margin-bottom: 15px;
    }

	.control-group.control-group_contact_form_consent {
		margin-bottom: 0px;
	}

    .contact_form_email,
    .contact_form_name,
    .contact_form_subject,
    .contact_form_textarea {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .contact_form_input.contact_form_subject, .contact_form_input.contact_form_name, .contact_form_input.contact_form_email {
    	 height: 30px; /* Zwiększona wysokość pól input na urządzeniach mobilnych */
    }

    #pula_form {
		margin-top: 5px;
	}

    #pula_form #pula_wybierz {
		margin: 0px;
		margin-bottom: 5px;
		color: #333;
		font-weight: bold;
	}

	#pula_form #pula_dostepna_ilosc_pytan, #progress_pula p {
		font-size: 13px;
	}

	.table_arkusze_links {
		margin-bottom: 5px;
	}

	div#modal_zagadnienia div.modal-body {
		padding: var(--padding-medium);
		padding-top: var(--padding-reset);
	}

	div#modal_zagadnienia form#modal_zagadnienia_form {
		margin-bottom: 5px;
	}

	div#modal_zagadnienia div.alert.alert-warning {
		padding: 2px;
	}

	div#modal_zagadnienia form#modal_zagadnienia_form div.control-group {
		margin-top: 0px;
		margin-bottom: 0px;
	}

	.nav-collapse .nav>li>a, .nav-collapse .dropdown-menu a {
		color: var(--color-text-nav);
	}

	.hidden-mobile {
		display: none !important;
	}

	#tabs-testy.nav-tabs a {
	    padding-top: 1px;
	    padding-bottom: 1px;
	}

	#modal_register_form div.controls_checkbox label {
    	font-size: 11px;
    	line-height: 14px;
	}

	.help-inline {
		font-size: 11px;
		font-style: italic;
	}

	div#kwalifikacje-listy table tbody tr td a {
		line-height: 14px;
	}

	div#listy_wszystkich_testow h3 {
		font-size: 16px;
	}

	div.control-group.control-group_contact_form_consent div label {
		margin: var(--padding-reset);
		font-size: var(--font-size-small-mobile);
	}

	#modal_udostepnij_egzamin .modal-body {
		padding: var(--padding-reset);
	}


	#modal_reset_progress .modal-body {
		padding: var(--padding-reset);
	}

	#modal_udostepnij_egzamin .alert {
		padding: 3px;
		font-size: 13px;
		line-height: 125%;
	}


	/* Style responsive dla modalu udostępniania egzaminu */
	.modal-content-area {
		padding: var(--padding-medium);
	}

	.modal-form-divider {
		margin: 10px 0;
	}

	.modal-header {
		padding-bottom: var(--padding-reset);
	}

	#modal_udostepnij_wynik div.modal-body {
		padding: var(--padding-reset);
	}

	#modal_potwierdz_zakonczenie div.modal-body{
		padding: var(--padding-reset);
	}


	.session-warning-alert {
        padding: var(--padding-medium);
    }

    .session-warning-alert h4 {
        font-size: var(--font-size-title-mobile);
    }

	.session-warning-alert .btn-warning {
		max-width: 250px;
	}

    .session-warning-buttons {
		margin: 0 auto;
    }

    .session-warning-btn-continue,
    .session-warning-btn-override {
        width: 100%;
        text-align: center;
        padding: var(--padding-medium) var(--padding-large);
    }

    .session-warning-info p {
        font-size: var(--font-size-h-mobile);
        line-height: 1.3;
    }

    /* Style responsive dla progress-with-reset */
    .progress-with-reset-container {
        display: flex;
        align-items: center;
        gap: 5px;
        flex-wrap: nowrap;
    }

    .progress-with-reset-bar {
        flex: 1;
        min-width: 60%;
        max-width: none !important;
        margin: 0 !important;
        height: 20px;
    }

    .progress-reset-button {
        flex-shrink: 0;
        white-space: nowrap;
        padding: 2px 4px;
        font-size: 10px;
        min-width: auto;
    }

} /*end media query*/






@media (max-width: 350px) {
	#likebox_testy {
		display: none;
	}

	.modal-body {
		padding: var(--padding-small);
	}

	.navbar-inner {
		padding: 0px 10px;
	}

	#tabela_zakup_punktow td, #tabela_zakup_punktow td {
		padding: var(--padding-small);
	}

	.table.table_answers label {
		font-size: var(--font-size-h-mobile);
	}

	.navbar img  {
		height: 35px;
	}

	.navbar .navbar-inner {
		min-height: var(--navbar-height-mobile);
	}
	#content {
	    padding-top: var(--content-padding-desktop);
	}

	.modal-header {
		padding-bottom: var(--padding-reset);
	}


}

/* Responsive styles dla okienka potwierdzenia egzaminu */
@media (max-width: 768px) {
    .egzamin_container {
        padding: var(--padding-medium);
        margin: 10px;
        max-width: none;
    }

    .egzamin_container .span5 {
        width: 100% !important;
        margin: 0;
    }

    .egzamin_form_actions {
        padding: 15px;
    }

	#tabela_wybor .row-fluid:first-child {
		width: 100%;
		margin: 0 auto;
	}
}

/* Responsive styles dla bardzo małych smartfonów */
@media (max-width: 480px) {
    #tabela_wybor {
        width: var(--tabela-wybor-width-mobile) !important;
        margin: 10px auto !important;
        text-align: center !important;
		padding: var(--padding-small);
    }

    #tabela_wybor .row-fluid {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
    }

    #tabela_wybor .span6 {
        width: var(--span6-width-standard) !important;
        margin-bottom: var(--padding-reset);
        flex: 0 0 var(--span6-width-standard);
        margin-left: 0 !important;
        margin-right: var(--span6-margin-right) !important;
    }

    #tabela_wybor .span6:last-child {
        margin-right: 0 !important;
    }

    #tabela_wybor .test-option-section {
        padding: 8px;
        margin-bottom: 6px;
        text-align: center;
    }

    #tabela_wybor .test-buttons-section {
        text-align: center;
    }

    #tabela_wybor label {
        text-align: center;
    }

    /* Zbliżenie checkboxów do siebie */
    #tabela_wybor .test-buttons-section label.checkbox {
        margin-bottom: 3px;
        display: inline-block;
        margin-right: 10px;
        vertical-align: middle;
		padding: var(--padding-small);
    }

    #tabela_wybor .test-buttons-section label.checkbox input[type="checkbox"] {
        vertical-align: middle;
        margin-right: 3px;
    }

    #tabela_wybor .test-buttons-section br {
        display: none;
    }

    /* Pozwól na łamanie linii w przyciskach wieloliniowych */
    #tabela_wybor .test-buttons-section .btn-multiline .btn-line-break {
        display: block !important;
    }

    #tabela_wybor .test-buttons-section .btn-multiline {
        white-space: normal !important;
        line-height: 1.0;
    }

    #tabela_wybor .test-option-title {
        font-size: 15px;
        margin-bottom: 3px;
    }

	#tabela_wybor .row-fluid:first-child {
		width: 100%;
		margin: 0 auto;
	}

    #potwierdzenie_testu select {
        font-size: var(--font-size-button-mobile);
        height: 45px;
        max-width: 130px;
    }

	    .session-warning-alert {
        padding: var(--padding-small);
        margin: var(--padding-small);
    }

    .session-warning-alert h4 {
        font-size: var(--font-size-h-mobile);
        margin-bottom: var(--margin-small);
    }

	.session-warning-alert .btn-warning {
		max-width: 250px;
	}

    .session-warning-info p {
        font-size: var(font-size-h-mobile);
        margin-bottom: 3px;
    }

    .session-warning-btn-continue,
    .session-warning-btn-override {
        padding: var(--padding-small) var(--padding-medium);
        font-size: var(--font-size-h-mobile);
    }

    .session-warning-btn-override small {
        font-size: 10px;
        margin-top: 1px;
    }

}

/* Responsive styles dla bardzo wąskich ekranów */
@media (max-width: 350px) {
    #tabela_wybor {
        width: var(--tabela-wybor-width-mobile) !important;
        margin: 10px auto !important;
        text-align: center !important;
		padding: var(--padding-small);
    }

    #tabela_wybor .row-fluid {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
    }

    #tabela_wybor .span6 {
        width: var(--span6-width-narrow) !important;
        margin-bottom: 15px;
        flex: 0 0 var(--span6-width-narrow);
        margin-left: 0 !important;
        margin-right: var(--span6-margin-right) !important;
    }

    #tabela_wybor .span6:last-child {
        margin-right: 0 !important;
    }

    #tabela_wybor .test-option-title {
        font-size: 11px;
        margin-bottom: 2px;
    }

    #tabela_wybor .test-option-section {
        padding: 6px;
        text-align: center;
    }

    #tabela_wybor .test-buttons-section {
        text-align: center;
    }

    #tabela_wybor label {
        text-align: center;
    }

    /* Zbliżenie checkboxów do siebie */
    #tabela_wybor .test-buttons-section label.checkbox {
        margin-bottom: 2px;
        display: inline-block;
        margin-right: 8px;
        vertical-align: middle;
		padding: var(--padding-small);
    }

    #tabela_wybor .test-buttons-section label.checkbox input[type="checkbox"] {
        vertical-align: middle;
        margin-right: 3px;
    }

    #tabela_wybor .test-buttons-section br {
        display: none;
    }

    /* Pozwól na łamanie linii w przyciskach wieloliniowych */
    #tabela_wybor .test-buttons-section .btn-multiline .btn-line-break {
        display: block !important;
    }

    #tabela_wybor .test-buttons-section .btn-multiline {
        white-space: normal !important;
        line-height: 0.9;
        font-size: var(--font-size-small-mobile);
    }

    #potwierdzenie_testu select {
        font-size: 14px;
        height: 40px;
        max-width: 90px;
    }

    /* Style dla bardzo małych ekranów - progress-with-reset */
    .progress-with-reset-container {
        gap: 3px;
    }

    .progress-reset-button {
        padding: 1px 3px;
        font-size: 9px;
    }
}

/* ================================================
   RESPONSIVE STYLES DLA SYSTEMU EGZAMINÓW - ETAP 5
   ================================================ */

/* Responsive styles dla tabletów i większych telefonów */
@media (max-width: 979px) and (min-width: 768px) {
    .egzaminy-table {
        font-size: 13px;
    }

    .egzamin-actions .btn {
        padding: 2px 4px;
        font-size: 10px;
        margin-bottom: 2px;
    }

    .wyniki-stats .stat-item {
        margin: 0 10px 10px 10px;
    }

    .wyniki-stats .stat-value {
        font-size: 20px;
    }
}

/* Responsive styles dla telefonów */
@media (max-width: 767px) {
    /* Tabela egzaminów na mobile */
    .egzaminy-table {
        font-size: 12px;
    }

    .egzaminy-table .hidden-mobile {
        display: none !important;
    }

    .egzamin-actions {
        white-space: normal;
    }

    .egzamin-actions .btn {
        display: block;
        margin-bottom: 3px;
        width: 100%;
        font-size: 11px;
        padding: 4px 2px;
        margin-right: 0;
    }

    /* Statystyki na mobile - utrzymanie poziomego układu */
    .wyniki-stats {
        padding: 8px 5px;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .wyniki-stats .stat-item {
        display: inline-block;
        margin: 0 6px 5px 6px;
        vertical-align: top;
        white-space: normal;
        min-width: 65px;
        max-width: 90px;
    }

    .wyniki-stats .stat-value {
        font-size: 18px;
        line-height: 1.1;
    }

    .wyniki-stats .stat-label {
        font-size: 11px;
        margin-top: 2px;
        line-height: 1.2;
    }

    /* Paginacja na mobile */
    .pagination ul li {
        margin: 2px;
    }

    .pagination ul li a {
        padding: 5px 8px;
        font-size: 12px;
    }

    .pagination-info {
        font-size: 12px;
    }

    /* Szczegóły egzaminu na mobile */
    .well .span8,
    .well .span4 {
        width: 100% !important;
        margin: 0;
    }

    .well .btn-group {
        text-align: center;
        margin-top: 10px;
    }

    .well .btn-group .btn {
        display: inline-block;
        margin: 2px;
    }

	.egzamin-actions .btn-group {
		display: inline;
	}
}

/* Responsive styles dla bardzo małych telefonów */
@media (max-width: 480px) {
    .wyniki-stats {
        padding: 6px 3px;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .wyniki-stats .stat-item {
        display: inline-block;
        margin: 0 4px 3px 4px;
        vertical-align: top;
        white-space: normal;
        min-width: 55px;
        max-width: 75px;
    }

    .wyniki-stats .stat-value {
        font-size: 15px;
        line-height: 1;
    }

    .wyniki-stats .stat-label {
        font-size: 9px;
        margin-top: 1px;
        line-height: 1.1;
    }

    .egzamin-actions .btn {
        font-size: 10px;
        padding: 3px 1px;
    }

    .pagination ul li a {
        padding: 4px 6px;
        font-size: 11px;
    }

	.timer-content {
		max-width: 185px;
	}

	.timer-text {
		display: inline;
	}

	.timer-label {
		font-size: small;
	}

	#timer_display {
		font-size: small;
	 	margin-left: 5px;
	}

}

/* Responsive styles dla bardzo wąskich ekranów */
@media (max-width: 350px) {
    .egzaminy-table {
        font-size: 11px;
    }

    .wyniki-stats {
        padding: 5px 2px;
    }

    .wyniki-stats .stat-item {
        min-width: 45px;
        max-width: 65px;
        margin: 0 3px 2px 3px;
    }

    .wyniki-stats .stat-value {
        font-size: 13px;
        line-height: 1;
    }

    .wyniki-stats .stat-label {
        font-size: 8px;
        margin-top: 1px;
        line-height: 1;
    }

    .egzamin-actions .btn {
        font-size: 9px;
        padding: 2px 1px;
    }
}