/* =========================================================
   CCS — FORMULARZ APLIKACYJNY
   ========================================================= */

.webform-submission-form,
.webform-submission-form * {
  box-sizing: border-box;
}


/* =========================================================
   MODAL
   ========================================================= */

.ui-dialog {
  width: 511px !important;
  max-width: calc(100vw - 32px) !important;

  height: 980px !important;
  max-height: calc(100vh - 32px) !important;

  padding: 0 !important;
  overflow: hidden !important;

  background: #ffffff !important;

  border: 0 !important;
  border-radius: 12px !important;

  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.16) !important;

  font-family: "Mulish", sans-serif !important;
  box-sizing: border-box !important;
}


/* =========================================================
   TŁO POD MODALEM
   ========================================================= */

.ui-widget-overlay {
  background: #000000 !important;
  opacity: 0.42 !important;
}


/* =========================================================
   NAGŁÓWEK MODALA
   ========================================================= */

.ui-dialog .ui-dialog-titlebar {
  height: 84px !important;

  position: relative !important;

  display: flex !important;
  align-items: center !important;

  padding: 0 32px !important;

  background: linear-gradient(
    90deg,
    rgba(35, 174, 132, 0.34) 0%,
    rgba(35, 174, 132, 0.10) 100%
  ) !important;

  border: 0 !important;
  border-radius: 12px 12px 0 0 !important;

  box-sizing: border-box !important;
}


/* Tytuł */

.ui-dialog .ui-dialog-title {
  margin: 0 !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;

  color: #313131 !important;
}


/* =========================================================
   PRZYCISK X
   ========================================================= */

.ui-dialog .ui-dialog-titlebar-close {
  width: 32px !important;
  height: 32px !important;

  position: absolute !important;

  top: 50% !important;
  right: 30px !important;

  margin: 0 !important;
  padding: 0 !important;

  transform: translateY(-50%) !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: #ffffff !important;

  border: 0 !important;
  border-radius: 50% !important;

  box-shadow: none !important;

  font-size: 0 !important;

  cursor: pointer !important;
}

.ui-dialog .ui-dialog-titlebar-close .ui-icon {
  display: none !important;
}

.ui-dialog .ui-dialog-titlebar-close::before,
.ui-dialog .ui-dialog-titlebar-close::after {
  content: "" !important;

  position: absolute !important;

  width: 13px !important;
  height: 2px !important;

  left: 50% !important;
  top: 50% !important;

  background: #5f6865 !important;

  border-radius: 2px !important;
}

.ui-dialog .ui-dialog-titlebar-close::before {
  transform: translate(-50%, -50%) rotate(45deg) !important;
}

.ui-dialog .ui-dialog-titlebar-close::after {
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}


/* =========================================================
   ZAWARTOŚĆ MODALA
   ========================================================= */

.ui-dialog .ui-dialog-content {
  width: 100% !important;

  height: 896px !important;
  max-height: calc(100vh - 116px) !important;

  padding: 26px 32px 32px 32px !important;

  background: #ffffff !important;

  overflow-x: hidden !important;
  overflow-y: auto !important;

  box-sizing: border-box !important;
}


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

.ui-dialog .webform-submission-form {
  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  font-family: "Mulish", sans-serif !important;

  color: #313131 !important;

  box-sizing: border-box !important;
}

.ui-dialog .webform-submission-form .form-item {
  width: 100% !important;

  margin: 0 0 14px !important;
  padding: 0 !important;
}


/* =========================================================
   ETYKIETY
   ========================================================= */

.ui-dialog .webform-submission-form label {
  display: block !important;

  margin: 0 0 5px !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;

  color: #40534e !important;

  text-transform: uppercase !important;
}


/* =========================================================
   POLA TEKSTOWE
   ========================================================= */

.ui-dialog .webform-submission-form input[type="text"],
.ui-dialog .webform-submission-form input[type="email"],
.ui-dialog .webform-submission-form input[type="tel"] {
  width: 100% !important;
  max-width: none !important;

  height: 54px !important;

  margin: 0 !important;
  padding: 10px 12px !important;

  background: #ffffff !important;

  border: 1px solid #c9cecc !important;
  border-radius: 3px !important;

  box-shadow: none !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 14px !important;

  color: #313131 !important;
}


