/* ==========================================================
   RQL PUBLIC PROFESSIONAL PROFILE
   ========================================================== */

.rql-profile {
  --profile-primary: #116f6b;
  --profile-primary-deep: #0b4050;
  --profile-primary-soft: #eaf7f4;
  --profile-accent: #c89a39;
  --profile-hero-start: #092f48;
  --profile-hero-end: #176c70;
  --profile-text: #244b5a;
  --profile-muted: #667e88;
  --profile-border: #d7e4e7;
  --profile-surface: #ffffff;
  --profile-surface-soft: #f6f9fa;
  --profile-shadow: 0 12px 34px rgba(14, 52, 67, .075);

  color: var(--profile-text);
  margin: 0 auto;
  max-width: 1240px;
  padding: 18px 0 50px;
}

.rql-profile[data-theme="executive"] {
  --profile-primary: #244e78;
  --profile-primary-deep: #122d4d;
  --profile-primary-soft: #edf3fa;
  --profile-accent: #7893ad;
  --profile-hero-start: #101f36;
  --profile-hero-end: #294e73;
  --profile-text: #253f58;
  --profile-muted: #687b8d;
  --profile-border: #d6e0e9;
}

.rql-profile[data-theme="slate"] {
  --profile-primary: #685a3d;
  --profile-primary-deep: #343b43;
  --profile-primary-soft: #f7f3e9;
  --profile-accent: #c49a3a;
  --profile-hero-start: #303943;
  --profile-hero-end: #62604f;
  --profile-text: #3f4a52;
  --profile-muted: #747c80;
  --profile-border: #e1ded5;
}

.rql-profile * {
  box-sizing: border-box;
}

.rql-profile a {
  color: var(--profile-primary);
}

.rql-profile-hero {
  background:
    radial-gradient(
      circle at 90% 4%,
      rgba(255, 255, 255, .13),
      transparent 28%
    ),
    linear-gradient(
      135deg,
      var(--profile-hero-start),
      var(--profile-hero-end)
    );
  border-radius: 25px;
  box-shadow: 0 22px 55px rgba(11, 48, 67, .2);
  color: #fff;
  overflow: hidden;
  padding: 38px;
  position: relative;
}

.rql-profile-hero-pattern {
  background:
    linear-gradient(
      90deg,
      rgba(255, 255, 255, .035) 1px,
      transparent 1px
    ),
    linear-gradient(
      rgba(255, 255, 255, .035) 1px,
      transparent 1px
    );
  background-size: 36px 36px;
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.rql-profile-hero-content {
  align-items: center;
  display: grid;
  gap: 27px;
  grid-template-columns:
    auto
    minmax(0, 1fr)
    minmax(210px, 265px);
  position: relative;
  z-index: 1;
}

.rql-profile-avatar-wrap {
  flex: 0 0 auto;
  position: relative;
}

.rql-profile-avatar {
  background: #eef7f5;
  border: 5px solid rgba(255, 255, 255, .34);
  border-radius: 50%;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .18);
  height: 152px;
  object-fit: cover;
  width: 152px;
}

.rql-profile-avatar-fallback {
  align-items: center;
  color: var(--profile-primary);
  display: flex;
  font-size: 2.55rem;
  font-weight: 900;
  justify-content: center;
}

.rql-profile-presence {
  background: #44c7a9;
  border: 4px solid var(--profile-hero-end);
  border-radius: 50%;
  bottom: 10px;
  height: 23px;
  position: absolute;
  right: 9px;
  width: 23px;
}

.rql-profile-eyebrow {
  color: #bcebe3;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.rql-profile-identity h1 {
  color: #fff;
  font-size: clamp(2.15rem, 4vw, 3.45rem);
  line-height: 1.08;
  margin: 8px 0 0;
  overflow-wrap: anywhere;
}

.rql-profile-specialization {
  color: #fff;
  font-size: 1.05rem;
  font-weight: 760;
  line-height: 1.5;
  margin: 11px 0 0;
}

