* {
  margin: 0;
  padding: 0;
}

body {
  font-family: 'Noto Sans KR', sans-serif !important;
  background: #fefefe !important;
  color: #0a0a0a;
}

.container {
  width: 100%;
  max-width: 1366px;
  margin: 0 auto;
}

h1.main-title {
  font-size: 36px;
  text-align: center;
  color: #c29742;
  margin: 1rem 0 2rem 0;
  font-weight: bold;
}

h1 i {
  font-size: 36px;
}

.content {
  width: 90%;
  margin: 0 auto;
  border-radius: 7px;
  margin-bottom: 3rem;
  overflow: hidden;
}

.title {
  font-size: 24px;
  margin-bottom: 1rem;
  font-weight: bold;
}

table {
  width: 100%;
}

table thead tr th {
  text-align: center;
  border: solid 1px #ccc;
  padding: 1rem;
  background-color: rgb(247, 247, 247);
  font-size: 14px;
}

thead tr i {
  margin-left: 0!important;
  border-bottom: none;
  color: #3c3c3c;
  font-size: 16px!important;
}

table tbody tr td {
  border: solid 1px #ccc;
}

button.primary,
label.button {
  background-color: #c29742 !important;
  width: 100%;
}

button.primary:hover,
label.button:hover {
  background-color: #8a6417 !important;
}

form i {
  font-size: 20px;
}

.fa-times {
  color: rgb(168, 38, 38);
}

.fa-check {
  color: rgb(107, 165, 21);
}

.has-tip {
  border-bottom: none;
  color: #3c3c3c !important;
  font-size: 16px;
}

input,
select {
  text-transform: uppercase;
  margin-bottom: 0!important;
}

.confirm-page table thead tr:first-child th {
  text-align: left;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  background-color: #eee;
  font-size: 20px;
}

.content.lang-box {
  padding: 0;
  margin-bottom: 16px;
  background-color: transparent;
}

ul.language {
  background-color: white;
  width: 24px;
  margin-bottom: 0;
}

.nav-wrapper {
  text-align: right;
  color: gray;
}

.gray-bg {
  background-color: #eee;
}

.nav-wrapper img {
  width: 48px;
}

.sl-nav {
  display: inline;
}

.sl-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
  display: inline-block;
}

.sl-nav li {
  cursor: pointer;
  padding-bottom: 10px;
}

.sl-nav li ul {
  display: none;
}

.sl-nav li:hover ul {
  position: absolute;
  top: 29px;
  right: -15px;
  display: block;
  background: #fff;
  width: 90px;
  padding-top: 0px;
  z-index: 1;
  border-radius: 5px;
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
}

.sl-nav li:hover .triangle {
  position: absolute;
  top: 15px;
  right: -10px;
  z-index: 10;
  height: 14px;
  overflow: hidden;
  width: 30px;
  background: transparent;
}

.sl-nav li img:hover {
  filter: contrast(150%)
}

.sl-nav li:hover .triangle:after {
  content: '';
  display: block;
  z-index: 20;
  width: 15px;
  transform: rotate(45deg) translateY(0px) translatex(10px);
  height: 15px;
  background: #fff;
  border-radius: 2px 0px 0px 0px;
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
}

.sl-nav li ul li {
  position: relative;
  text-align: left;
  background: transparent;
  padding: 15px 15px;
  padding-bottom: 0;
  z-index: 2;
  font-size: 15px;
  color: #3c3c3c;
}

.sl-nav li ul li:last-of-type {
  padding-bottom: 15px;
}

.sl-nav li ul li span {
  padding-left: 5px;
}

.sl-nav li ul li span:hover,
.sl-nav li ul li span.active {
  color: #146c78;
}

.sl-flag {
  display: inline-block;
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.4);
  width: 15px;
  height: 15px;
  background: #aaa;
  border-radius: 50%;
  position: relative;
  top: 2px;
  overflow: hidden;
}