/* Focus */

.ui-dialog .webform-submission-form input[type="text"]:focus,
.ui-dialog .webform-submission-form input[type="email"]:focus,
.ui-dialog .webform-submission-form input[type="tel"]:focus,
.ui-dialog .webform-submission-form textarea:focus {
  border-color: #23ae84 !important;

  outline: none !important;

  box-shadow: 0 0 0 1px #23ae84 !important;
}


/* =========================================================
   WIADOMOŚĆ
   ========================================================= */

.ui-dialog .webform-submission-form textarea {
  width: 100% !important;

  height: 126px !important;
  min-height: 126px !important;
  max-height: 126px !important;

  margin: 0 !important;
  padding: 10px 12px !important;

  resize: none !important;

  background: #ffffff !important;

  border: 1px solid #c9cecc !important;
  border-radius: 3px !important;

  box-shadow: none !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 14px !important;

  color: #313131 !important;
}


/* =========================================================
   ZAŁĄCZ CV
   ========================================================= */

.ui-dialog .webform-submission-form .form-item-cv {
  width: 100% !important;

  margin: 2px 0 18px !important;
  padding: 0 !important;
}


/* Etykieta ZAŁĄCZ CV */

.ui-dialog .webform-submission-form .form-item-cv > label {
  margin: 0 0 7px !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;

  color: #40534e !important;

  text-transform: uppercase !important;
}


/* =========================================================
   BOX UPLOADU
   ========================================================= */

.ui-dialog .webform-submission-form .form-item-cv .form-managed-file {
  position: relative !important;

  width: 447px !important;
  max-width: 100% !important;

  height: 122px !important;
  min-height: 122px !important;

  margin: 0 !important;
  padding: 32px !important;

  display: flex !important;
  align-items: center !important;

  background: rgba(35, 174, 132, 0.03) !important;

  border: 1px dashed #23ae84 !important;
  border-radius: 6px !important;

  box-shadow: none !important;

  overflow: hidden !important;

  cursor: pointer !important;
}


/* =========================================================
   NATYWNY INPUT
   ========================================================= */

.ui-dialog .webform-submission-form
.form-item-cv .form-managed-file input[type="file"] {
  position: absolute !important;

  inset: 0 !important;

  width: 100% !important;
  height: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  opacity: 0 !important;

  cursor: pointer !important;

  z-index: 20 !important;
}


/* =========================================================
   WŁASNA ZAWARTOŚĆ BOXA
   ========================================================= */

.ui-dialog .webform-submission-form
.form-item-cv .ccs-cv-upload-content {
  width: 100% !important;

  display: flex !important;
  align-items: center !important;

  gap: 24px !important;

  margin: 0 !important;
  padding: 0 !important;

  pointer-events: none !important;

  font-family: "Mulish", sans-serif !important;

  position: relative !important;
  z-index: 5 !important;
}


/* =========================================================
   IKONA CV
   ========================================================= */

.ui-dialog .webform-submission-form
.form-item-cv .ccs-cv-upload-icon {
  width: 32px !important;
  height: 32px !important;

  min-width: 32px !important;
  flex: 0 0 32px !important;

  margin: 0 !important;
  padding: 0 !important;

  background-image: url("https://www.ccsonline.pl/sites/default/files/2026-09/Document%20Text.svg") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 32px 32px !important;
}


/* =========================================================
   BLOK TEKSTU
   ========================================================= */

.ui-dialog .webform-submission-form
.form-item-cv .ccs-cv-upload-text {
  min-width: 0 !important;

  display: flex !important;
  flex-direction: column !important;

  gap: 8px !important;

  margin: 0 !important;
  padding: 0 !important;

  font-family: "Mulish", sans-serif !important;
}


/* =========================================================
   GÓRNA LINIA
   ========================================================= */

.ui-dialog .webform-submission-form
.form-item-cv .ccs-cv-upload-title {
  margin: 0 !important;
  padding: 0 !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;

  color: #313131 !important;

  white-space: nowrap !important;
}

.ui-dialog .webform-submission-form
.form-item-cv .ccs-cv-upload-title span {
  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}


/* =========================================================
   KLIKNIJ TUTAJ — STAN POCZĄTKOWY
   ========================================================= */