.rql-profile-affiliation {
  color: #dcebef;
  line-height: 1.55;
  margin: 4px 0 0;
}

.rql-profile-identity-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 17px;
}

.rql-profile-identity-meta a,
.rql-profile-identity-meta span {
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;
  color: #edf8f7;
  font-size: .75rem;
  padding: 7px 10px;
  text-decoration: none;
}

.rql-profile-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 19px;
}

.rql-profile-btn {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  display: inline-flex;
  font-size: .82rem;
  font-weight: 850;
  justify-content: center;
  line-height: 1.25;
  min-height: 42px;
  padding: 10px 15px;
  text-decoration: none;
  transition:
    transform .16s ease,
    box-shadow .16s ease,
    border-color .16s ease;
}

.rql-profile-btn:hover {
  transform: translateY(-1px);
}

.rql-profile-btn-primary {
  background: var(--profile-primary);
  box-shadow: 0 7px 18px rgba(9, 57, 69, .14);
  color: #fff !important;
}

.rql-profile-hero .rql-profile-btn-primary {
  background: #fff;
  color: var(--profile-primary-deep) !important;
}

.rql-profile-btn-secondary {
  background: transparent;
  border-color: var(--profile-border);
  color: var(--profile-primary) !important;
}

.rql-profile-hero .rql-profile-btn-secondary {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .27);
  color: #fff !important;
}

.rql-profile-hero-reputation {
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 17px;
  padding: 21px;
  text-align: center;
}

.rql-profile-reputation-label {
  color: #c8e9e4;
  display: block;
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.rql-profile-hero-reputation > strong {
  color: #fff;
  display: block;
  font-size: 2.6rem;
  line-height: 1;
  margin-top: 12px;
}

.rql-profile-hero-reputation > span:last-of-type {
  color: #d8e9ec;
  display: block;
  font-size: .77rem;
  margin-top: 5px;
}

.rql-profile-reputation-mini {
  border-top: 1px solid rgba(255, 255, 255, .17);
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
  margin-top: 17px;
  padding-top: 15px;
}

.rql-profile-reputation-mini strong,
.rql-profile-reputation-mini span {
  display: block;
}

.rql-profile-reputation-mini strong {
  color: #fff;
}

.rql-profile-reputation-mini span {
  color: #cfdee2;
  font-size: .68rem;
  margin-top: 3px;
}

.rql-profile-stat-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 19px;
}

.rql-profile-stat {
  align-items: center;
  background: var(--profile-surface);
  border: 1px solid var(--profile-border);
  border-radius: 15px;
  box-shadow: var(--profile-shadow);
  display: flex;
  gap: 13px;
  padding: 18px;
}

.rql-profile-stat-icon {
  align-items: center;
  background: var(--profile-primary-soft);
  border-radius: 11px;
  color: var(--profile-primary);
  display: flex;
  flex: 0 0 auto;
  font-weight: 900;
  height: 43px;
  justify-content: center;
  width: 43px;
}

.rql-profile-stat strong,
.rql-profile-stat span {
  display: block;
}

.rql-profile-stat strong {
  color: var(--profile-primary-deep);
  font-size: 1.28rem;
}

.rql-profile-stat span {
  color: var(--profile-muted);
  font-size: .75rem;
  margin-top: 2px;
}

.rql-profile-layout {
  align-items: start;
  display: grid;
  gap: 20px;
  grid-template-columns:
    minmax(245px, 305px)
    minmax(0, 1fr);
  margin-top: 20px;
}

.rql-profile-sidebar {
  display: grid;
  gap: 16px;
  position: sticky;
  top: 20px;
}

.rql-profile-side-card,
.rql-profile-section,
.rql-profile-content-card,
.rql-profile-record,
.rql-profile-empty {
  background: var(--profile-surface);
  border: 1px solid var(--profile-border);
  box-shadow: var(--profile-shadow);
}

