/* Fortuna Student Portal — Public CSS (V3) */

/* =========================================================================
   v6.7.13 — Self-hosted Montserrat (root cause fix)
   Until now the portal relied ONLY on the Google Fonts CDN. If the CDN was
   blocked (privacy plugins, offline, GDPR setups) or the active theme applied
   its own font-family with higher specificity, 'Montserrat' silently fell
   back to the theme/system font — exactly the broken look from the report.
   These @font-face rules load the Montserrat files already bundled in
   /assets/fonts so the portal renders correctly with no external dependency.
   Path is relative to this file: public/css/ -> ../../assets/fonts/
   ========================================================================= */
@font-face {
  font-family: 'Montserrat';
  font-style: normal; font-weight: 400; font-display: swap;
  src: url('../../assets/fonts/Montserrat-Regular.ttf') format('truetype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal; font-weight: 500; font-display: swap;
  src: url('../../assets/fonts/Montserrat-Medium.ttf') format('truetype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal; font-weight: 600; font-display: swap;
  src: url('../../assets/fonts/Montserrat-SemiBold.ttf') format('truetype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal; font-weight: 700; font-display: swap;
  src: url('../../assets/fonts/Montserrat-Bold.ttf') format('truetype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal; font-weight: 800; font-display: swap;
  src: url('../../assets/fonts/Montserrat-ExtraBold.ttf') format('truetype');
}

/* v6.7.13 — pin Montserrat across the portal so the active theme cannot
   override it. We scope to the portal wrapper and re-assert on the tags
   themes most often restyle (headings, links, buttons, inputs). Intentional
   monospace elements are restored to monospace right after. */
.fcm-portal-wrap,
.fcm-portal-wrap h1, .fcm-portal-wrap h2, .fcm-portal-wrap h3,
.fcm-portal-wrap h4, .fcm-portal-wrap p,  .fcm-portal-wrap span,
.fcm-portal-wrap a,  .fcm-portal-wrap div, .fcm-portal-wrap button,
.fcm-portal-wrap input, .fcm-portal-wrap label {
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}
/* keep deliberately-monospaced text monospaced */
.fcm-portal-wrap .fcm-portal-cert-num,
.fcm-portal-wrap .fcm-reveal-text {
  font-family: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace !important;
}

.fcm-portal-wrap {
  font-family: 'Montserrat', -apple-system, sans-serif;
  max-width: 820px; margin: 0 auto; padding: 0 16px 40px;
}
.fcm-portal-login-card {
  background: #fff; border-radius: 16px; box-shadow: 0 4px 32px rgba(0,0,0,.1);
  padding: 48px 40px; text-align: center; max-width: 420px; margin: 40px auto;
}
.fcm-portal-logo-text { display: block; font-size: 20px; font-weight: 800; color: #810081; letter-spacing: 2px; text-transform: uppercase; }
.fcm-portal-logo-sub  { display: block; font-size: 12px; color: #aaa; letter-spacing: 3px; text-transform: uppercase; margin-top: 4px; margin-bottom: 24px; }
.fcm-portal-login-hint { font-size: 14px; color: #666; margin-bottom: 24px; }
.fcm-portal-btn {
  display: inline-flex; align-items: center; gap: 8px;
  background: #810081; color: #fff; border-radius: 10px;
  padding: 13px 28px; font-weight: 700; font-size: 14px;
  text-decoration: none; transition: background .15s;
}
.fcm-portal-btn:hover { background: #a200a2; color: #fff; }

/* Branded login */
.fcm-login-button,
.fcm-login-submit {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 0; border-radius: 12px; background: var(--fcm-brand, #810081); color: #fff;
  padding: 13px 24px; font-family: 'Montserrat', sans-serif; font-weight: 800;
  text-decoration: none; cursor: pointer; box-shadow: 0 12px 26px rgba(129,0,129,.22);
  line-height: 1.2; min-height: 44px; transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
.fcm-login-button:hover, .fcm-login-submit:hover { color:#fff; filter: brightness(1.08); transform: translateY(-1px); box-shadow: 0 16px 34px rgba(129,0,129,.26); }
.fcm-login-page { min-height: 70vh; display:flex; align-items:center; justify-content:center; padding:32px 16px; font-family:'Montserrat',sans-serif; }
.fcm-login-card {
  width: min(100%, 420px); margin: 0 auto; padding: 34px 30px;
  background: rgba(255,255,255,.96); border: 1px solid rgba(129,0,129,.12);
  border-radius: 22px; box-shadow: 0 24px 70px rgba(20,20,30,.16);
  backdrop-filter: blur(14px); font-family:'Montserrat',sans-serif;
}
.fcm-login-brand { text-align:center; margin-bottom:18px; color: var(--fcm-brand,#810081); }
.fcm-login-brand img { max-width: 150px; max-height: 72px; object-fit: contain; display:block; margin:0 auto 8px; }
.fcm-login-brand strong { display:block; font-size:22px; letter-spacing:2px; font-weight:900; }
.fcm-login-brand span { display:block; margin-top:4px; font-size:11px; text-transform:uppercase; letter-spacing:3px; color:#888; }
.fcm-login-copy { color:#666; text-align:center; font-size:14px; line-height:1.6; margin:0 0 22px; }
.fcm-login-field { margin-bottom:14px; }
.fcm-login-field label { display:block; font-size:12px; font-weight:800; color:#555; margin-bottom:7px; text-transform:uppercase; letter-spacing:.6px; }
.fcm-login-field input,
.fcm-profile-field input {
  width:100%; border:1.5px solid #e7e3ea; border-radius:12px; padding:12px 14px;
  font-family:inherit; font-size:14px; outline:none; background:#fff;
}
.fcm-login-field input:focus, .fcm-profile-field input:focus { border-color: var(--fcm-brand,#810081); box-shadow:0 0 0 3px rgba(129,0,129,.08); }
.fcm-login-row { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:4px 0 16px; font-size:12px; color:#666; }
.fcm-login-row a,
.fcm-login-link {
  color: var(--fcm-brand,#810081); text-decoration:none; font-weight:700;
  border:0; background:transparent; padding:0; font:inherit; cursor:pointer;
}
.fcm-login-error { display:none; border-radius:10px; background:#fff1f2; color:#9f1239; padding:9px 11px; font-size:12px; margin-bottom:12px; }
.fcm-login-error.is-visible { display:block; }
.fcm-login-error.is-success { background:#ecfdf5; color:#047857; }
.fcm-login-submit { width:100%; }
.fcm-login-submit:disabled { opacity:.65; cursor:wait; }
.fcm-login-secondary {
  width:100%; margin-top:10px; border:1.5px solid #eadceb; border-radius:12px; background:#fff;
  color: var(--fcm-brand,#810081); padding:12px 16px; font-family:'Montserrat',sans-serif;
  font-weight:800; cursor:pointer;
}
.fcm-login-secondary:hover { background:#fbf6fc; }
.fcm-login-modal { position:fixed; inset:0; z-index:99999; display:none; align-items:center; justify-content:center; padding:18px; }
.fcm-login-modal.is-open { display:flex; animation:fcm-fade .18s ease-out; }
.fcm-login-backdrop { position:absolute; inset:0; background:rgba(12,12,20,.52); backdrop-filter:blur(8px); }
.fcm-login-dialog { position:relative; width:min(100%,440px); transform:translateY(8px); animation:fcm-rise .2s ease-out forwards; }
.fcm-login-close {
  position:absolute; right:12px; top:12px; z-index:2; width:32px; height:32px; border:0;
  border-radius:50%; background:#f6eef7; color:#810081; font-size:22px; cursor:pointer;
}
@keyframes fcm-fade { from{opacity:0} to{opacity:1} }
@keyframes fcm-rise { to{transform:translateY(0)} }
.fcm-registry-login { margin-top: 16px; display:flex; justify-content:center; }
.fcm-registry-login .fcm-login-button { font-size: 13px; padding: 12px 20px; box-shadow: 0 10px 22px rgba(129,0,129,.18); }

/* Card */
.fcm-portal-card { background: #fff; border-radius: 16px; box-shadow: 0 4px 24px rgba(0,0,0,.08); overflow: hidden; }
.fcm-portal-card-header {
  background: #810081; padding: 24px 28px;
  display: flex; align-items: center; justify-content: space-between;
}
.fcm-portal-user-info { display: flex; align-items: center; gap: 14px; }
.fcm-portal-avatar {
  width: 48px; height: 48px; border-radius: 50%;
  background: rgba(255,255,255,.25); color: #fff;
  font-size: 18px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
}
.fcm-portal-user-name { font-size: 18px; font-weight: 700; color: #fff; }
.fcm-portal-user-sub  { font-size: 12px; color: rgba(255,255,255,.7); margin-top: 2px; }
.fcm-portal-logout { font-size: 12px; color: rgba(255,255,255,.7); text-decoration: none; padding: 6px 12px; border: 1px solid rgba(255,255,255,.3); border-radius: 6px; }
.fcm-portal-logout:hover { background: rgba(255,255,255,.1); color: #fff; }

.fcm-portal-card-body { padding: 28px; }
.fcm-portal-section-title { font-size: 16px; font-weight: 700; margin: 0 0 20px; color: #1a1a1a; }
.fcm-portal-dashboard-grid { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:24px; align-items:start; }
.fcm-portal-profile-panel { border:1px solid #eee; border-radius:14px; padding:18px; background:#fff; }
.fcm-profile-field { margin-bottom:12px; }
.fcm-profile-field label { display:block; font-size:11px; font-weight:800; color:#777; margin-bottom:6px; text-transform:uppercase; letter-spacing:.5px; }
.fcm-profile-save { width:100%; border:0; cursor:pointer; justify-content:center; }
.fcm-profile-help { margin:10px 0 0; color:#999; font-size:12px; line-height:1.5; }
#fcm-portal-profile-msg { font-size:12px; border-radius:10px; margin-bottom:12px; }
#fcm-portal-profile-msg.ok { background:#ecfdf5; color:#047857; padding:9px 10px; }
#fcm-portal-profile-msg.err { background:#fff1f2; color:#9f1239; padding:9px 10px; }

/* Loading */
.fcm-portal-loading { text-align: center; padding: 40px; color: #888; font-size: 14px; display: flex; align-items: center; justify-content: center; gap: 10px; }
.fcm-portal-spinner {
  width: 20px; height: 20px;
  border: 3px solid rgba(129,0,129,.15); border-top-color: #810081;
  border-radius: 50%; animation: fcm-spin .65s linear infinite;
}
@keyframes fcm-spin { to { transform: rotate(360deg); } }

/* Certs grid */
.fcm-portal-certs-grid { display: flex; flex-direction: column; gap: 12px; }
.fcm-portal-cert-card {
  border: 1.5px solid #f0f0f0; border-radius: 12px; padding: 16px 20px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  transition: box-shadow .15s;
}
.fcm-portal-cert-card:hover { box-shadow: 0 2px 12px rgba(129,0,129,.1); border-color: #e0c0e0; }
.fcm-portal-cert-info { flex: 1; }
.fcm-portal-cert-course { font-size: 15px; font-weight: 700; color: #1a1a1a; margin-bottom: 6px; }
.fcm-portal-cert-meta { display: flex; flex-wrap: wrap; gap: 10px; }
.fcm-portal-cert-meta span { font-size: 12px; color: #666; display: flex; align-items: center; gap: 4px; }
.fcm-portal-cert-num { font-size: 11px; font-family: monospace; background: #f5f5f7; padding: 2px 7px; border-radius: 4px; color: #810081; font-weight: 700; }
.fcm-portal-cert-actions { display: flex; gap: 8px; flex-shrink: 0; }
.fcm-portal-dl-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: #810081; color: #fff; border-radius: 8px;
  padding: 8px 16px; font-size: 13px; font-weight: 700;
  text-decoration: none; white-space: nowrap;
}
.fcm-portal-dl-btn:hover { background: #a200a2; color: #fff; }
.fcm-portal-verify-btn {
  display: inline-flex; align-items: center; gap: 5px;
  background: #f5f5f7; color: #810081; border-radius: 8px;
  padding: 8px 12px; font-size: 12px; font-weight: 600;
  text-decoration: none; white-space: nowrap; border: 1.5px solid #e5e7eb;
}
.fcm-portal-verify-btn:hover { background: #f3e5f5; color: #810081; }

/* Faza E-4: per-language download group (AZ | EN | RU) */
.fcm-portal-dl-group {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 700; color: #6b7280; white-space: nowrap;
}
.fcm-portal-dl-lang {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 34px; background: #810081; color: #fff; border-radius: 7px;
  padding: 6px 9px; font-size: 12px; font-weight: 700;
  text-decoration: none; letter-spacing: .4px;
}
.fcm-portal-dl-lang:hover { background: #a200a2; color: #fff; }

/* Badges */
.fcm-portal-grade-badge { display: inline-block; padding: 2px 10px; border-radius: 50px; font-size: 11px; font-weight: 700; }
.fcm-grade-part { background: #ede9fe; color: #4c1d95; }
.fcm-grade-comp { background: #d1fae5; color: #065f46; }
.fcm-grade-dist { background: #fef3c7; color: #78350f; }

.fcm-portal-no-student { text-align: center; padding: 48px 20px; }
.fcm-portal-no-icon { font-size: 48px; margin-bottom: 16px; }
.fcm-portal-empty { text-align: center; padding: 40px; color: #aaa; font-size: 14px; }

@media (max-width: 600px) {
  .fcm-login-modal { padding:0; align-items:stretch; }
  .fcm-login-dialog { width:100%; min-height:100%; display:flex; align-items:center; padding:18px; }
  .fcm-login-card { border-radius:20px; padding:28px 22px; }
  .fcm-login-row { align-items:flex-start; flex-direction:column; }
  .fcm-portal-card-header { flex-direction:column; align-items:flex-start; gap:14px; }
  .fcm-portal-dashboard-grid { grid-template-columns:1fr; }
  .fcm-portal-cert-card { flex-direction: column; align-items: flex-start; }
  .fcm-portal-cert-actions { width: 100%; }
  .fcm-portal-dl-btn, .fcm-portal-verify-btn { flex: 1; justify-content: center; }
}

/* v6.6.6 — login identifiers reveal + login-info section */
.fcm-reveal { display:inline-flex; align-items:center; gap:6px; }
.fcm-reveal-text { font-family:'Montserrat',monospace; letter-spacing:.5px; }
.fcm-reveal-empty { color:#bbb; }
.fcm-reveal-btn {
  border:0; background:transparent; cursor:pointer; padding:2px 4px; line-height:1;
  border-radius:6px; color:#810081; opacity:.55; transition:opacity .15s, background .15s;
  display:inline-flex; align-items:center;
}
.fcm-reveal-btn:hover { opacity:1; background:#f3e5f5; }
.fcm-reveal-btn.is-shown { opacity:1; color:#810081; }
.fcm-reveal-icon { font-size:15px; }

.fcm-login-info {
  border:1.5px solid #f0e0f0; background:#fdf7fd; border-radius:12px;
  padding:14px 16px; margin-bottom:18px;
}
.fcm-login-info-note { font-size:12px; color:#777; margin:2px 0 12px; line-height:1.5; }
.fcm-login-info-row {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:7px 0; border-bottom:1px solid #f2e8f2;
}
.fcm-login-info-row:last-child { border-bottom:0; }
.fcm-login-info-label { font-size:12px; font-weight:700; color:#810081; text-transform:uppercase; letter-spacing:.4px; }


/* ============================================================
   Portal redesign (v6.7.2) — Fortuna brand refresh
   ============================================================ */
.fcm-ico { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; }

.fcm-portal-wrap { max-width: 980px; }
.fcm-portal-card { border-radius: 22px; box-shadow: 0 18px 60px rgba(40,10,45,.12); }

/* Header — plum→magenta gradient */
.fcm-portal-card-header {
  position: relative;
  background: linear-gradient(120deg,#2d0a2e 0%,#5c005c 52%,#a200a2 100%);
  padding: 30px 34px 56px;
}
.fcm-portal-card-header::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(circle at 88% 12%, rgba(255,255,255,.16), transparent 42%);
}
.fcm-portal-user-info { position: relative; z-index: 1; gap: 16px; }
.fcm-portal-avatar {
  width: 62px; height: 62px; border-radius: 18px;
  background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.28);
  font-size: 21px; backdrop-filter: blur(4px);
}
.fcm-portal-user-name { font-size: 22px; font-weight: 800; }
.fcm-portal-user-sub { font-size: 12.5px; margin-top: 4px; }
.fcm-portal-logout {
  position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 7px;
  font-size: 12.5px; font-weight: 700; color: #fff; padding: 9px 16px;
  border: 1px solid rgba(255,255,255,.32); border-radius: 10px; transition: background .15s;
}
.fcm-portal-logout .fcm-ico { width: 15px; height: 15px; }

/* Stat strip — overlaps header bottom */
.fcm-portal-stats {
  position: relative; z-index: 2; margin: -38px 34px 0;
  display: grid; grid-template-columns: repeat(3,1fr); gap: 14px;
}
.fcm-portal-stats:empty { display: none; }
.fcm-portal-stat {
  background: #fff; border: 1px solid #f0ecf1; border-radius: 15px;
  box-shadow: 0 8px 26px rgba(40,10,45,.10); padding: 15px 18px;
  display: flex; align-items: center; gap: 13px;
}
.fcm-portal-stat-ico { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex: none; }
.fcm-portal-stat-ico .fcm-ico { width: 21px; height: 21px; }
.fcm-portal-stat-meta { display: flex; flex-direction: column; line-height: 1; }
.fcm-portal-stat-meta b { font-size: 22px; font-weight: 800; color: #1c1320; }
.fcm-portal-stat-meta small { font-size: 11.5px; color: #8b8192; font-weight: 600; margin-top: 4px; }
.fcm-tone-brand { background: rgba(129,0,129,.09); color: #810081; }
.fcm-tone-good { background: rgba(16,185,129,.10); color: #059669; }
.fcm-tone-gold { background: rgba(180,83,9,.10); color: #b45309; }

/* Body / section head */
.fcm-portal-card-body { padding: 24px 34px 34px; }
.fcm-portal-dashboard-grid { grid-template-columns: minmax(0,1fr) 300px; gap: 26px; }
.fcm-portal-section-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.fcm-portal-section-head .fcm-portal-section-title { margin: 0; }
.fcm-portal-section-title { font-size: 16px; font-weight: 800; }
.fcm-portal-count-badge { font-size: 11px; font-weight: 700; color: #810081; background: #f3e5f5; padding: 4px 11px; border-radius: 50px; }

/* Certificate cards */
.fcm-portal-certs-grid { gap: 13px; }
.fcm-portal-cert-card { border: 1.5px solid #f0ecf1; border-radius: 15px; padding: 16px 18px; gap: 16px; }
.fcm-portal-cert-card:hover { box-shadow: 0 10px 26px rgba(40,10,45,.10); border-color: #e6cce6; transform: translateY(-1px); }
.fcm-portal-cert-icon { width: 50px; height: 50px; border-radius: 13px; display: flex; align-items: center; justify-content: center; flex: none; color: #fff; }
.fcm-portal-cert-icon .fcm-ico { width: 24px; height: 24px; }
.fcm-cert-brand { background: linear-gradient(135deg,#a200a2,#810081); box-shadow: 0 6px 16px rgba(129,0,129,.28); }
.fcm-cert-gold { background: linear-gradient(135deg,#d97706,#b45309); box-shadow: 0 6px 16px rgba(180,83,9,.26); }
.fcm-cert-violet { background: linear-gradient(135deg,#6d28d9,#4c1d95); box-shadow: 0 6px 16px rgba(76,29,149,.24); }
.fcm-portal-cert-course { font-size: 15px; font-weight: 700; }
.fcm-portal-cert-meta { gap: 9px; margin-top: 8px; align-items: center; }
.fcm-portal-cert-date { color: #8b8192; font-weight: 500; }
.fcm-portal-cert-date .fcm-ico { width: 13px; height: 13px; margin-right: 1px; }
.fcm-portal-cert-num { font-family: monospace; background: #f5f0f6; padding: 3px 8px; border-radius: 5px; }
.fcm-portal-cert-actions { gap: 8px; }
.fcm-portal-dl-btn { gap: 6px; background: linear-gradient(135deg,#a200a2,#810081); border-radius: 9px; padding: 8px 15px; box-shadow: 0 6px 16px rgba(129,0,129,.26); }
.fcm-portal-dl-btn:hover { filter: brightness(1.07); background: linear-gradient(135deg,#a200a2,#810081); }
.fcm-portal-dl-btn .fcm-ico { width: 14px; height: 14px; }
.fcm-portal-verify-btn { gap: 5px; background: #faf6fb; border: 1.5px solid #efe2f0; border-radius: 9px; padding: 8px 13px; }
.fcm-portal-verify-btn .fcm-ico { width: 14px; height: 14px; }
.fcm-portal-grade-badge { padding: 3px 10px; font-size: 10.5px; }

/* Empty state */
.fcm-portal-empty { display: flex; flex-direction: column; align-items: center; gap: 12px; color: #a99dae; }
.fcm-empty-ico { width: 40px !important; height: 40px !important; color: #d9c7db; }

/* Right column */
.fcm-portal-profile-panel { border: 1.5px solid #f0ecf1; border-radius: 15px; padding: 17px 18px; }
.fcm-portal-profile-panel .fcm-portal-section-title { font-size: 13px; margin-bottom: 14px; }
.fcm-profile-field input { border: 1.5px solid #ece6ef; border-radius: 10px; padding: 10px 12px; }
.fcm-profile-save { border-radius: 11px; background: linear-gradient(135deg,#a200a2,#810081); box-shadow: 0 8px 20px rgba(129,0,129,.26); }
.fcm-profile-save:hover { filter: brightness(1.07); }
.fcm-login-info { border: 1.5px solid #f0e0f0; background: linear-gradient(180deg,#fdf7fd,#fbf3fb); border-radius: 15px; padding: 15px 18px; }
.fcm-login-info .fcm-portal-section-title { font-size: 13px; margin-bottom: 4px; }

@media (max-width: 600px) {
  .fcm-portal-stats { grid-template-columns: 1fr; margin: -30px 18px 0; }
  .fcm-portal-card-body { padding: 22px 18px 26px; }
  .fcm-portal-card-header { padding: 24px 20px 48px; }
}

/* Reveal eye toggle — modern line icons */
.fcm-reveal-btn .fcm-ico { width: 16px; height: 16px; stroke-width: 2; }
.fcm-reveal-btn .fcm-eye-off { display: none; }
.fcm-reveal-btn.is-shown .fcm-eye { display: none; }
.fcm-reveal-btn.is-shown .fcm-eye-off { display: inline; }
.fcm-login-info-row .fcm-reveal-btn { opacity: .6; }
.fcm-login-info-row .fcm-reveal-btn:hover { opacity: 1; }

/* v6.7.6 — certificate share buttons: uniform symmetric icon squares */
.fcm-portal-cert-share {
  display:flex; align-items:center; flex-wrap:wrap; gap:10px;
  margin-top:12px; padding-top:12px; border-top:1px solid #f0e8f0;
}
.fcm-share-label {
  font-size:11px; font-weight:700; color:#999;
  text-transform:uppercase; letter-spacing:.4px;
}
.fcm-share-row { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.fcm-share-btn {
  position:relative; box-sizing:border-box;
  width:36px; height:36px; padding:0;            /* identical square = symmetry */
  display:inline-flex; align-items:center; justify-content:center;
  border:1.5px solid #ece0ec; border-radius:10px; background:#fff;
  color:var(--fcm-brand,#810081);
  text-decoration:none; cursor:pointer; transition:all .15s ease;
}
.fcm-share-ico { width:18px; height:18px; display:block; fill:currentColor; stroke:none; }
.fcm-share-btn:hover { transform:translateY(-2px); box-shadow:0 6px 14px rgba(40,10,45,.16); }
/* brand-accurate hover colours (default state stays uniform purple for a clean grid) */
.fcm-share-li:hover, .fcm-share-liadd:hover { background:#0a66c2; color:#fff; border-color:#0a66c2; }
.fcm-share-fb:hover { background:#1877f2; color:#fff; border-color:#1877f2; }
.fcm-share-wa:hover { background:#25d366; color:#fff; border-color:#25d366; }
.fcm-share-tg:hover { background:#2aabee; color:#fff; border-color:#2aabee; }
.fcm-share-x:hover  { background:#000;     color:#fff; border-color:#000; }
.fcm-share-copy:hover { background:var(--fcm-brand,#810081); color:#fff; border-color:var(--fcm-brand,#810081); }
/* "add to LinkedIn profile" — filled accent + small + badge, same footprint */
.fcm-share-liadd { background:var(--fcm-brand,#810081); color:#fff; border-color:var(--fcm-brand,#810081); }
.fcm-share-liadd::after {
  content:"+"; position:absolute; top:-6px; right:-6px;
  width:16px; height:16px; border-radius:50%;
  background:#fff; color:var(--fcm-brand,#810081);
  font-size:11px; font-weight:900; line-height:16px; text-align:center;
  box-shadow:0 1px 4px rgba(40,10,45,.25);
}
.fcm-share-copy .fcm-share-ico { fill:none; stroke:currentColor; stroke-width:2; }
.fcm-share-copy.fcm-copied { background:#059669; color:#fff; border-color:#059669; }

/* v6.7.6 — force white labels on header logout + download (beats theme a:link colour) */
.fcm-portal-logout,
.fcm-portal-logout:link,
.fcm-portal-logout:visited,
.fcm-portal-logout:hover,
.fcm-portal-logout:focus { color:#fff !important; }
.fcm-portal-logout .fcm-ico { color:#fff !important; stroke:#fff !important; }

.fcm-portal-dl-btn,
.fcm-portal-dl-btn:link,
.fcm-portal-dl-btn:visited,
.fcm-portal-dl-btn:hover,
.fcm-portal-dl-btn:focus { color:#fff !important; }
.fcm-portal-dl-btn .fcm-ico { color:#fff !important; stroke:#fff !important; }

/* =========================================================================
   v6.7.13 — Share buttons: lock glyph colours, beat theme a:link colour
   The share buttons are <a>/<button> elements, so themes that set
   `a { color: … }` (often with !important) bled into the SVG glyphs because
   the icons use fill:currentColor. This pins every state explicitly:
     • filled / coloured states  -> glyph forced WHITE !important
     • default white-bg states    -> glyph forced BRAND PURPLE !important
   so the theme's default link colour can never be used in any state.
   ========================================================================= */

/* Default (white background) buttons keep the brand glyph — never theme colour */
.fcm-share-btn,
.fcm-share-btn:link,
.fcm-share-btn:visited,
.fcm-share-btn:focus { color: var(--fcm-brand,#810081) !important; }
.fcm-share-btn .fcm-share-ico { fill: currentColor; }

/* Filled "add to LinkedIn" button — white glyph + white badge plus */
.fcm-share-liadd,
.fcm-share-liadd:link,
.fcm-share-liadd:visited { color:#fff !important; }
.fcm-share-liadd .fcm-share-ico { fill:#fff !important; }
.fcm-share-liadd::after { color: var(--fcm-brand,#810081) !important; background:#fff !important; }

/* Coloured hover states — glyph stays white regardless of theme */
.fcm-share-li:hover,  .fcm-share-liadd:hover,
.fcm-share-fb:hover,  .fcm-share-wa:hover,
.fcm-share-tg:hover,  .fcm-share-x:hover,
.fcm-share-copy:hover { color:#fff !important; }
.fcm-share-li:hover  .fcm-share-ico,
.fcm-share-liadd:hover .fcm-share-ico,
.fcm-share-fb:hover  .fcm-share-ico,
.fcm-share-wa:hover  .fcm-share-ico,
.fcm-share-tg:hover  .fcm-share-ico,
.fcm-share-x:hover   .fcm-share-ico { fill:#fff !important; }

/* Copy button: line icon (stroke), keep stroke colour in sync */
.fcm-share-copy:hover .fcm-share-ico { stroke:#fff !important; }
.fcm-share-copy.fcm-copied,
.fcm-share-copy.fcm-copied:link,
.fcm-share-copy.fcm-copied:visited { color:#fff !important; }
.fcm-share-copy.fcm-copied .fcm-share-ico { stroke:#fff !important; }

/* =========================================================================
   v6.7.14 — Grade badge: single-line pill (fixes wrap + blob background)
   `.fcm-portal-cert-meta span` (0,1,1) was beating `.fcm-portal-grade-badge`
   and `.fcm-grade-*` (0,1,0), so the badge inherited display:flex, 12px and
   grey #666 instead of its intended inline-block / 10.5px / brand colour.
   In the narrow info column the text wrapped to 3 lines and the 50px radius
   turned it into a tall blob. We re-target the badge with matching specificity
   and force it onto one clean line.
   ========================================================================= */
.fcm-portal-cert-meta span.fcm-portal-grade-badge {
  display: inline-block;
  white-space: nowrap;          /* never break onto a second line */
  width: auto; max-width: none; flex: none;
  font-size: 10.5px; font-weight: 600; line-height: 1.5;
  padding: 3px 11px; border-radius: 50px;
  vertical-align: middle;
}
/* re-assert per-grade colours at the same specificity as the meta-span rule */
.fcm-portal-cert-meta span.fcm-grade-part { background: #ede9fe; color: #4c1d95; }
.fcm-portal-cert-meta span.fcm-grade-comp { background: #d1fae5; color: #065f46; }
.fcm-portal-cert-meta span.fcm-grade-dist { background: #fef3c7; color: #78350f; }

/* =========================================================================
   v6.7.15 — Certificate card: give the course/training name room (1–2 lines)
   In the narrow dashboard column the title shared one flex row with the
   actions and the 8-button share strip, so it was crushed into ~4 lines.
   We let the card wrap: row 1 = icon + title/meta (+ Bax/Yüklə), and the
   share strip drops to its own full-width row under its existing top-border
   divider. The info block now stretches to the right and the title sits on
   one or two clean lines.
   ========================================================================= */
.fcm-portal-cert-card { flex-wrap: wrap; align-items: flex-start; row-gap: 12px; }
.fcm-portal-cert-icon { align-self: flex-start; }
.fcm-portal-cert-info {
  flex: 1 1 240px;          /* grow into the freed-up width */
  min-width: 0;             /* allow the title to wrap instead of overflowing */
}
.fcm-portal-cert-course {
  line-height: 1.35;
  overflow-wrap: anywhere;  /* only break a token if it is genuinely too long */
}
.fcm-portal-cert-actions { flex: 0 0 auto; align-self: flex-start; }
.fcm-portal-cert-share   { flex: 1 1 100%; }   /* share strip = its own row */

/* =========================================================================
   v6.7.16 — Login-info overflow + email stacking + collapsible profile
   ========================================================================= */

/* (#5) Keep every login-info value INSIDE the purple panel. Long values
   (e.g. emails) used to push the reveal eye button off the right edge. */
.fcm-login-info-row { min-width: 0; }
.fcm-login-info-row .fcm-reveal {
  min-width: 0;                 /* allow the text to shrink/wrap, not overflow */
  flex: 1 1 auto;
  justify-content: flex-end;
}
.fcm-login-info-row .fcm-reveal-text {
  min-width: 0;
  overflow-wrap: anywhere;      /* wrap long emails instead of overflowing */
  word-break: break-all;
}
.fcm-login-info-row .fcm-reveal-btn { flex: 0 0 auto; }   /* eye stays visible */

/* (#5) Email row stacks: label on its own line, value on the line below,
   full width, with the eye button still reachable at the end. */
.fcm-login-info-row--stack {
  flex-direction: column;
  align-items: stretch;
}
.fcm-login-info-row--stack .fcm-login-info-label { margin-bottom: 6px; }
.fcm-login-info-row--stack .fcm-reveal {
  width: 100%;
  justify-content: space-between;
}

/* (#4) Collapsible "Profildə düzəliş" panel */
.fcm-profile-toggle {
  width: 100%;
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px;
  background: #faf3fb;
  border: 1.5px solid #f0e0f0;
  border-radius: 12px;
  padding: 12px 16px;
  margin-top: 4px;
  cursor: pointer;
  font-family: 'Montserrat', -apple-system, sans-serif;
  font-size: 14px; font-weight: 700; color: #810081;
  text-align: left;
  transition: background .15s, border-color .15s;
}
.fcm-profile-toggle:hover { background: #f5e9f6; border-color: #e5cce6; }
.fcm-profile-toggle .fcm-profile-chevron {
  width: 18px; height: 18px; flex: none;
  fill: none; stroke: #810081; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round;
  transition: transform .2s ease;
}
.fcm-profile-toggle.is-open .fcm-profile-chevron { transform: rotate(180deg); }
.fcm-profile-body { margin-top: 12px; }
.fcm-profile-body[hidden] { display: none; }

/* v6.7.70 — Palet möhkəmləndirməsi. Bəzi WordPress temaları düymə/link rəngini
   yüksək spesifiklik və ya !important ilə əzir və plugin düymələrində pis kontrast
   yaranır. Paleti qəti şəkildə bərpa edirik:
   bənövşəyi (#810081) fonda mətn AĞ, ağ fonda mətn BƏNÖVŞƏYİ. */
.fcm-portal-wrap .fcm-portal-btn,
.fcm-portal-wrap .fcm-login-button,
.fcm-portal-wrap .fcm-login-submit,
.fcm-portal-wrap .fcm-portal-dl-btn,
.fcm-portal-wrap .fcm-portal-dl-lang {
  background-color: #810081 !important;
  color: #fff !important;
}
.fcm-portal-wrap .fcm-portal-btn:hover,
.fcm-portal-wrap .fcm-login-button:hover,
.fcm-portal-wrap .fcm-login-submit:hover,
.fcm-portal-wrap .fcm-portal-dl-btn:hover,
.fcm-portal-wrap .fcm-portal-dl-lang:hover {
  background-color: #a200a2 !important;
  color: #fff !important;
}
.fcm-portal-wrap .fcm-portal-verify-btn,
.fcm-portal-wrap .fcm-login-secondary {
  background-color: #fff !important;
  color: #810081 !important;
}
.fcm-portal-wrap .fcm-portal-verify-btn:hover {
  background-color: #f3e5f5 !important;
  color: #810081 !important;
}