.ui-dialog .webform-submission-form
.form-item-cv .ccs-cv-upload-link {
  color: #23ae84 !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;

  cursor: pointer !important;
}


/* =========================================================
   DOLNA LINIA
   ========================================================= */

.ui-dialog .webform-submission-form
.form-item-cv .ccs-cv-upload-info {
  margin: 0 !important;
  padding: 0 !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;

  color: #7a7a7a !important;
}


/* =========================================================
   USUWAMY STARE PSEUDOELEMENTY UPLOADU
   ========================================================= */

.ui-dialog .webform-submission-form
.form-item-cv .form-managed-file::before,
.ui-dialog .webform-submission-form
.form-item-cv .form-managed-file::after {
  content: none !important;
  display: none !important;
}


/* =========================================================
   UKRYCIE NATYWNYCH ELEMENTÓW DRUPALA
   ========================================================= */

.ui-dialog .webform-submission-form
.form-item-cv .form-managed-file > *:not(input[type="file"]):not(.ccs-cv-upload-content) {
  display: none !important;
}


/* Opis Drupala pod boxem */

.ui-dialog .webform-submission-form .form-item-cv > .description,
.ui-dialog .webform-submission-form .form-item-cv > .webform-element-description {
  display: none !important;
}


/* =========================================================
   CV — STAN PO ZAŁĄCZENIU PLIKU
   ========================================================= */

.ui-dialog .webform-submission-form
.form-item-cv
.ccs-cv-upload-content--selected {
  pointer-events: auto !important;
  position: relative !important;
  z-index: 25 !important;
}

.ui-dialog .webform-submission-form
.form-item-cv
.ccs-cv-upload-content--selected
.ccs-cv-upload-text {
  gap: 3px !important;
}


/* ZAŁĄCZONO PLIK */

.ui-dialog .webform-submission-form
.form-item-cv
.ccs-cv-upload-content--selected
.ccs-cv-upload-title {
  margin: 0 !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;

  color: #313131 !important;
}


/* NAZWA PLIKU */

.ui-dialog .webform-submission-form
.form-item-cv
.ccs-cv-upload-file-name {
  max-width: 300px !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;

  color: #7a7a7a !important;
}


/* USUŃ I ZAŁĄCZ INNY PLIK */

.ui-dialog .webform-submission-form
.form-item-cv
.ccs-cv-upload-change {
  margin: 1px 0 0 !important;
  padding: 0 !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;

  color: #23ae84 !important;

  pointer-events: auto !important;
  cursor: pointer !important;

  position: relative !important;
  z-index: 30 !important;
}


/* =========================================================
   RODO — CAŁY BLOK
   ========================================================= */

.ui-dialog .webform-submission-form .form-type-checkbox {
  width: 100% !important;

  display: grid !important;

  grid-template-columns: 20px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;

  column-gap: 12px !important;
  row-gap: 5px !important;

  align-items: start !important;

  margin: 20px 0 0 !important;
  padding: 0 !important;
}


/* =========================================================
   CHECKBOX — NIEZAZNACZONY
   ========================================================= */

.ui-dialog .webform-submission-form
.form-type-checkbox input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;

  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;

  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;

  margin: 1px 0 0 !important;
  padding: 0 !important;

  position: relative !important;

  background-color: #ffffff !important;
  background-image: none !important;

  border: 1px solid #c9cecc !important;
  border-radius: 4px !important;

  box-shadow: none !important;

  cursor: pointer !important;
}


/* =========================================================
   CHECKBOX — ZAZNACZONY
   ========================================================= */

.ui-dialog .webform-submission-form
.form-type-checkbox input[type="checkbox"]:checked {
  background-color: #23ae84 !important;

  background-image: url("https://www.ccsonline.pl/sites/default/files/2026-09/Vector.svg") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 10px 7px !important;

  border-color: #23ae84 !important;
}


/* Wyłączenie pseudo-elementów checkboxa */

.ui-dialog .webform-submission-form
.form-type-checkbox input[type="checkbox"]::before,
.ui-dialog .webform-submission-form
.form-type-checkbox input[type="checkbox"]::after,
.ui-dialog .webform-submission-form
.form-type-checkbox input[type="checkbox"]:checked::before,
.ui-dialog .webform-submission-form
.form-type-checkbox input[type="checkbox"]:checked::after {
  content: none !important;
  display: none !important;
}