.rql-profile-side-card {
  border-radius: 17px;
  padding: 20px;
}

.rql-profile-side-card h2 {
  color: var(--profile-primary-deep);
  font-size: 1rem;
  margin: 0;
}

.rql-profile-bio {
  color: var(--profile-text);
  font-size: .87rem;
  line-height: 1.75;
  margin: 13px 0 0;
  white-space: pre-wrap;
}

.rql-profile-empty-text {
  color: var(--profile-muted);
  font-size: .84rem;
  line-height: 1.65;
}

.rql-profile-facts {
  margin: 16px 0 0;
}

.rql-profile-facts > div {
  border-top: 1px solid var(--profile-border);
  padding: 11px 0;
}

.rql-profile-facts > div:first-child {
  border-top: 0;
  padding-top: 0;
}

.rql-profile-facts dt {
  color: var(--profile-muted);
  font-size: .67rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.rql-profile-facts dd {
  color: var(--profile-text);
  line-height: 1.5;
  margin: 4px 0 0;
  overflow-wrap: anywhere;
}

.rql-profile-theme-intro {
  color: var(--profile-muted);
  font-size: .8rem;
  line-height: 1.55;
}

.rql-profile-theme-options {
  display: grid;
  gap: 8px;
  margin-top: 13px;
}

.rql-profile-theme-option {
  align-items: center;
  background: var(--profile-surface-soft);
  border: 1px solid var(--profile-border);
  border-radius: 11px;
  color: var(--profile-text);
  cursor: pointer;
  display: flex;
  gap: 11px;
  padding: 10px;
  text-align: left;
  width: 100%;
}

.rql-profile-theme-option[aria-pressed="true"] {
  background: var(--profile-primary-soft);
  border-color: var(--profile-primary);
  box-shadow: 0 0 0 2px color-mix(
    in srgb,
    var(--profile-primary) 15%,
    transparent
  );
}

.rql-profile-theme-option strong,
.rql-profile-theme-option small {
  display: block;
}

.rql-profile-theme-option strong {
  color: var(--profile-primary-deep);
  font-size: .78rem;
}

.rql-profile-theme-option small {
  color: var(--profile-muted);
  font-size: .67rem;
  margin-top: 2px;
}

.rql-theme-preview {
  border: 2px solid rgba(255, 255, 255, .8);
  border-radius: 50%;
  box-shadow: 0 0 0 1px var(--profile-border);
  flex: 0 0 auto;
  height: 25px;
  width: 25px;
}

.rql-theme-preview-scholar {
  background: linear-gradient(135deg, #0c4152, #198277);
}

.rql-theme-preview-executive {
  background: linear-gradient(135deg, #13233d, #365d84);
}

.rql-theme-preview-slate {
  background: linear-gradient(135deg, #323b44, #b18c3b);
}

.rql-profile-progress-list {
  margin-top: 13px;
}

.rql-profile-progress-list > div {
  align-items: center;
  border-top: 1px solid var(--profile-border);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 10px 0;
}

.rql-profile-progress-list > div:first-child {
  border-top: 0;
}

.rql-profile-progress-list span {
  color: var(--profile-muted);
  font-size: .76rem;
}

.rql-profile-progress-list strong {
  color: var(--profile-primary);
}

.rql-profile-main {
  min-width: 0;
}

.rql-profile-tabs {
  background: var(--profile-surface);
  border: 1px solid var(--profile-border);
  border-radius: 15px;
  box-shadow: var(--profile-shadow);
  display: flex;
  gap: 5px;
  overflow-x: auto;
  padding: 7px;
  scrollbar-width: thin;
}

.rql-profile-tabs a {
  border-radius: 9px;
  color: var(--profile-muted);
  flex: 0 0 auto;
  font-size: .76rem;
  font-weight: 800;
  padding: 9px 12px;
  text-decoration: none;
}

.rql-profile-tabs a:hover {
  background: var(--profile-surface-soft);
  color: var(--profile-primary);
}

.rql-profile-tabs a.active {
  background: var(--profile-primary);
  color: #fff;
}

.rql-profile-tab-content {
  margin-top: 16px;
}

.rql-profile-section {
  border-radius: 18px;
  padding: 25px;
}

.rql-profile-section-heading > span {
  color: var(--profile-primary);
  display: block;
  font-size: .69rem;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.rql-profile-section-heading h2 {
  color: var(--profile-primary-deep);
  line-height: 1.3;
  margin: 5px 0 0;
}

.rql-profile-section-heading p {
  color: var(--profile-muted);
  line-height: 1.65;
}

.rql-profile-overview-grid,
.rql-profile-interaction-grid {
  display: grid;
  gap: 15px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 19px;
}

.rql-profile-content-card {
  border-radius: 14px;
  padding: 19px;
}

.rql-profile-content-card h3 {
  color: var(--profile-primary-deep);
  margin: 0;
}

.rql-profile-long-text {
  color: var(--profile-text);
  line-height: 1.75;
  margin-bottom: 0;
  white-space: pre-wrap;
}

.rql-profile-snapshot-list {
  margin-top: 11px;
}

.rql-profile-snapshot-list > div {
  align-items: center;
  border-top: 1px solid var(--profile-border);
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding: 9px 0;
}

.rql-profile-snapshot-list > div:first-child {
  border-top: 0;
}

.rql-profile-snapshot-list span {
  color: var(--profile-muted);
  font-size: .78rem;
}

.rql-profile-snapshot-list strong {
  color: var(--profile-primary);
}

.rql-profile-skill-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 13px;
}

.rql-profile-skill-cloud span {
  background: var(--profile-primary-soft);
  border: 1px solid var(--profile-border);
  border-radius: 999px;
  color: var(--profile-primary);
  font-size: .75rem;
  padding: 7px 10px;
}

.rql-profile-record-list {
  display: grid;
  gap: 13px;
  margin-top: 19px;
}

.rql-profile-record {
  align-items: flex-start;
  border-radius: 14px;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 19px;
}

.rql-profile-record-main {
  min-width: 0;
}

.rql-profile-record-type {
  color: var(--profile-primary);
  display: block;
  font-size: .65rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.rql-profile-record h3 {
  color: var(--profile-primary-deep);
  line-height: 1.4;
  margin: 6px 0 0;
  overflow-wrap: anywhere;
}

.rql-profile-record h3 a {
  color: inherit;
  text-decoration: none;
}

.rql-profile-record h3 a:hover {
  color: var(--profile-primary);
}

.rql-profile-record p {
  color: var(--profile-muted);
  line-height: 1.6;
}

.rql-profile-record-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.rql-profile-record-meta span {
  background: var(--profile-surface-soft);
  border: 1px solid var(--profile-border);
  border-radius: 7px;
  color: var(--profile-muted);
  font-size: .69rem;
  padding: 6px 8px;
}

.rql-profile-record-actions {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 7px;
}

.rql-profile-empty {
  border-radius: 14px;
  color: var(--profile-muted);
  line-height: 1.65;
  margin-top: 18px;
  padding: 28px;
  text-align: center;
}

.rql-profile-empty strong {
  color: var(--profile-primary-deep);
  display: block;
}

.rql-profile-empty p {
  margin-bottom: 0;
}

.rql-profile-stat-strip {
  display: grid;
  gap: 11px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 19px;
}

.rql-profile-stat-strip > div {
  background: var(--profile-surface-soft);
  border: 1px solid var(--profile-border);
  border-radius: 12px;
  padding: 16px;
}

.rql-profile-stat-strip strong,
.rql-profile-stat-strip span {
  display: block;
}

.rql-profile-stat-strip strong {
  color: var(--profile-primary);
  font-size: 1.35rem;
}

.rql-profile-stat-strip span {
  color: var(--profile-muted);
  font-size: .72rem;
  margin-top: 3px;
}

.rql-profile-badge-grid {
  display: grid;
  gap: 13px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 19px;
}

.rql-profile-badge-card {
  align-items: center;
  background: var(--profile-surface-soft);
  border: 1px solid var(--profile-border);
  border-radius: 14px;
  display: flex;
  gap: 13px;
  padding: 16px;
}

.rql-profile-badge-symbol {
  align-items: center;
  background: var(--profile-primary-soft);
  border-radius: 50%;
  color: var(--profile-accent);
  display: flex;
  flex: 0 0 auto;
  font-size: 1.25rem;
  height: 45px;
  justify-content: center;
  width: 45px;
}

.rql-profile-badge-card h3 {
  color: var(--profile-primary-deep);
  font-size: .9rem;
  margin: 0;
}

.rql-profile-badge-card p {
  color: var(--profile-muted);
  font-size: .7rem;
  margin: 4px 0 0;
}

.rql-profile-reputation-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 19px;
}

.rql-profile-reputation-card {
  background: var(--profile-surface-soft);
  border: 1px solid var(--profile-border);
  border-radius: 13px;
  padding: 17px;
}

.rql-profile-reputation-card strong,
.rql-profile-reputation-card span {
  display: block;
}

.rql-profile-reputation-card strong {
  color: var(--profile-primary);
  font-size: 1.45rem;
}

.rql-profile-reputation-card span {
  color: var(--profile-muted);
  font-size: .69rem;
  line-height: 1.45;
  margin-top: 4px;
}

.rql-profile-form {
  margin-top: 15px;
}

.rql-profile-form-field {
  margin-top: 13px;
}

.rql-profile-form-field:first-of-type {
  margin-top: 0;
}

.rql-profile-form-field label {
  color: var(--profile-text);
  display: block;
  font-size: .78rem;
  font-weight: 820;
  margin-bottom: 6px;
}

.rql-profile-form-field input,
.rql-profile-form-field select,
.rql-profile-form-field textarea {
  background: #fff;
  border: 1px solid var(--profile-border);
  border-radius: 9px;
  color: var(--profile-text);
  font: inherit;
  padding: 10px 11px;
  width: 100%;
}

.rql-profile-form-field textarea {
  min-height: 105px;
  resize: vertical;
}

.rql-profile-form .rql-profile-btn {
  margin-top: 14px;
}

@media (max-width: 1050px) {
  .rql-profile-hero-content {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .rql-profile-hero-reputation {
    grid-column: 1 / -1;
  }

  .rql-profile-reputation-grid {
    grid-template-columns:
      repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .rql-profile-layout {
    grid-template-columns: 1fr;
  }

  .rql-profile-sidebar {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
    position: static;
  }

  .rql-profile-side-card:first-child {
    grid-column: 1 / -1;
  }

  .rql-profile-stat-grid {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .rql-profile {
    padding-top: 5px;
  }

  .rql-profile-hero {
    border-radius: 19px;
    padding: 27px 20px;
  }

  .rql-profile-hero-content {
    display: block;
  }

  .rql-profile-avatar {
    height: 120px;
    width: 120px;
  }

  .rql-profile-identity {
    margin-top: 18px;
  }

  .rql-profile-hero-reputation {
    margin-top: 20px;
  }

  .rql-profile-sidebar,
  .rql-profile-stat-grid,
  .rql-profile-overview-grid,
  .rql-profile-interaction-grid,
  .rql-profile-badge-grid,
  .rql-profile-stat-strip,
  .rql-profile-reputation-grid {
    grid-template-columns: 1fr;
  }

  .rql-profile-side-card:first-child {
    grid-column: auto;
  }

  .rql-profile-section {
    padding: 20px;
  }

  .rql-profile-record {
    display: block;
  }

  .rql-profile-record-actions {
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 15px;
  }
}