#block-instytut-content form {
	
}
 .cart-empty-page {
	 padding: 2rem 0.5rem;
 }
 

/* ----------- CART ---------------------- */ 


#block-instytut-content .cart {

}
#block-instytut-content .cart .views-form form {
	width: 100%;
}
#block-instytut-content .cart .views-form form table {
	width: 100%;
	margin-top: 50px;
}
#block-instytut-content .cart .views-form form table thead {
	border-bottom: 2px solid #ebe7e2;
}
#block-instytut-content .cart .views-form form table th,
#block-instytut-content .cart .views-form form table td {
	padding: 10px;
	text-align: right;
}
#block-instytut-content .cart .views-form form div[data-drupal-selector="order-total-summary"] {
	padding: 20px 0;
}

.cart-form div[id*="edit-actions"] input[id*="edit-submit"] {
	background-color: transparent;
	padding: 10px 20px 10px 20px;
	border-radius: 22px;
	border: 1px solid var(--darkcreme);
	color: var(--orange);
	margin-top: 20px;
}
.cart-form div[id*="edit-actions"] input[id*="edit-checkout"] {
  background-color: var(--orange);
  padding: 10px 20px 10px 20px;
  border-radius: 22px;
  border: 0;
  color: var(--white);
  margin-top: 20px;
}

@media (min-width: 768px) {
	#block-instytut-content .cart .views-form form {
		width: 100%;
	}
}
@media (min-width: 1025px) {
	#block-instytut-content .cart .views-form form {
		width: 80%;
	}
}
@media (min-width: 1200px) {
	#block-instytut-content .cart .views-form form {
		width: 60%;
	}
}



/* ------------------- USER IN CHECKOUT ------------------------ */


.form-wrapper__login-option input.button {
	background-color: var(--orange);
  padding: 10px 20px 10px 20px;
  border-radius: 22px;
  border: 0;
  color: var(--white);
  margin-top: 20px;
  font-size: 1rem;
}
.form-wrapper__login-option input.button {
	cursor: pointer;
}

.form-wrapper__login-option legend span {
	font-size: 1.5rem;
}

.form-item-login-register-mail .description {
	font-size: 0.875rem; /* 14px */
	padding-top: 8px;
}
a.link--previous,
a[id*="edit-login-returning-customer-forgot-password"] {
	 padding: 10px 20px 10px 20px;
	 display: inline-block;
}

#user-login-form input#edit-submit {
	position: relative;
}


form#user-register-form .form-item .description {
	display: none;
}



/* ----------- CHECOUT FLOW ---------------------- */ 


form.commerce-checkout-flow-multistep-default {
	padding-top: 20px;
}

.layout-region-checkout-main {  /* ten po lewej - tu leci cały checkout */
	width: 100%; 
}
.commerce-checkout-flow-multistep-default .layout-region-checkout-main fieldset[id*="edit-payment-information-payment-method--wrapper"] .fieldset-wrapper  {
	margin-top: 10px;
	line-height: 1.4;
}

.checkout-pane-contact-information {
	
}
.checkout-pane-payment-information {
	margin-top: 40px;
}
.checkout-pane-payment-information .fieldset-wrapper {
	margin-top: 20px;
}

.form-item-payment-information-billing-information-select-address,
.profile--type--customer  {
	margin-top: 20px;
	line-height: 1.4;
}


.layout-region-checkout-secondary {    /* ten po lewej */
	 width: 100%; 
	padding: 30px 0px 30px 0px; 
 }

 .layout-region-checkout-secondary h3 {
	padding: 0 0 20px 0;
}
.layout-region-checkout-secondary .checkout-pane-order-summary table .views-field {
	padding: 5px;
}

.layout-region-checkout-secondary .checkout-pane-order-summary footer {
	padding-top: 20px;
}

fieldset[id*="edit-review-contact-information"]{
	margin: 20px 0 10px 0;
	padding: 10px 0 0 0;
 }
fieldset[id*="edit-review-payment-information"] {
	margin: 30px 0 10px 0;
	padding: 10px 0 0 0;
 }
 