/* =========================================================
   KLAUZULA RODO — TYTUŁ
   ========================================================= */

.ui-dialog .webform-submission-form
.form-type-checkbox > label {
  grid-column: 2 !important;
  grid-row: 1 !important;

  width: max-content !important;
  max-width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  display: inline-block !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;

  color: #7a7a7a !important;

  text-transform: none !important;
}


/* =========================================================
   GWIAZDKA RODO
   ========================================================= */

.ui-dialog .webform-submission-form
.form-type-checkbox > label.form-required::after,
.ui-dialog .webform-submission-form
.form-type-checkbox > label.js-form-required::after {
  content: "*" !important;

  display: inline-block !important;

  position: relative !important;
  top: -4px !important;

  width: auto !important;
  height: auto !important;

  margin-left: 3px !important;

  background: none !important;
  background-image: none !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;

  color: #e32727 !important;

  vertical-align: top !important;
}


/* =========================================================
   TREŚĆ KLAUZULI
   ========================================================= */

.ui-dialog .webform-submission-form
.form-type-checkbox .description {
  grid-column: 2 !important;
  grid-row: 2 !important;

  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  display: block !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;

  color: #7a7a7a !important;

  text-transform: none !important;

  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

.ui-dialog .webform-submission-form
.form-type-checkbox .description p,
.ui-dialog .webform-submission-form
.form-type-checkbox .description div {
  margin: 0 !important;
  padding: 0 !important;

  font: inherit !important;
  color: inherit !important;
}


/* =========================================================
   PRZYCISK WYŚLIJ APLIKACJĘ
   ========================================================= */

.ui-dialog .webform-submission-form .form-actions {
  width: 100% !important;

  margin: 22px 0 0 !important;
  padding: 0 !important;

  text-align: center !important;
}

.ui-dialog .webform-submission-form .form-actions input[type="submit"],
.ui-dialog .webform-submission-form .form-actions button {
  min-width: 205px !important;
  min-height: 50px !important;

  margin: 0 auto !important;
  padding: 12px 30px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: #23ae84 !important;

  border: 1px solid #23ae84 !important;
  border-radius: 50px !important;

  box-shadow: none !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;

  color: #ffffff !important;

  cursor: pointer !important;
}

.ui-dialog .webform-submission-form .form-actions input[type="submit"]:hover,
.ui-dialog .webform-submission-form .form-actions button:hover {
  background: #1d9773 !important;
  border-color: #1d9773 !important;
}


/* =========================================================
   MODAL POTWIERDZENIA PO WYSŁANIU APLIKACJI

   Ten selektor występuje tylko w komunikacie sukcesu:
   .webform-confirmation-modal--content

   Dzięki :has() zmieniamy wysokość WYŁĄCZNIE jego
   kontenera .ui-dialog.
   ========================================================= */

.ui-dialog:has(.webform-confirmation-modal--content) {
  width: 511px !important;
  max-width: calc(100vw - 32px) !important;

  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100vh - 32px) !important;

  overflow: hidden !important;
}


/* Treść modala potwierdzenia */

.ui-dialog .webform-confirmation-modal--content {
  width: 100% !important;

  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;

  margin: 0 !important;
  padding: 30px 32px 34px !important;

  overflow: visible !important;

  background: #ffffff !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;

  color: #313131 !important;

  box-sizing: border-box !important;
}


/* Wszystkie elementy tekstowe wewnątrz komunikatu */

.ui-dialog .webform-confirmation-modal--content,
.ui-dialog .webform-confirmation-modal--content p,
.ui-dialog .webform-confirmation-modal--content div,
.ui-dialog .webform-confirmation-modal--content span {
  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;

  color: #313131 !important;
}


/* Usuwamy zbędne marginesy z treści komunikatu */

.ui-dialog .webform-confirmation-modal--content p:first-child {
  margin-top: 0 !important;
}