.flag-de {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTM0A1t6AAAAPUlEQVQ4T+3HMQ0AIBTE0NOHM8x9B7hgh71bIWGieUvze1m7kHGBr/AVvsJX+EpmP5dV5/gKX+ErfIUvVDYcX2NMxQC8PAAAAABJRU5ErkJggg==');
  background-size: cover;
  background-position: center center;
}

.flag-usa {
  background-size: cover;
  background-position: center center;
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTM0A1t6AAABhUlEQVQ4T2Ows82PjGixsc4LD2tysC/09Kjw8622tyuICG8u0w/cpGSCBzF4e1VmZkzw9anOzOj38a4KCW4IC22ECHYk1l9tn4gHMeTlTnZxLikvm+XiUpKW2hvgX+vnV5OVOQEoOGfOtv94AYOzU3Fd7XxHh6Lq6rlurqUx0W0J8Z1AnbW18yotonaYuOJBDBXls4A+bGpaBCTz86YEBtQCvVBSPAPIbY0oP1/aiAcxABU1Ny+2tclvbFjo5FgUF9uenNwNDLnmpkWEnV1TPRcY1O1tS4H6i4umA/0MDK2K8tlAwRqHpP1uoXgQKKraWpcClTY3LQZaCLQ5NaUX5OaWJY3++SeTC/AgBmA4AXUClUJs9ver8fKsAAYEUJCws4G21dXNB1oFdD/Qz8DQTk4C+bm2dn6DZ9bRiDQ8iAEYt8CoBpK5YBIYw0AEEZwSXX4oMB4PYoC6gCzAcDqrjGzEsMfen2xEmbMv1rSTjRi26dqRjShz9o2+6WQjBrSShQSkZAIADvW/HLrLY6cAAAAASUVORK5CYII=');
}

#datetime {
  font-weight: bold;
}

.tooltip {
  max-width: 360px !important;
  opacity: 1!important;
  font-family: 'Noto Sans KR', sans-serif !important;
}

@media screen and (max-width: 63.9375em) {
  .content {
    overflow: hidden;
    padding: 2rem;
  }
  h1.main-title,
  h1 i {
    font-size: 30px;
  }
  .title {
    position: static;
    width: 100%;
  }
  table {
    margin-top: 2rem;
  }
}

@media print {
  body {
    height: 100%;
  }
  .content {
    width: 100%;
    padding: 0 !important;
    margin: 0 !important;
  }
  table {
    width: 100%;
    margin-bottom: 60px;
  }
  /* table thead tr th {
  border: solid 1px eeeeee;
}
table tbody tr td {
  border: solid 1px eeeeee;
} */
  .nav-wrapper {
    display: none;
  }
  #button_area {
    display: none;
  }
}

.li {
  list-style: square;
}

/* development */
body {
  color: #0a0a0a !important;
}

ul {
  margin-left: 0 !important;
}

p {
  margin-bottom: 1rem !important;
}

@media print
{
  #backToTop {
    display: none !important;
  }
}

.error,
.invalid {
  outline: 2px solid red;
}

#application-review td a {
  color: #c29742;
}

.company-name-sample-row,
.directors-details-sample-row,
.pic-sample-row,
.shareholders-details-sample-row {
  display: none !important;
}

.company-name-remove,
.directors-details-remove,
.pic-remove,
.shareholders-details-remove {
  cursor: pointer;
}

.fa-info-circle:hover {
  color: #4899aa;
  cursor: help!important;
}

.business-activities-no-margin-input input {
  margin-bottom: 0!important;
}

#application-dashboard .select-all {
  padding: 0.5rem;
}

/*#application-dashboard .select-all input{*/
/*  margin: 0 !important;*/
/*}*/

#application-dashboard-apply-btn {
  background-color: #d22027;
  color: #fefefe;
  margin: 0;
  text-transform: none !important;
}

.application-dashboard-action-items {
  display: inline-block;
  width: 25%;
  margin-top: 2rem !important;
}

.application-dashboard-mgmt i {
  font-size: 13px !important;
  font-weight: bold !important;
}