form#commerce-checkout-flow-multistep-default  div.form-item-tpay-bank-selection label {
	padding: 25px 0 20px 0;
}

form#commerce-checkout-flow-multistep-default label {
	display: block;
	padding: 6px 0;
}

form#commerce-checkout-flow-multistep-default label.option {
	display: inline-block;
}

 


.checkout-complete__payment-instructions h2 {
	padding: 25px 0 15px 0;
}
.checkout-complete {
	padding: 20px 0 20px 0;
}

.checkout-complete h3 {
	padding: 20px 0 20px 0;
}

.checkout-complete p > a {
	display: inline-block;
	background-color: var(--orange);
	padding: 14px 90px 12px 90px;
  border-radius: 26px;
	border: 0;
	color: var(--white);
	margin-top: 20px;
  margin-bottom: 15px;
	position: relative;
}
.checkout-complete p > a:before {
	content: "";
	position: absolute;
	top: 14px;
  left: 30px;
  display: block;
  width: 32px;
  height: 32px;
	background-image: url(../images/icon-kursy-white.png);
	background-repeat: no-repeat;
	background-size: contain;
}
.checkout-complete p > a:after {
	content: "";
	position: absolute;
	top: 15px;
  right: 40px;
  display: block;
  width: 32px;
  height: 32px;
	background-image: url(../images/icon-kursy-white-arrow.png);
	background-repeat: no-repeat;
	background-size: contain;
	transition: all 0.3s ease !important;
}
.checkout-complete p > a:hover::after {
	top: 14px;
	right: 25px;
	width: 36px;
  height: 36px;
}


fieldset[id*="edit-completion-message-contact-information"],
fieldset[id*="edit-completion-message-payment-information"] {
	margin:  30px 0 0 0;
}
fieldset[id*="edit-completion-message-payment-information"] p {
	line-height: 1.5;
}

fieldset[id*="edit-completion-message-contact-information"] legend,
fieldset[id*="edit-completion-message-payment-information"] legend {
	padding-bottom: 10px;
}



/* -------------- GENERAL ---------------------------- */


.layout-region-checkout-footer div[id*="edit-actions"] input,
.cart-form div[id*="edit-actions"] input {
  font-size: 1rem;
}

input[id*="edit-checkout"] {
	margin-left: 15px;
}

.address-container-inline .js-form-item input.form-text,
.layout-region-checkout-main  input.form-text {
	width: 100%
}

fieldset#edit-login-returning-customer .form-item,
fieldset#edit-login-register .form-item,
form#user-login-form .form-item,
form#user-register-form .form-item,
fieldset#edit-contact-information .form-item,
div[id*="edit-payment-information-billing-information-address"] .form-item  {
	padding: 8px 0 5px 0;
	width: 100%;
}

#edit-login-returning-customer-name,
#edit-login-returning-customer-password,
div[id*="edit-payment-information-billing-information-address"] input,
form#commerce-checkout-flow-multistep-default input.form-email,
form#commerce-checkout-flow-multistep-default input.form-text,
input.form-tel {
	border: 1px solid #dbd7d0;
	padding: 8px;
	width: 100%;
}