.ui-dialog .webform-confirmation-modal--content p:last-child {
  margin-bottom: 0 !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 560px) {

  .ui-dialog {
    width: calc(100vw - 24px) !important;

    height: auto !important;
    max-height: calc(100vh - 24px) !important;
  }

  .ui-dialog .ui-dialog-titlebar {
    height: 70px !important;
    padding: 0 20px !important;
  }

  .ui-dialog .ui-dialog-title {
    font-size: 20px !important;
  }

  .ui-dialog .ui-dialog-titlebar-close {
    right: 18px !important;
  }

  .ui-dialog .ui-dialog-content {
    height: auto !important;
    max-height: calc(100vh - 94px) !important;

    padding: 22px 20px 32px !important;
  }

  .ui-dialog .webform-submission-form
  .form-item-cv .form-managed-file {
    width: 100% !important;

    height: 122px !important;
    min-height: 122px !important;

    padding: 24px 20px !important;
  }

  .ui-dialog .webform-submission-form
  .form-item-cv .ccs-cv-upload-content {
    gap: 16px !important;
  }

  .ui-dialog .webform-submission-form
  .form-item-cv .ccs-cv-upload-title,
  .ui-dialog .webform-submission-form
  .form-item-cv .ccs-cv-upload-title span {
    font-size: 14px !important;
  }

  .ui-dialog .webform-submission-form
  .form-item-cv .ccs-cv-upload-info {
    font-size: 11px !important;
  }

  .ui-dialog .webform-submission-form
  .form-item-cv .ccs-cv-upload-file-name {
    max-width: 220px !important;
  }


  /* Potwierdzenie — mobile */

  .ui-dialog:has(.webform-confirmation-modal--content) {
    width: calc(100vw - 24px) !important;
    height: auto !important;
    min-height: 0 !important;
  }

  .ui-dialog .webform-confirmation-modal--content {
    height: auto !important;
    min-height: 0 !important;

    padding: 24px 20px 28px !important;

    font-size: 16px !important;
    line-height: 1.5 !important;
  }
  
}
  
  /* =========================================================
   CCS — FORMULARZ APLIKACYJNY OTWARTY JAKO ZWYKŁA STRONA
   ========================================================= */

/*
 * Wszystkie poniższe reguły dotyczą wyłącznie formularza,
 * który NIE znajduje się wewnątrz .ui-dialog.
 *
 * Modal pozostaje bez zmian.
 */


/* =========================================================
   GŁÓWNY FORMULARZ
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form {
  width: 511px !important;
  max-width: calc(100vw - 32px) !important;

  margin: 40px auto 60px !important;
  padding: 32px !important;

  background: #ffffff !important;

  border: 0 !important;
  border-radius: 12px !important;

  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08) !important;

  font-family: "Mulish", sans-serif !important;
  color: #313131 !important;

  box-sizing: border-box !important;
}


/* =========================================================
   ODSTĘPY PÓL
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form .form-item {
  width: 100% !important;

  margin: 0 0 14px !important;
  padding: 0 !important;
}


/* =========================================================
   ETYKIETY
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form label {
  display: block !important;

  margin: 0 0 5px !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;

  color: #40534e !important;

  text-transform: uppercase !important;
}


/* =========================================================
   POLA TEKSTOWE
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form input[type="text"],

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form input[type="email"],

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form input[type="tel"] {
  width: 100% !important;
  max-width: none !important;

  height: 54px !important;

  margin: 0 !important;
  padding: 10px 12px !important;

  background: #ffffff !important;

  border: 1px solid #c9cecc !important;
  border-radius: 3px !important;

  box-shadow: none !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 14px !important;

  color: #313131 !important;
}


/* FOCUS */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form input[type="text"]:focus,

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form input[type="email"]:focus,

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form input[type="tel"]:focus,

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form textarea:focus {
  border-color: #23ae84 !important;

  outline: none !important;

  box-shadow: 0 0 0 1px #23ae84 !important;
}