.dark-bg {
  background-color: rgba(119, 119, 119, 0.2) !important;
}

.societies-sample-row {
  display: none !important;
}

.client-fill, .client-fill strong {
  color: chocolate;
  font-weight: 400 !important;
  text-transform: uppercase!important;
}

.epsp-review-title {
  color: #0a0a0a;
  font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif;
}

.invalid-radio {
  color: red;
}

.light-bg {
  background-color: #eee !important;
}

.societies-remove {
  cursor: pointer;
}

.epsp-upload-review-url {
  font-size: 14px;
}

.upload-items-remove {
  font-size: 12px !important;
}

.tr-review-1st td {
  word-wrap: break-word;
}

/*.area-1st ol{*/
/*  list-style-type: upper-alpha;*/
/*}*/

#application-form input[type="radio"] {
  /*margin-left: 0.5rem;*/
  /*margin-right: 0.5rem;*/
  margin: 0 0 0 .5rem;
}
.tr-review-1st .client-fill-value {
  padding: 10px;
  margin: 0;
}

.tr-review-1st .client-fill-value ul {
  list-style: none;
}


.error {
  outline: 1px solid #ec0707;
}
form.application-epsp-2026-form div.basic-information .js-form-item label,
form.application-epsp-2026-form div.company-information .js-form-item label,
form.application-epsp-2026-form div.authorized-user .js-form-item label {
  display: none;
}
.application-epsp-2026-files input.js-form-file {
  display: none;
}
#main-form table tbody tr td.required:after {
  color: #ec0707;
  content: " *";
}
.flash-blur-outline-upload-file {
  outline: 2px solid red;
  animation: flashBlur 1s infinite;
}

@keyframes flashBlur {
  50% {
    outline: 2px solid #d28383;
  }
}

/* Make radios display horizontally */
.application-epsp-2026-radio-inline .form-radios {
  display: flex;
  flex-wrap: wrap;      /* allows wrap on small screen */
  gap: 16px;
}

.application-epsp-2026-radio-inline .form-radios .form-item {
  margin: 0;
}

/* Spouse ID type: make first two options share the first row */
.spouse-id-type .form-radios{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap: 12px 28px;
}

.spouse-id-type .form-radios .form-item{
  margin:0;
  display:inline-flex;
  align-items:center;
}

/* Desktop: force wrap AFTER the 2nd option (clean break) */
@media (min-width: 1024px){
  .spouse-id-type .form-radios::after{
    content:"";
    flex: 0 0 100%;
    order: 3; /* place it right after first two items */
  }

  /* Ensure first two appear first */
  .spouse-id-type .form-radios .form-item:nth-child(1){ order:1; }
  .spouse-id-type .form-radios .form-item:nth-child(2){ order:2; }

  /* Remaining options go after the break */
  .spouse-id-type .form-radios .form-item:nth-child(3){ order:4; }
  .spouse-id-type .form-radios .form-item:nth-child(4){ order:5; }
  .spouse-id-type .form-radios .form-item:nth-child(5){ order:6; }
}

/* 8.3 Fixed monthly salary (A) A=B+C */
.salary-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.salary-item {
  display: flex;
  flex-direction: column;
}

.salary-item strong {
  margin-bottom: 6px;
  height: 2.75rem;
}

/* Make responsive */
@media (max-width: 768px) {
  .salary-grid {
    grid-template-columns: 1fr;
  }
}

/**/
/* years / months inline */
.work-exp-inline .form-item{
  display:inline-block;
  margin: 0 6px 0 0;
  vertical-align: middle;
}
.work-exp-inline .unit{
  margin-right: 12px;
}

/* tighter input look */
.work-exp-table input[type="date"] {
  width: 100%;
  max-width: 160px;
}

.work-exp-table input[type="text"] {
  width: 100%;
}

/* dates in one row */
.work-exp-dates .form-item{
  display:inline-block;
  margin: 0 6px 0 0;
}