/* Target the country dropdown specifically */
select[name*="country_code"],
.country_form-select {
  /* Your custom styles */
  padding: 10px 15px;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  background-color: #fff;
  width: 100%;
  height: 45px;
  appearance: none; /* Remove default browser styling */
  background-image: url('data:image/svg+xml;utf8,<svg fill="black" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 20px;
  cursor: pointer;
}

select[name*="country_code"]:focus {
  outline: none;
}





@media (min-width: 768px) {
	.layout-region-checkout-main  {
		 width: 60%;
		 padding-right: 30px;
	}
	 .layout-region-checkout-secondary {
		 width: 35%;
		 padding: 20px 20px 30px 20px;
		border-left: 2px solid var(--darkcreme); 
	}
}

@media (min-width: 1025px) {
	.layout-region-checkout-main  {
		 width: 45%;
	}
	 .layout-region-checkout-secondary {
		 width: 35%;
	}
}

@media (min-width: 1200px) {
	.layout-region-checkout-main  {
		 width: 45%;
	}
	 .layout-region-checkout-secondary {
		 width: 30%;
	}
}

/* -------------------  KURSY - lista - WIDOK -----------------*/


.kursy-lista {
	padding-top: 30px;
     
}

.kursy-lista  .views-row {
	padding: 15px 0;
}

.kursy-lista  .views-row .field-content {
 
	padding: 0px 0 0 0;
	background-color: #f7f6f3;
}

.kurs-opis {
	 background-color: #f7f6f3;
	padding: 30px 30px  30px  30px;
}

.kurs-obraz {
	 
}



.kursy-lista .views-field-title {
	padding: 25px 0;
	text-align: center;
}

.kurs-wiecej a {
	display: inline-block;
	background-color: var(--orange);
	padding: 10px 20px 10px 20px;
	border-radius: 22px;
	border: 0;
	color: var(--white);
	margin-top: 20px;
}

.kursy-lista  .views-row div[id*="edit-actions"] input {
  background-color: var(--orange);
  padding: 10px 20px 10px 20px;
  border-radius: 22px;
  border: 0;
  color: var(--white);
  margin-top: 20px;
}

.kurs-tytul {
	padding-bottom: 20px;
}

.kurs-haslo {
	padding-bottom: 20px;
}

.kurs-opis-dod {
	padding-bottom: 20px;
	
}

@media (min-width: 1024px) {
	.kursy-lista {
		padding-top: 60px;
		 
	}
	.kursy-lista  .views-row .field-content {
		display: grid;
		grid-template-columns: repeat(26, 1fr);
		 grid-column-gap: 30px;
		 grid-row-gap: 30px;
		padding: 0px 0 0 0;
		background-color: #f7f6f3;
	}

	.kurs-opis {
		grid-column: 1 / span 15;
		padding: 30px 30px  30px  30px;
	}

	.kurs-obraz {
		grid-column: 16 / span 11;
	}
}

.path-product #block-instytut-content article {
		display: grid;
		 grid-column-gap: 0px;
		 grid-row-gap: 0px;
		padding: 25px 0 0 0;
}

.path-product article .foto-right {
	padding: 10px 0px  0px  0px;
	
}

.path-product article .product-left {
	padding: 0px 25px  20px  25px;
}


.product--variation-field--variation_price__2 {
	
}

.class-format-haslo {
	padding-top: 12px;
}

.class-format-opis {
	padding: 30px 0px  30px  0px;
	
}

.commerce-order-item-add-to-cart-form div[id*="edit-actions"] input {
  background-color: var(--orange);
  padding: 16px 40px 16px 40px;
  border-radius: 32px;
  border: 0;
  color: var(--white);
  margin-top: 20px;
}

@media (min-width: 768px) {
	.path-product #block-instytut-content article {
		padding: 30px 0 0 0;
	}
	.path-product article .product-left {
		padding: 0px 10px  20px  10px;
	}
}

@media (min-width: 1024px) {
	.path-product article {
		display: grid;
		grid-template-columns: repeat(26, 1fr);
		 grid-column-gap: 30px;
		 grid-row-gap: 30px;
		padding: 30px 0 0 0;
	}
	.path-product article .product-left {
		grid-column: 1 / span 13;
		padding: 0px 30px  0px  10px;
	}
	.path-product article .foto-right {
		grid-column: 14 / span 12;
		padding: 0px 0px  0px  0px;
		
	}
	
}




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



.user-form .js-form-type-password,
.user-form .js-form-type-email,
.user-form .js-form-type-password-confirm {
	padding: 10px 0;
}

.user-form .js-form-item label {
	display: block;
	padding: 10px 0;
}
.user-form .js-form-item input {
	display: block;
	border: 1px solid #dbd7d0;
	padding: 8px;
	width: 100%;
}


@media (max-width: 767px) {
	#edit-account {
		width: 100%;
	}
}

@media (min-width: 768px) {
	#edit-account {
		width: 70%;
	}
}
@media (min-width: 1025px) {
	#edit-account {
		width: 80%;
	}
}
@media (min-width: 1200px) {
	#edit-account {
		width: 50%;
	}
}