/* =========================================================
   WIADOMOŚĆ
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form textarea {
  width: 100% !important;

  height: 126px !important;
  min-height: 126px !important;
  max-height: 126px !important;

  margin: 0 !important;
  padding: 10px 12px !important;

  resize: none !important;

  background: #ffffff !important;

  border: 1px solid #c9cecc !important;
  border-radius: 3px !important;

  box-shadow: none !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 14px !important;

  color: #313131 !important;
}


/* =========================================================
   ZAŁĄCZ CV
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form .form-item-cv {
  width: 100% !important;

  margin: 2px 0 18px !important;
  padding: 0 !important;
}


body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form .form-item-cv > label {
  margin: 0 0 7px !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;

  color: #40534e !important;

  text-transform: uppercase !important;
}


/* =========================================================
   BOX UPLOADU
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv .form-managed-file {
  position: relative !important;

  width: 447px !important;
  max-width: 100% !important;

  height: 122px !important;
  min-height: 122px !important;

  margin: 0 !important;
  padding: 32px !important;

  display: flex !important;
  align-items: center !important;

  background: rgba(35, 174, 132, 0.03) !important;

  border: 1px dashed #23ae84 !important;
  border-radius: 6px !important;

  box-shadow: none !important;

  overflow: hidden !important;

  cursor: pointer !important;
}


/* INPUT FILE */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv .form-managed-file input[type="file"] {
  position: absolute !important;

  inset: 0 !important;

  width: 100% !important;
  height: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  opacity: 0 !important;

  cursor: pointer !important;

  z-index: 20 !important;
}


/* =========================================================
   CUSTOMOWA ZAWARTOŚĆ CV
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv .ccs-cv-upload-content {
  width: 100% !important;

  display: flex !important;
  align-items: center !important;

  gap: 24px !important;

  margin: 0 !important;
  padding: 0 !important;

  pointer-events: none !important;

  position: relative !important;
  z-index: 5 !important;

  font-family: "Mulish", sans-serif !important;
}


/* IKONA */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv .ccs-cv-upload-icon {
  width: 32px !important;
  height: 32px !important;

  min-width: 32px !important;
  flex: 0 0 32px !important;

  margin: 0 !important;
  padding: 0 !important;

  background-image: url("https://www.ccsonline.pl/sites/default/files/2026-09/Document%20Text.svg") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 32px 32px !important;
}


/* BLOK TEKSTU */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv .ccs-cv-upload-text {
  min-width: 0 !important;

  display: flex !important;
  flex-direction: column !important;

  gap: 8px !important;

  margin: 0 !important;
  padding: 0 !important;

  font-family: "Mulish", sans-serif !important;
}


/* TYTUŁ */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv .ccs-cv-upload-title {
  margin: 0 !important;
  padding: 0 !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;

  color: #313131 !important;

  white-space: nowrap !important;
}


body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv .ccs-cv-upload-title span {
  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}


/* KLIKNIJ TUTAJ */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv .ccs-cv-upload-link {
  color: #23ae84 !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;

  cursor: pointer !important;
}


/* INFORMACJA */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv .ccs-cv-upload-info {
  margin: 0 !important;
  padding: 0 !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;

  color: #7a7a7a !important;
}


/* =========================================================
   UKRYCIE NATYWNYCH ELEMENTÓW UPLOADU
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv .form-managed-file::before,

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv .form-managed-file::after {
  content: none !important;
  display: none !important;
}


body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv
.form-managed-file > *:not(input[type="file"]):not(.ccs-cv-upload-content) {
  display: none !important;
}


body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv > .description,

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv > .webform-element-description {
  display: none !important;
}


/* =========================================================
   CV — PLIK ZAŁĄCZONY
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv
.ccs-cv-upload-content--selected {
  pointer-events: auto !important;

  position: relative !important;
  z-index: 25 !important;
}


body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv
.ccs-cv-upload-content--selected
.ccs-cv-upload-text {
  gap: 3px !important;
}


body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv
.ccs-cv-upload-content--selected
.ccs-cv-upload-title {
  margin: 0 !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;

  color: #313131 !important;
}


/* NAZWA PLIKU */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv
.ccs-cv-upload-file-name {
  max-width: 300px !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;

  color: #7a7a7a !important;
}


/* USUŃ I ZAŁĄCZ INNY PLIK */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-item-cv
.ccs-cv-upload-change {
  margin: 1px 0 0 !important;
  padding: 0 !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;

  color: #23ae84 !important;

  pointer-events: auto !important;
  cursor: pointer !important;

  position: relative !important;
  z-index: 30 !important;
}


