/* ===============================
   CAWFA Talent Profile Edit (tpfe-*)
   Corporate Dark + Red | FULL CSS (no cropper)
=============================== */

/* Tokens */
:root{
  --tpfe-red-1:#D90404;
  --tpfe-red-2:#730707;
  --tpfe-focus:0 0 0 3px rgba(217,4,4,.35);
}

/* Card / Layout */
.tpfe-card{
  background:#121212;border:1px solid #222;border-radius:16px;
  box-shadow:0 10px 30px rgba(0,0,0,.35);color:#fff;
}
.tpfe-card .row.g-3 > [class*="col-"]{display:flex;flex-direction:column}

/* Headings */
.tpfe-title{font-weight:700;font-size:1.5rem;color:#fff;line-height:1.2}
.tpfe-subtitle{font-size:.95rem;color:#d3d3d3}

/* Labels */
.tpfe-label{display:block;font-weight:600;margin-bottom:.35rem;color:#fff}

/* Form controls */
.tpfe-input,.tpfe-select,.selectpicker,.bootstrap-select .dropdown-toggle{
  background:#1b1b1b;border:1px solid #2b2b2b;color:#fff;width:100%;
  display:block;border-radius:10px;padding:.65rem .75rem;line-height:1.25
}
.tpfe-input::placeholder{color:#8f8f8f}
.tpfe-input:disabled,.tpfe-select:disabled,
.bootstrap-select .dropdown-toggle.disabled{
  background:#191919;color:#777
}
.tpfe-input:focus,.tpfe-select:focus,.selectpicker:focus,
.bootstrap-select .dropdown-toggle:focus,.bootstrap-select .dropdown-toggle:active{
  border-color:var(--tpfe-red-1);
  box-shadow:0 0 0 3px rgba(217,4,4,.18);
  outline:none
}

/* Input-group */
.input-group .tpfe-icon,.input-group .input-group-text.tpfe-icon{
  background:#1b1b1b;border:1px solid #2b2b2b;color:#fff;
  border-right:0;border-radius:10px 0 0 10px
}
.input-group .tpfe-input.form-control{
  border-left:0;border-radius:0 10px 10px 0
}
.input-group .form-control:focus + .input-group-text,
.input-group .input-group-text:has(+ .form-control:focus){
  border-color:var(--tpfe-red-1)
}

/* Previews (fixed sizes for layout stability) */
:root{
  --tpfe-prof-size:240px;
  --tpfe-cover-h:180px;
}
#tpfe-profile-preview{
  width:100%;max-width:var(--tpfe-prof-size);height:var(--tpfe-prof-size);
  aspect-ratio:1/1;object-fit:cover;object-position:center;display:block;
  margin:.5rem auto 0;border-radius:10px;border:1px solid #2b2b2b;background:#0f0f0f;
}
#tpfe-cover-preview{
  width:100%;height:var(--tpfe-cover-h);object-fit:cover;object-position:center;
  display:block;margin-top:.5rem;border-radius:10px;border:1px solid #2b2b2b;background:#0f0f0f;
}
@media (max-width:1199.98px){
  :root{ --tpfe-prof-size:220px; --tpfe-cover-h:170px; }
}
@media (max-width:991.98px){
  :root{ --tpfe-prof-size:200px; --tpfe-cover-h:160px; }
}
@media (max-width:575.98px){
  :root{ --tpfe-prof-size:170px; --tpfe-cover-h:150px; }
}

/* Buttons – solid primary */
.tpfe-btn{
  border-radius:12px;padding:.7rem 1.2rem;font-weight:700;color:#fff;
  background:linear-gradient(180deg,var(--tpfe-red-1) 0%,var(--tpfe-red-2) 100%);
  border:0;cursor:pointer;user-select:none;
  transition:transform .08s ease, box-shadow .18s ease,
             filter .18s ease, opacity .18s ease;
}
.tpfe-btn i{vertical-align:middle}
.tpfe-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(217,4,4,.28);
  filter:brightness(1.03)
}
.tpfe-btn:active{
  transform:translateY(0);
  filter:brightness(.96);
  box-shadow:0 2px 10px rgba(0,0,0,.35)
}
.tpfe-btn:focus-visible{
  box-shadow:var(--tpfe-focus),0 6px 18px rgba(217,4,4,.22)
}
.tpfe-btn[disabled],.tpfe-btn.disabled{
  opacity:.55;cursor:not-allowed;
  filter:grayscale(15%) brightness(.9);
  box-shadow:none;transform:none
}

/* Buttons – outline secondary (Refresh / Next) */
.tpfe-btn-outline{
  border-radius:12px;padding:.7rem 1.2rem;font-weight:700;color:#fff;
  background:transparent;border:1px solid var(--tpfe-red-1);
  cursor:pointer;user-select:none;
  transition:transform .08s ease, box-shadow .18s ease,
             filter .18s ease, opacity .18s ease, background .18s ease;
}
.tpfe-btn-outline i{vertical-align:middle}
.tpfe-btn-outline:hover{
  background:rgba(217,4,4,.1);
  box-shadow:0 6px 18px rgba(0,0,0,.35);
  transform:translateY(-1px);
}
.tpfe-btn-outline:active{
  transform:translateY(0);
  box-shadow:0 2px 10px rgba(0,0,0,.35);
}
.tpfe-btn-outline:focus-visible{
  box-shadow:var(--tpfe-focus);
}
.tpfe-btn-outline[disabled],.tpfe-btn-outline.disabled{
  opacity:.55;cursor:not-allowed;box-shadow:none;transform:none;
}

/* Button row alignment */
.tpfe-btn-row{
  gap:.5rem;
}

/* Helper text */
.text-bottom{color:#9a9a9a;font-size:.9rem}

/* Bootstrap-select */
.bootstrap-select,.bootstrap-select .dropdown-toggle{
  width:100%!important
}
.bootstrap-select .dropdown-menu{
  background:#1b1b1b;border:1px solid #2b2b2b;
  box-shadow:0 12px 24px rgba(0,0,0,.45)
}
.bootstrap-select .dropdown-item{color:#fff}
.bootstrap-select .dropdown-item.active,
.bootstrap-select .dropdown-item:active,
.bootstrap-select .dropdown-item:hover{
  background:rgba(217,4,4,.16);color:#fff
}

/* Alerts / Flash */
.tpfe-flash{transition:opacity .4s ease}
.alert-success.tpfe-flash,.alert-success.tpfe-toast{
  background:rgba(0,158,71,.15);
  border:1px solid rgba(0,158,71,.35);
  color:#c9f7dd
}
.alert-danger.tpfe-flash,.alert-danger.tpfe-toast{
  background:rgba(217,4,4,.15);
  border:1px solid rgba(217,4,4,.35);
  color:#ffd7d7
}

/* Username inline error */
.tpfe-username-err{color:#ff9c9c;font-size:.875rem}

/* Toast */
.tpfe-toast{
  position:fixed;right:16px;bottom:16px;z-index:1060;min-width:280px;
  backdrop-filter:blur(6px);border-radius:12px
}

/* Global focus */
.tpfe-input:focus-visible,.tpfe-select:focus-visible,
.bootstrap-select .dropdown-toggle:focus-visible,.tpfe-btn:focus-visible,
.tpfe-btn-outline:focus-visible,.btn:focus-visible,
.form-control:focus-visible{
  outline:none;box-shadow:var(--tpfe-focus)
}

/* File input (webkit) */
input[type="file"].tpfe-input::-webkit-file-upload-button{
  background:#202020;border:1px solid #2b2b2b;color:#fff;border-radius:8px;
  padding:.45rem .8rem;margin-right:.6rem;cursor:pointer
}
input[type="file"].tpfe-input::-webkit-file-upload-button:hover{
  border-color:#3b3b3b
}

/* Alerts dark override */
.alert{border-radius:12px;color:#fff}
.alert-info{
  background:rgba(100,149,237,.18);
  border:1px solid rgba(100,149,237,.35)
}

/* Crisp images */
img{image-rendering:-webkit-optimize-contrast}