/* checkbox under dates */
.work-exp-current{
  margin-top: 6px;
  display:flex;
  justify-content:center;
  gap: 6px;
  align-items:center;
}
.work-exp-current .form-item{
  margin:0;
}
.work-exp-header small { display:block; margin-top:4px; }
.work-exp-current {
  display: inline-flex;   /* not flex (block) */
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  justify-content: center;
}

/* Drupal checkbox wrapper adds margin */
.work-exp-current .form-item {
  margin: 0 !important;
}

/* The checkbox input sometimes has extra margin */
.work-exp-current input[type="checkbox"] {
  margin: 0 !important;
}
.work-exp-current label {
  margin: 0 !important;
  padding: 0 !important;
}

/* ============ */
.edu-period .form-item {
  display: inline-block;
  margin: 0 6px 0 0;
  vertical-align: middle;
}

.edu-table input[type="text"]{
  max-width: 160px;
}

/* Education table inputs fill the cell */
.edu-table input[type="text"],
.edu-table input[type="date"],
.edu-table select {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}
/* Mode of Study radios inline */
.edu-table .form-radios {
  display: flex;
  flex-wrap: wrap;      /* wrap on small screens */
  gap: 18px;
  justify-content: center; /* optional: center like your screenshot */
  margin: 0;
}

.edu-table .form-radios .form-item {
  margin: 0 !important;
  display: inline-flex;
  align-items: center;
}
.edu-table fieldset,
.edu-table .fieldset-wrapper {
  border: 0;
  padding: 0;
  margin: 0;
}

/* ==== */
.edu-2col input, .edu-2col select { width: 100% !important; max-width: 100% !important; }
.edu-period .form-item { display:inline-block; margin-right:10px; }


/* === */
/* Professional bundles: align like 2-column rows */
#professional-items-wrapper .form-item {
  margin: 0 0 10px 0;
}

#professional-items-wrapper input,
#professional-items-wrapper select {
  width: 100% !important;
  max-width: 420px;
}

/* put from/to + checkbox on one line */
#professional-items-wrapper .container-inline .form-item,
#professional-items-wrapper .form-type-date,
#professional-items-wrapper .form-type-checkbox {
  display: inline-block;
  margin-right: 12px;
  vertical-align: middle;
}
.form-type-checkbox label.option { margin-left: 6px; }
.period-inline { flex-wrap: nowrap !important; white-space: nowrap; }
.period-inline input[type="date"] { width: 160px; display: inline-block; }
.period-inline .form-type-checkbox { display:inline-flex; align-items:center; margin:0; }
.period-inline .form-type-checkbox label { margin:0 0 0 6px; }

.professional-table .form-radios {
  display: flex;
  flex-wrap: wrap;      /* wrap on small screens */
  gap: 18px;
  justify-content: left; /* optional: center like your screenshot */
  margin: 0;
}
.pro-label{
  width: 220px;
  background: #f1f1f1;
  border-top: 1px solid #ddd;
  border-right: 1px solid #ddd;
  padding: 10px;
}
.pro-label-top{ vertical-align: top; }

.pro-field{
  border-top: 1px solid #ddd;
  padding: 10px;
}
.pro-date{ width: 240px; }
.pro-tilde{
  width: 40px;
  text-align: center;
  border-top: 1px solid #ddd;
  padding: 10px;
}
.pro-present{
  width: 120px;
  text-align: center;
  border-top: 1px solid #ddd;
  padding: 10px;
}

.pro-head-cell{
  background: #eee;
  padding: 10px;
  position: relative;
}
.pro-trash-wrap{ position:absolute; right:10px; top:8px; }

.pro-trash-btn{
  width: 26px;
  height: 26px;
  border: 0;
  background: transparent;
  color: #d00;
  cursor: pointer;
}
.pro-trash-btn::before{
  content: "🗑";
  font-size: 18px;
  line-height: 26px;
}

.professional-position-radios .form-radios{
  display:flex;
  flex-wrap:wrap;
  gap: 18px 28px;
  align-items:center;
}
.professional-position-radios .js-form-type-radio{
  margin: 0;
}