/* =========================================================
   RODO
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form .form-type-checkbox {
  width: 100% !important;

  display: grid !important;

  grid-template-columns: 20px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;

  column-gap: 12px !important;
  row-gap: 5px !important;

  align-items: start !important;

  margin: 20px 0 0 !important;
  padding: 0 !important;
}


/* CHECKBOX */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;

  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;

  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;

  margin: 1px 0 0 !important;
  padding: 0 !important;

  position: relative !important;

  background-color: #ffffff !important;
  background-image: none !important;

  border: 1px solid #c9cecc !important;
  border-radius: 4px !important;

  box-shadow: none !important;

  cursor: pointer !important;
}


body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox input[type="checkbox"]:checked {
  background-color: #23ae84 !important;

  background-image: url("https://www.ccsonline.pl/sites/default/files/2026-09/Vector.svg") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 10px 7px !important;

  border-color: #23ae84 !important;
}


body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox input[type="checkbox"]::before,

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox input[type="checkbox"]::after,

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox input[type="checkbox"]:checked::before,

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox input[type="checkbox"]:checked::after {
  content: none !important;
  display: none !important;
}


/* TYTUŁ RODO */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox > label {
  grid-column: 2 !important;
  grid-row: 1 !important;

  width: max-content !important;
  max-width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  display: inline-block !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;

  color: #7a7a7a !important;

  text-transform: none !important;
}


/* GWIAZDKA */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox > label.form-required::after,

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox > label.js-form-required::after {
  content: "*" !important;

  display: inline-block !important;

  position: relative !important;
  top: -4px !important;

  width: auto !important;
  height: auto !important;

  margin-left: 3px !important;

  background: none !important;
  background-image: none !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;

  color: #e32727 !important;

  vertical-align: top !important;
}


/* TREŚĆ KLAUZULI */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox .description {
  grid-column: 2 !important;
  grid-row: 2 !important;

  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  display: block !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;

  color: #7a7a7a !important;

  text-transform: none !important;

  white-space: normal !important;
}


body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox .description p,

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form
.form-type-checkbox .description div {
  margin: 0 !important;
  padding: 0 !important;

  font: inherit !important;
  color: inherit !important;
}


/* =========================================================
   PRZYCISK WYŚLIJ APLIKACJĘ
   ========================================================= */

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form .form-actions {
  width: 100% !important;

  margin: 22px 0 0 !important;
  padding: 0 !important;

  text-align: center !important;
}


body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form .form-actions input[type="submit"],

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form .form-actions button {
  min-width: 205px !important;
  min-height: 50px !important;

  margin: 0 auto !important;
  padding: 12px 30px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: #23ae84 !important;

  border: 1px solid #23ae84 !important;
  border-radius: 50px !important;

  box-shadow: none !important;

  font-family: "Mulish", sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;

  color: #ffffff !important;

  cursor: pointer !important;
}


body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form .form-actions input[type="submit"]:hover,

body:not(:has(.ui-dialog .webform-submission-form))
.webform-submission-form .form-actions button:hover {
  background: #1d9773 !important;
  border-color: #1d9773 !important;
}


/* =========================================================
   MOBILE — ZWYKŁA STRONA
   ========================================================= */

@media (max-width: 560px) {

  body:not(:has(.ui-dialog .webform-submission-form))
  .webform-submission-form {
    width: calc(100vw - 24px) !important;

    margin: 24px auto 40px !important;
    padding: 24px 20px 28px !important;
  }


  body:not(:has(.ui-dialog .webform-submission-form))
  .webform-submission-form
  .form-item-cv .form-managed-file {
    width: 100% !important;

    padding: 24px 20px !important;
  }


  body:not(:has(.ui-dialog .webform-submission-form))
  .webform-submission-form
  .form-item-cv .ccs-cv-upload-content {
    gap: 16px !important;
  }


  body:not(:has(.ui-dialog .webform-submission-form))
  .webform-submission-form
  .form-item-cv .ccs-cv-upload-title,

  body:not(:has(.ui-dialog .webform-submission-form))
  .webform-submission-form
  .form-item-cv .ccs-cv-upload-title span {
    font-size: 14px !important;
  }


  body:not(:has(.ui-dialog .webform-submission-form))
  .webform-submission-form
  .form-item-cv .ccs-cv-upload-info {
    font-size: 11px !important;
  }


  body:not(:has(.ui-dialog .webform-submission-form))
  .webform-submission-form
  .form-item-cv .ccs-cv-upload-file-name {
    max-width: 220px !important;
  }

}