/* ===============================
   Employment Form – 2 Column Layout
   =============================== */

.employment {display: grid; gap: 18px;}

/* Desktop layout */
@media (min-width: 800px) {
  .employment { grid-template-columns: 1fr 1fr;}

  /* Make section headings full width */
  .employment h3 {grid-column: 1 / -1; margin-top: 20px;}

  /* Rates table full width */
  .employment table {grid-column: 1 / -1;}

  /* About textarea full width */
  .employment textarea {min-height: 140px;}

  /* Fieldsets full width */
  .employment fieldset { grid-column: 1 / -1;}

  /* Small explanatory text full width */
  .employment small {grid-column: 1 / -1; }

  /* Disclaimer full width */
  .employment > div:last-of-type, .employment > div:nth-last-of-type(2) { grid-column: 1 / -1;}
}
@media (min-width: 1200px) {
  .employment {grid-template-columns: 1fr 1fr; column-gap: 40px;}
}

.employment label {display:block; margin-bottom:15px;}
.employment select[name=selfie_publish],.employment select[name=video_publish] {margin-top:5px;}
.employment label.chip {font-size: 13px; color: var(--muted); display:inline-flex; margin-bottom:5px;}
.employment table {width:100%; border-collapse: collapse; max-width:500px;}
.employment table td,.employment table th {
   padding: 5px 10px;border: 1px solid var(--line); background: rgba(255, 255, 255, .06);font-size: 13px;color: var(--muted);
   font-weight: normal;
}
.employment table label {margin:0;}
.employment table input {background:transparent; border:0; padding:5px;}
.employment table th:empty {background: none; border: none;}
input[type="date"]::-webkit-calendar-picker-indicator {opacity: 0;position: absolute;right: 10px;width: 24px;height: 24px;cursor: pointer;}

input[type="date"] {
  background-image: url("../icons/calendar.svg"); position: relative;
  background-repeat: no-repeat;background-position: right 12px center;background-size: 18px;padding-right: 40px;
}


.duo-box{
  position:absolute; top:calc(100% + 6px); left:0; width:100%; display:none; border: 1px solid var(--line); background:#111;
  max-height:260px;overflow:auto;z-index:9999;
}
.duo-box::-webkit-scrollbar {width:12px;}
.duo-box::-webkit-scrollbar-thumb {background: rgba(255,255,255,.18); border-radius: 10px; border: 3px solid transparent; background-clip: padding-box;}
.duo-item{ padding:10px 12px; cursor:pointer; }
.duo-item:hover{ background:rgba(255,255,255,.06); }

.duo-wrap{ position:relative; width:100%; }
.duo-selected{display:flex;flex-wrap:wrap;gap:8px; align-items: center; margin-top: 12px;}
.duo-chip {
   display:inline-flex; align-items:center; gap:8px; padding:6px 10px; font-size:14px; border-radius: 12px;
   border: 1px solid var(--line); background: rgba(255, 255, 255, .06);
}
.duo-remove{border:0; background:none; cursor:pointer; font-weight:700; line-height:1; padding:0 2px;color:#f97b02;}


.sendingOverlay{
    position:fixed; inset:0; z-index:99999;
    background:rgba(0,0,0,.55);
    display:none;
    align-items:center;
    justify-content:center;
    padding:24px;
  }
  .sendingOverlay.isOn{ display:flex; }
  .sendingCard{
    background:#0b1220;
    color:#fff;
    border-radius:16px;
    padding:18px 18px;
    width:min(520px, 92vw);
    box-shadow:0 18px 60px rgba(0,0,0,.35);
    font-family:system-ui, -apple-system, Segoe UI, Roboto, Arial;
  }
  .sendingTitle{ font-weight:800; font-size:18px; margin:0 0 6px; }
  .sendingText{ opacity:.85; margin:0; line-height:1.4; font-size:14px; }


#uploadSizeMsgContainer {display:none; position:fixed;top:0;left:0; width:100vw; height:100vh; justify-content:center; align-items:center; background:rgba(11, 11, 14, .88); backdrop-filter:blur(10px);}
#uploadSizeMsg {padding: 16px; border-radius: 16px; background: rgba(255, 255, 255, 0.08); color: #fff;}