.pro-add-btn{
  background:#b13b2e;
  color:#fff;
  padding:8px 18px;
}

.decl-yn-inline .form-item { margin: 0 !important; }
.decl-yn-inline label { margin: 0 0 0 4px; }
.decl-yn-inline .form-type-radio { display: inline-flex; align-items: center; }
/* Radios inline */
#professional-wrapper .form-item {
  margin: 0 !important;
}

#professional-wrapper .form-type-radio {
  display: inline-flex;
  align-items: center;
  margin-right: 18px;
}

#professional-wrapper label {
  margin-left: 4px;
}

/* Period inline */
.professional-period-inline {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.professional-period-inline .form-item {
  margin: 0 !important;
}

.period-separator {
  padding: 0 4px;
}
.light-bg {
  background-color: #f5f5f5 !important;
}

#professional-wrapper .form-item { margin:0 !important; }
#professional-wrapper .form-type-radio { display:inline-flex; align-items:center; margin-right:18px; }
#professional-wrapper label { margin-left:4px; }

.professional-period-inline { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.professional-period-inline .form-item { margin:0 !important; }
.period-separator { padding:0 4px; }
/* Make radio options flow nicely like your HTML mock */
#professional-wrapper .form-radios {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
#professional-wrapper .form-radios .form-item {
  margin: 0;
}

/* Optional: encourage 2 lines (4 items on first row, 3 on second) */
@media (min-width: 900px) {
  #professional-wrapper .form-radios .form-item {
    width: calc((100% - 18px * 3) / 4); /* 4 per row */
  }
}

/* Put From ~ To + checkbox in one line */
.professional-period-inline{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
}

.professional-period-inline .form-item{
  margin:0;                 /* remove default block spacing */
}

.professional-period-inline input[type="date"]{
  width: 170px;             /* adjust as needed */
}

.professional-period-sep{
  display:inline-block;
  padding:0 4px;
}

.professional-period-wrapper {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* EPSP Reveal modal styling */
.reveal.epsp-reveal {
  padding: 0;
  border-radius: 10px;
  border: 1px solid #e6e6e6;
  box-shadow: 0 10px 30px rgba(0,0,0,.18);
  overflow: hidden;
  max-width: 720px;
}

.epsp-reveal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  background: #f8f8f8;
  border-bottom: 1px solid #e6e6e6;
}

.epsp-reveal__title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.epsp-reveal__icon {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #f6a623; /* warning-ish */
  color: #fff;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
}

.epsp-reveal__close {
  position: static;
  padding: 6px 10px;
  line-height: 1;
  font-size: 22px;
  color: #666;
}

.epsp-reveal__body {
  padding: 16px 18px 18px;
}

.epsp-reveal__lead {
  margin: 0 0 10px;
  color: #333;
  font-size: 14px;
}

.epsp-reveal__callout {
  margin: 0 0 14px;
  border-radius: 8px;
}

.epsp-reveal__list {
  margin: 0;
  padding-left: 18px;
  font-size: 14px;
  color: #222;
}

.epsp-reveal__list li {
  list-style: none;
}

.epsp-reveal__actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.epsp-reveal__actions .button {
  margin: 0;
  border-radius: 8px;
  padding: 10px 14px;
}

/* Review page answer color */
#application-review .epsp-answer,
#application-review .client-fill-value {
  color: #f57c00; /* orange */
  font-weight: 600;
  text-transform: uppercase;
}

/* Make review container full width */
#application-review.container,
#application-review .grid-container {
  max-width: 100% !important;
  width: 100% !important;
}

/* Make table expand */
#application-review table.ep-sp-table {
  width: 100% !important;
}

#review-form .confirm-page {
  width: 100% !important;
}

/* Keep APPLY SEARCH + Reset on the same line (also inside modal) */
.dashboard-filter-actions__btns {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: nowrap;
}

.dashboard-filter-actions__btns .button,
.dashboard-filter-actions__btns input.button {
  margin: 0;
  width: auto;
  display: inline-flex;
}