:root {
  --ulicense-primary: #059669;
  --ulicense-secondary: #0f766e;
  --ulicense-ink: #111827;
  --ulicense-muted: #6b7280;
  --ulicense-line: #e5e7eb;
  --ulicense-bg: #f9fafb;
  --ulicense-card: #ffffff;
  --ulicense-danger: #dc2626;
  --ulicense-warning: #d97706;
  --ulicense-focus: rgba(14, 165, 233, .2);
  --ulicense-premium-shadow: 0 24px 70px rgba(15, 23, 42, .10);
}

.ulicense-app-shell,
.ulicense-admin-wrap {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.ulicense-app {
  min-height: 720px;
  background:
    radial-gradient(circle at 85% 8%, rgba(20,184,166,.14), transparent 24%),
    linear-gradient(180deg, #fbfdfc, var(--ulicense-bg));
  color: var(--ulicense-ink);
  border: 1px solid var(--ulicense-line);
  overflow: hidden;
}

.ulicense-app *,
.ulicense-admin-wrap * {
  box-sizing: border-box;
}

.ulicense-topbar {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px;
  background: rgba(255, 255, 255, 0.92);
  border-bottom: 1px solid var(--ulicense-line);
  backdrop-filter: blur(18px);
  position: sticky;
  top: 0;
  z-index: 20;
}

.ulicense-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  border: 0;
  background: transparent;
  color: var(--ulicense-ink);
  font-weight: 900;
  font-size: 19px;
  cursor: pointer;
  padding: 0;
}

.ulicense-logo-mark {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--ulicense-primary), var(--ulicense-secondary));
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 900;
  box-shadow: 0 12px 28px rgba(5, 150, 105, 0.22);
  overflow: hidden;
}

.ulicense-logo-mark img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
}

.ulicense-nav-actions,
.ulicense-row,
.ulicense-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ulicense-main {
  padding: 36px 28px 56px;
}

.ulicense-hero {
  min-height: 330px;
  display: grid;
  align-items: center;
  text-align: center;
  padding: 48px 20px;
  position: relative;
  overflow: hidden;
}

.ulicense-hero:before {
  content: "";
  position: absolute;
  inset: -30% 55% auto -15%;
  height: 360px;
  background: rgba(16, 185, 129, 0.14);
  filter: blur(85px);
  border-radius: 999px;
}

.ulicense-hero h1 {
  margin: 0 0 16px;
  font-size: clamp(36px, 6vw, 68px);
  line-height: 0.98;
  letter-spacing: 0;
  font-weight: 950;
}

.ulicense-gradient-text {
  color: var(--ulicense-primary);
}

.ulicense-hero p {
  max-width: 720px;
  margin: 0 auto 28px;
  color: var(--ulicense-muted);
  font-size: 18px;
  font-weight: 600;
}

.ulicense-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 7px 12px;
  border: 1px solid rgba(5, 150, 105, 0.22);
  background: rgba(5, 150, 105, 0.08);
  color: var(--ulicense-secondary);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

/* ── Tooltip icon ────────────────────────────────────────── */
.ulicense-tip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  margin-left: 5px;
  vertical-align: middle;
  flex-shrink: 0;
  background: #ede9fe;
  color: #6d28d9;
  border: 1px solid #c4b5fd;
  cursor: help;
  transition: background .15s, color .15s, transform .12s;
  outline: none;
  position: relative;
  top: -1px;
}
.ulicense-tip:hover,
.ulicense-tip:focus {
  background: #6d28d9;
  color: #fff;
  border-color: #6d28d9;
  transform: scale(1.15);
}
/* variant colors by icon type (set via parent or sibling) */
.ulicense-tip[data-tip-pos] { /* all tips get hover effect */ }

/* ── Floating tooltip bubble ─────────────────────────────── */
.ulicense-tooltip-float {
  position: absolute;
  z-index: 99999;
  top: 0; left: 0;
  max-width: 220px;
  padding: 8px 12px;
  background: #1e1b4b;
  color: #e9d5ff;
  font-size: 12px;
  line-height: 1.55;
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0,0,0,.28), 0 1px 4px rgba(0,0,0,.18);
  pointer-events: none;
  opacity: 0;
  transform: translateY(4px) scale(.97);
  transition: opacity .17s ease, transform .17s ease;
  word-break: normal;
  white-space: normal;
  font-family: inherit;
  font-weight: 400;
  letter-spacing: 0;
}
.ulicense-tooltip-float.is-visible {
  pointer-events: auto;
  opacity: 1;
  transform: translateY(0) scale(1);
}
.ulicense-tooltip-float.is-wide {
  max-width: 320px;
}
/* subtle arrow indicator based on position */
.ulicense-tooltip-float[data-pos="top"]::after,
.ulicense-tooltip-float[data-pos="bottom"]::after,
.ulicense-tooltip-float[data-pos="left"]::after,
.ulicense-tooltip-float[data-pos="right"]::after {
  content: '';
  position: absolute;
  width: 7px;
  height: 7px;
  background: #1e1b4b;
  transform: rotate(45deg);
}
.ulicense-tooltip-float[data-pos="top"]::after    { bottom: -4px; left: 50%; margin-left: -3.5px; }
.ulicense-tooltip-float[data-pos="bottom"]::after { top: -4px;    left: 50%; margin-left: -3.5px; }
.ulicense-tooltip-float[data-pos="left"]::after   { right: -4px;  top: 50%;  margin-top: -3.5px;  }
.ulicense-tooltip-float[data-pos="right"]::after  { left: -4px;   top: 50%;  margin-top: -3.5px;  }


.ulicense-btn {
  min-height: 44px;
  border-radius: 12px;
  padding: 10px 16px;
  border: 1px solid var(--ulicense-line);
  background: #fff;
  color: var(--ulicense-ink);
  font-weight: 850;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

.ulicense-btn-primary:hover {
  background: #047857;
}

.ulicense-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(5, 150, 105, 0.35);
  box-shadow: 0 12px 24px rgba(17, 24, 39, 0.08);
}

.ulicense-btn-primary {
  background: var(--ulicense-primary);
  color: #fff;
  border-color: var(--ulicense-primary);
  box-shadow: 0 14px 30px rgba(5, 150, 105, 0.23);
}

.ulicense-btn-danger {
  color: var(--ulicense-danger);
  border-color: #fecaca;
  background: #fff5f5;
}

.ulicense-btn-ghost {
  background: transparent;
}

.ulicense-cart-nav-btn {
  min-width: 146px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fffb 100%);
  border-color: rgba(5, 150, 105, 0.24);
  color: var(--ulicense-ink);
  box-shadow: 0 10px 26px rgba(5, 150, 105, 0.08);
  white-space: nowrap;
}

.ulicense-cart-nav-btn:hover,
.ulicense-cart-nav-btn:focus-visible {
  background: linear-gradient(180deg, #ffffff 0%, #ecfdf5 100%);
  border-color: rgba(5, 150, 105, 0.42);
  color: var(--ulicense-ink);
  box-shadow: 0 14px 30px rgba(5, 150, 105, 0.16);
}

.ulicense-cart-nav-btn span:not(.ulicense-cart-icon),
.ulicense-cart-nav-btn:hover span:not(.ulicense-cart-icon),
.ulicense-cart-nav-btn:focus-visible span:not(.ulicense-cart-icon) {
  color: inherit;
  opacity: 1;
  visibility: visible;
}

.ulicense-cart-icon {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  display: inline-grid;
  place-items: center;
  background: linear-gradient(135deg, var(--ulicense-primary), var(--ulicense-secondary));
  box-shadow: 0 8px 18px rgba(5, 150, 105, 0.22);
}

.ulicense-cart-icon svg {
  width: 21px;
  height: 21px;
  overflow: visible;
  fill: #fff;
}

.ulicense-cart-icon path {
  fill: none;
  stroke: #fff;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ulicense-cart-icon-basket {
  filter: drop-shadow(0 1px 0 rgba(0, 0, 0, 0.12));
}

.ulicense-cart-icon-handle {
  opacity: .78;
}

.ulicense-cart-count {
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: #ecfdf5;
  color: var(--ulicense-secondary);
  border: 1px solid rgba(5, 150, 105, 0.22);
  font-size: 13px;
  font-weight: 950;
  line-height: 1;
}

.ulicense-btn[disabled] {
  opacity: .55;
  cursor: not-allowed;
  transform: none;
}

.ulicense-full-btn {
  width: 100%;
}

.ulicense-icon-btn {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 12px;
  border: 1px solid var(--ulicense-line);
  background: #fff;
  color: var(--ulicense-ink);
  display: inline-grid;
  place-items: center;
  font-size: 18px;
  font-weight: 950;
  line-height: 1;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.ulicense-remove-cart-btn {
  width: 46px;
  height: 46px;
  min-width: 46px;
  padding: 0;
  border-radius: 12px;
  background: #fff5f5;
  border-color: #fecaca;
  color: var(--ulicense-danger);
  font-size: 17px;
  font-weight: 950;
  line-height: 46px;
  text-align: center;
  box-shadow: 0 10px 22px rgba(220, 38, 38, 0.08);
}

.ulicense-remove-cart-btn:hover,
.ulicense-remove-cart-btn:focus-visible {
  background: var(--ulicense-danger);
  border-color: var(--ulicense-danger);
  color: #fff;
  box-shadow: 0 14px 28px rgba(220, 38, 38, 0.22);
  transform: translateY(-1px);
}

.ulicense-cart-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 22px;
  align-items: start;
}

.ulicense-cart-list {
  min-width: 0;
}

.ulicense-cart-item,
.ulicense-cart-summary {
  background: #fff;
  border: 1px solid var(--ulicense-line);
  border-radius: 14px;
  box-shadow: var(--ulicense-premium-shadow);
}

.ulicense-cart-item {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 18px;
  margin-bottom: 12px;
}

.ulicense-cart-item h3,
.ulicense-cart-summary h3 {
  margin: 10px 0 8px;
}

.ulicense-cart-price {
  min-width: 120px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.ulicense-cart-summary {
  position: sticky;
  top: 92px;
  padding: 24px;
}

.ulicense-coupon-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
}

.ulicense-success-text {
  color: var(--ulicense-primary);
  font-weight: 850;
}

.ulicense-auth-shell {
  min-height: 560px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 460px);
  gap: 28px;
  align-items: stretch;
}

.ulicense-auth-copy,
.ulicense-auth-panel,
.ulicense-premium-admin-form {
  border: 1px solid rgba(15, 23, 42, .08);
  background: rgba(255, 255, 255, .94);
  border-radius: 18px;
  box-shadow: var(--ulicense-premium-shadow);
}

.ulicense-auth-copy {
  padding: 46px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background:
    linear-gradient(135deg, rgba(236, 253, 245, .95), rgba(239, 246, 255, .95)),
    #fff;
}

.ulicense-auth-copy h1 {
  max-width: 720px;
  margin: 16px 0;
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1;
  letter-spacing: 0;
}

.ulicense-auth-copy p {
  max-width: 620px;
  color: #475569;
  font-size: 18px;
  font-weight: 650;
}

.ulicense-auth-points {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.ulicense-auth-points span {
  padding: 10px 12px;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 999px;
  background: #fff;
  color: #334155;
  font-weight: 850;
}

.ulicense-auth-panel {
  padding: 28px;
  align-self: center;
}

.ulicense-auth-panel .ulicense-logo-mark {
  margin-bottom: 18px;
}

.ulicense-segmented {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 4px;
  margin-bottom: 20px;
  border: 1px solid var(--ulicense-line);
  border-radius: 14px;
  background: #f8fafc;
}

.ulicense-segmented button {
  min-height: 42px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #64748b;
  font-weight: 900;
  cursor: pointer;
}

.ulicense-segmented button.is-active {
  background: #fff;
  color: var(--ulicense-ink);
  box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
}

.ulicense-premium-form {
  display: grid;
  gap: 14px;
}

.ulicense-helper {
  margin: 8px 0 0;
  color: #64748b;
  font-weight: 700;
  font-size: 13px;
}

.ulicense-helper button {
  border: 0;
  background: transparent;
  color: var(--ulicense-primary);
  font-weight: 900;
  cursor: pointer;
}

.ulicense-checkline {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px;
  border: 1px solid #dbeafe;
  border-radius: 12px;
  background: #f8fbff;
  color: #334155;
  font-weight: 750;
}

.ulicense-checkline input {
  margin-top: 3px;
}

.ulicense-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.ulicense-cart-totals {
  border-top: 1px solid var(--ulicense-line);
  border-bottom: 1px solid var(--ulicense-line);
  margin: 14px 0;
  padding: 10px 0;
}

.ulicense-cart-totals p {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0;
}

.ulicense-cart-total {
  font-size: 20px;
  color: var(--ulicense-primary);
}

.ulicense-icon-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(5, 150, 105, .35);
  box-shadow: 0 12px 24px rgba(17, 24, 39, .08);
}

.ulicense-grid {
  display: grid;
  gap: 22px;
}

.ulicense-course-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.ulicense-card {
  background: var(--ulicense-card);
  border: 1px solid var(--ulicense-line);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(17, 24, 39, 0.04);
}

.ulicense-course-card {
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  border-radius: 22px;
}

.ulicense-course-card:hover {
  transform: translateY(-2px);
  border-color: rgba(5, 150, 105, .34);
  box-shadow: 0 18px 36px rgba(17, 24, 39, .08);
}

.ulicense-field-hint {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.4;
}

.ulicense-cover-upload-field {
  grid-column: 1 / -1;
}

.ulicense-cover-upload {
  display: grid;
  grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  padding: 14px;
  border: 1px solid rgba(5, 150, 105, .18);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(236, 253, 245, .82), rgba(255, 255, 255, .96));
}

.ulicense-cover-upload-preview,
.ulicense-cover-upload-empty {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 12px;
  overflow: hidden;
  background-color: #0b312b;
}

.ulicense-cover-upload-preview {
  position: relative;
  background-position: center;
  background-size: cover;
}

.ulicense-cover-upload-preview::before {
  content: "";
  position: absolute;
  inset: -12px;
  background: inherit;
  filter: blur(14px) brightness(.55);
  transform: scale(1.08);
}

.ulicense-cover-upload-preview img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ulicense-cover-upload-empty {
  display: grid;
  place-items: center;
  color: rgba(255, 255, 255, .72);
  font-size: 13px;
  font-weight: 800;
  background: linear-gradient(135deg, #0b312b, #0f766e);
}

.ulicense-course-image {
  height: 190px;
  background-color: #111827;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden;
}

.ulicense-course-image:before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: inherit;
  background-size: cover;
  background-position: center;
  filter: blur(20px) brightness(.55);
  transform: scale(1.18);
  z-index: 0;
}

.ulicense-course-image img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ulicense-course-image:after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, transparent, rgba(17, 24, 39, .62));
}

.ulicense-course-overlay {
  position: absolute;
  inset: auto 14px 14px 14px;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #fff;
}

.ulicense-course-overlay span {
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(17,24,39,.62);
  backdrop-filter: blur(10px);
  font-size: 12px;
  font-weight: 850;
}

.ulicense-course-overlay strong {
  width: 54px;
  height: 54px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(5,150,105,.92);
  box-shadow: 0 12px 28px rgba(0,0,0,.24);
}

.ulicense-course-meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 14px 0;
}

.ulicense-course-meta span {
  padding: 7px 10px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.ulicense-mini-cta {
  border: 0;
  background: transparent;
  color: var(--ulicense-primary);
  font-weight: 900;
  cursor: pointer;
}

.ulicense-card-body {
  padding: 20px;
}

.ulicense-card-body h3,
.ulicense-section-title {
  margin: 0 0 8px;
  font-weight: 950;
  letter-spacing: 0;
}

.ulicense-muted {
  color: var(--ulicense-muted);
}

.ulicense-progress {
  width: 100%;
  height: 9px;
  border-radius: 999px;
  overflow: hidden;
  background: #edf2f7;
}

.ulicense-progress span {
  display: block;
  height: 100%;
  width: 0;
  background: var(--ulicense-primary);
  transition: width .24s ease;
}

.ulicense-dashboard {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  min-height: 720px;
}

.ulicense-learning-hero {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin-bottom: 26px;
  padding: 28px;
  border-radius: 24px;
  border: 1px solid #d7f4e7;
  background:
    radial-gradient(circle at 95% 10%, rgba(20,184,166,.16), transparent 28%),
    linear-gradient(135deg, #ffffff, #ecfdf5);
  box-shadow: 0 24px 60px rgba(17, 24, 39, .07);
}

.ulicense-learning-hero h1 {
  margin: 10px 0 8px;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1;
  font-weight: 950;
}

.ulicense-learning-hero p {
  max-width: 680px;
  margin: 0;
  color: var(--ulicense-muted);
  font-size: 16px;
}

.ulicense-learning-score {
  min-width: 142px;
  min-height: 112px;
  border-radius: 22px;
  display: grid;
  place-items: center;
  text-align: center;
  background: var(--ulicense-primary);
  color: #fff;
  box-shadow: 0 22px 44px rgba(5,150,105,.24);
}

.ulicense-learning-score strong {
  display: block;
  font-size: 34px;
  line-height: 1;
}

.ulicense-learning-score span {
  font-size: 12px;
  font-weight: 850;
}

.ulicense-continue-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 18px;
  align-items: center;
  margin-bottom: 26px;
  padding: 24px;
  border-radius: 24px;
  color: #fff;
  background:
    linear-gradient(135deg, rgba(5,150,105,.95), rgba(15,118,110,.96)),
    var(--ulicense-primary);
  box-shadow: 0 24px 60px rgba(5,150,105,.24);
  cursor: pointer;
}

.ulicense-continue-panel h2,
.ulicense-continue-panel p {
  margin: 8px 0 0;
}

.ulicense-continue-panel .ulicense-pill {
  background: rgba(255,255,255,.16);
  border-color: rgba(255,255,255,.28);
  color: #fff;
}

.ulicense-continue-panel .ulicense-progress {
  background: rgba(255,255,255,.24);
  margin-bottom: 12px;
}

.ulicense-continue-panel .ulicense-progress span {
  background: #fff;
}

.ulicense-continue-panel-featured {
  grid-template-columns: 180px minmax(0, 1fr);
}

.ulicense-continue-cover {
  border-radius: 16px;
  overflow: hidden;
  background: rgba(0,0,0,.15);
  min-height: 120px;
}

.ulicense-continue-cover img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.ulicense-notify-panel {
  position: fixed;
  top: 72px;
  right: 24px;
  z-index: 120;
  width: min(360px, calc(100vw - 32px));
  background: #fff;
  border: 1px solid var(--ulicense-line);
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(15,23,42,.18);
}

.ulicense-notify-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
  border-bottom: 1px solid var(--ulicense-line);
}

.ulicense-notify-list {
  list-style: none;
  margin: 0;
  padding: 8px 0;
  max-height: 360px;
  overflow: auto;
}

.ulicense-notify-list li {
  padding: 10px 16px;
  border-bottom: 1px solid var(--ulicense-line);
}

.ulicense-catalog-filters .ulicense-input {
  min-width: 140px;
}

.ulicense-client-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 10px 0;
}

.ulicense-alert {
  grid-column: 1 / -1;
  padding: 12px 14px;
  border-radius: 12px;
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fcd34d;
}

.ulicense-funnel-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.ulicense-funnel-bars {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  height: 140px;
  margin-top: 12px;
}

.ulicense-funnel-bar {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  font-size: 11px;
  color: #64748b;
}

.ulicense-funnel-bar-fill {
  display: block;
  width: 100%;
  min-height: 4px;
  border-radius: 6px 6px 2px 2px;
  background: linear-gradient(180deg, #34d399, #059669);
}

.ulicense-funnel-bar strong {
  color: #0f172a;
  font-size: 13px;
}

.ulicense-sidebar {
  background: #fff;
  border-right: 1px solid var(--ulicense-line);
  padding: 22px 16px;
}

.ulicense-sidebar .ulicense-btn {
  width: 100%;
  justify-content: flex-start;
  margin-bottom: 8px;
}

.ulicense-player-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  min-height: 650px;
}

.ulicense-player-main {
  padding: 26px;
}

.ulicense-player-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 18px;
  margin-bottom: 20px;
  padding: 22px;
  border-radius: 24px;
  border: 1px solid #d7f4e7;
  background: linear-gradient(135deg, #fff, #ecfdf5);
  box-shadow: 0 18px 40px rgba(17,24,39,.055);
}

.ulicense-player-head h1,
.ulicense-player-head p {
  margin: 8px 0 0;
}

.ulicense-player-progress-card {
  min-width: 132px;
  display: grid;
  justify-items: center;
  gap: 8px;
}

.ulicense-player-progress {
  width: 116px;
  height: 116px;
  min-width: 116px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  text-align: center;
  position: relative;
  background: conic-gradient(var(--ulicense-primary) 0 var(--course-progress, 0deg), #dbeee7 var(--course-progress, 0deg) 360deg);
  color: var(--ulicense-ink);
  border: 1px solid #cdeee0;
  box-shadow: 0 18px 40px rgba(5,150,105,.14);
}

.ulicense-player-progress:before {
  content: "";
  position: absolute;
  inset: 12px;
  border-radius: 50%;
  background: #fff;
  box-shadow: inset 0 0 0 1px #e5f4ed;
}

.ulicense-player-progress strong {
  position: relative;
  z-index: 1;
  display: block;
  font-size: 30px;
  line-height: 1;
  transform: translateY(1px);
}

.ulicense-player-progress-card > span {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 9px;
  border-radius: 999px;
  background: #ecfdf5;
  border: 1px solid #b7f0d5;
  font-size: 11px;
  line-height: 1;
  font-weight: 850;
  color: var(--ulicense-secondary);
  white-space: nowrap;
}

.ulicense-progress-celebration {
  position: absolute;
  inset: -18px;
  pointer-events: none;
  z-index: 2;
}

.ulicense-progress-celebration i {
  --star-x: 0px;
  --star-y: -40px;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10px;
  height: 10px;
  opacity: 0;
  background: #f7c948;
  clip-path: polygon(50% 0%, 61% 34%, 98% 35%, 68% 56%, 79% 91%, 50% 70%, 21% 91%, 32% 56%, 2% 35%, 39% 34%);
  filter: drop-shadow(0 4px 7px rgba(180, 83, 9, .22));
  animation: ulicense-star-burst 1.65s ease-out infinite;
}

.ulicense-progress-celebration i:nth-child(1) {
  --star-x: -58px;
  --star-y: -44px;
  animation-delay: 0s;
}

.ulicense-progress-celebration i:nth-child(2) {
  --star-x: 55px;
  --star-y: -50px;
  width: 8px;
  height: 8px;
  animation-delay: .14s;
}

.ulicense-progress-celebration i:nth-child(3) {
  --star-x: -64px;
  --star-y: 18px;
  width: 7px;
  height: 7px;
  background: #34d399;
  animation-delay: .28s;
}

.ulicense-progress-celebration i:nth-child(4) {
  --star-x: 62px;
  --star-y: 14px;
  background: #60a5fa;
  animation-delay: .42s;
}

.ulicense-progress-celebration i:nth-child(5) {
  --star-x: -28px;
  --star-y: -68px;
  width: 7px;
  height: 7px;
  animation-delay: .56s;
}

.ulicense-progress-celebration i:nth-child(6) {
  --star-x: 28px;
  --star-y: -70px;
  width: 7px;
  height: 7px;
  background: #22c55e;
  animation-delay: .7s;
}

@keyframes ulicense-star-burst {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(.45) rotate(0deg);
  }
  16% {
    opacity: 1;
  }
  62% {
    opacity: .95;
    transform: translate(calc(-50% + var(--star-x)), calc(-50% + var(--star-y))) scale(1) rotate(110deg);
  }
  100% {
    opacity: 0;
    transform: translate(calc(-50% + var(--star-x)), calc(-50% + var(--star-y) + 14px)) scale(.68) rotate(170deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ulicense-progress-celebration i {
    animation: none;
    opacity: .75;
    transform: translate(calc(-50% + var(--star-x)), calc(-50% + var(--star-y))) scale(.85);
  }
}

.ulicense-video {
  aspect-ratio: 16 / 9;
  background: #050505;
  border-radius: 24px;
  overflow: hidden;
  display: grid;
  place-items: center;
  color: #fff;
  box-shadow: 0 26px 70px rgba(0,0,0,.18);
}

.ulicense-lesson-section {
  display: grid;
  gap: 12px;
}

.ulicense-section-kicker {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.ulicense-video-wrap {
  display: grid;
  gap: 12px;
}

.ulicense-video-empty {
  min-height: 220px;
  padding: 24px;
  text-align: center;
  background: #111827;
}

.ulicense-video-permission {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  color: #047857;
  font-size: 12px;
  font-weight: 900;
}

.ulicense-video-permission.is-locked {
  background: #f9fafb;
  border-color: #e5e7eb;
  color: #6b7280;
}

.ulicense-video-download {
  justify-self: end;
}

.ulicense-video iframe,
.ulicense-video video {
  width: 100%;
  height: 100%;
  border: 0;
}

.ulicense-dropbox-player video {
  display: block;
  max-width: min(720px, 100%);
  width: 100%;
  height: auto;
  margin: 0 auto;
  background: #000;
}

.ulicense-restricted-video-wrap {
  position: relative;
  background:
    radial-gradient(circle at 50% 45%, rgba(5, 150, 105, .12), transparent 32%),
    #050505;
}

.ulicense-restricted-video-wrap video {
  display: block;
  object-fit: cover;
  pointer-events: none;
}

.ulicense-restricted-video-wrap:fullscreen {
  width: 100vw;
  height: 100vh;
  border-radius: 0;
}

.ulicense-video-controls {
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 20px;
  min-height: 64px;
  padding: 11px 14px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(15, 23, 42, .88), rgba(15, 23, 42, .74));
  color: #fff;
  display: grid;
  grid-template-columns: auto minmax(120px, 1fr) auto auto minmax(80px, 110px) auto;
  gap: 12px;
  align-items: center;
  box-shadow: 0 22px 44px rgba(0, 0, 0, .34);
  backdrop-filter: blur(16px);
  transition: opacity .2s ease, transform .2s ease;
}

.ulicense-restricted-video-wrap.is-playing:not(.is-control-active) .ulicense-video-controls {
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
}

.ulicense-video-play-btn {
  min-width: 124px;
  min-height: 42px;
  padding: 9px 16px;
  border: 0;
  border-radius: 999px;
  background: rgba(5, 150, 105, .96);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-weight: 950;
  cursor: pointer;
  box-shadow: 0 12px 28px rgba(5, 150, 105, .26);
}

.ulicense-video-play-btn span {
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 9px solid #fff;
}

.ulicense-video-play-btn.is-playing span {
  width: 10px;
  height: 12px;
  border: 0;
  border-left: 4px solid #fff;
  border-right: 4px solid #fff;
}

.ulicense-video-play-btn:hover,
.ulicense-video-play-btn:focus-visible {
  background: var(--ulicense-primary);
  outline: 0;
  box-shadow: 0 20px 44px rgba(5, 150, 105, .32);
}

.ulicense-video-progress,
.ulicense-video-volume {
  width: 100%;
  accent-color: var(--ulicense-primary);
  cursor: pointer;
}

.ulicense-video-volume {
  min-width: 80px;
}

.ulicense-video-time {
  min-width: 82px;
  color: rgba(255, 255, 255, .9);
  font-size: 13px;
  font-weight: 850;
  text-align: right;
}

.ulicense-video-tool-btn {
  box-sizing: border-box;
  width: 42px;
  height: 42px;
  min-width: 42px;
  min-height: 42px;
  padding: 0;
  margin: 0;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 50%;
  background: rgba(255, 255, 255, .10);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 0;
  cursor: pointer;
  vertical-align: middle;
}

.ulicense-video-tool-btn svg {
  display: block;
  width: 20px;
  height: 20px;
  margin: 0;
  flex-shrink: 0;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
}

.ulicense-video-tool-btn:hover,
.ulicense-video-tool-btn:focus-visible {
  background: rgba(255, 255, 255, .18);
  outline: 0;
}

.ulicense-lesson-sidebar {
  border-left: 1px solid var(--ulicense-line);
  background: linear-gradient(180deg, #ffffff, #f8fffc);
  padding: 18px 16px;
  overflow: auto;
}

.ulicense-sidebar-progress-copy {
  display: grid;
  gap: 5px;
  margin: 8px 0 14px;
  color: #5f6b7a;
}

.ulicense-sidebar-progress-copy p {
  margin: 0;
  font-size: 13px;
  line-height: 1.35;
}

.ulicense-sidebar-progress-copy strong {
  color: var(--ulicense-ink);
}

.ulicense-chapter-group {
  margin-top: 12px;
}

.ulicense-chapter-title {
  width: 100%;
  min-height: 42px;
  border: 1px solid #e5f1eb;
  border-radius: 12px;
  background: #fff;
  color: #374151;
  cursor: pointer;
  font-size: 14px;
  font-weight: 950;
  text-align: left;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  outline: none !important;
  box-shadow: none !important;
}
.ulicense-chapter-title:focus {
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(5,150,105,.3) !important;
}

.ulicense-chapter-title:before {
  content: "v";
  color: var(--ulicense-primary);
  font-size: 13px;
  transition: transform .18s ease;
}

.ulicense-chapter-title span {
  flex: 1;
}

.ulicense-chapter-title small {
  min-width: 38px;
  border-radius: 999px;
  padding: 4px 8px;
  background: #ecfdf5;
  color: var(--ulicense-secondary);
  font-size: 11px;
  font-weight: 950;
  text-align: center;
}

.ulicense-chapter-lessons {
  padding-top: 8px;
}

.ulicense-chapter-group.is-closed .ulicense-chapter-title:before {
  transform: rotate(-90deg);
}

.ulicense-chapter-group.is-closed .ulicense-chapter-lessons {
  display: none;
}

.ulicense-lesson-item {
  border: 1px solid #edf2f7;
  border-radius: 12px;
  padding: 12px 12px 12px 50px;
  margin-bottom: 8px;
  cursor: pointer;
  background: #fff;
  position: relative;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}

.ulicense-lesson-item:hover {
  border-color: rgba(5,150,105,.28);
  transform: translateY(-1px);
  outline: none !important;
  box-shadow: none !important;
}
.ulicense-lesson-item:focus {
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(5,150,105,.25) !important;
}

.ulicense-lesson-item.active {
  border-color: var(--ulicense-primary);
  background: linear-gradient(180deg, rgba(5, 150, 105, .09), #fff);
  box-shadow: 0 12px 24px rgba(5,150,105,.08);
}

.ulicense-lesson-item.locked {
  opacity: .56;
  cursor: not-allowed;
  background: #f9fafb;
}

.ulicense-lesson-number {
  position: absolute;
  left: 12px;
  top: 12px;
  width: 30px;
  height: 30px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: #eefbf5;
  color: var(--ulicense-primary);
  font-weight: 950;
}

.ulicense-lesson-item small,
.ulicense-lesson-item h4,
.ulicense-lesson-item span {
  display: block;
}

.ulicense-lesson-item small {
  min-height: 16px;
  color: var(--ulicense-muted);
  font-size: 11px;
  font-weight: 850;
}

.ulicense-lesson-item h4 {
  margin: 3px 0;
  font-size: 14px;
  line-height: 1.28;
}

.ulicense-content-box {
  margin-top: 22px;
  padding: 20px;
  background: #fff;
  border: 1px solid var(--ulicense-line);
  border-radius: 16px;
}

.ulicense-lesson-notes {
  border-radius: 22px;
  padding: 24px;
  box-shadow: 0 16px 36px rgba(17,24,39,.055);
}

.ulicense-rich-text {
  margin-top: 16px;
  color: #1f2937;
  font-size: 16px;
  line-height: 1.7;
}

.ulicense-resource-sections {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.ulicense-downloads,
.ulicense-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.ulicense-resource-card {
  min-width: 220px;
  max-width: 100%;
  border: 1px solid #dbe7ef;
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff, #f8fafc);
  padding: 14px 16px;
  color: var(--ulicense-ink);
  text-decoration: none;
  cursor: pointer;
  text-align: left;
  display: grid;
  gap: 4px;
  box-shadow: 0 10px 24px rgba(17,24,39,.045);
}

.ulicense-resource-card:hover {
  border-color: rgba(5,150,105,.35);
  transform: translateY(-1px);
}

.ulicense-resource-card strong {
  font-size: 14px;
}

.ulicense-resource-card span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ulicense-muted);
  font-size: 12px;
  pointer-events: none; /* prevents browser URL tooltip */
}

.ulicense-download-card {
  border-color: rgba(5, 150, 105, .35);
  background: linear-gradient(135deg, var(--ulicense-primary), var(--ulicense-secondary));
  color: #fff;
  box-shadow: 0 16px 34px rgba(5,150,105,.2);
}

.ulicense-download-card:before {
  content: "\2193";
  width: 30px;
  height: 30px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.18);
  font-weight: 950;
  margin-bottom: 4px;
}

.ulicense-download-card span {
  color: rgba(255,255,255,.82);
}

.ulicense-download-card:hover {
  border-color: rgba(5,150,105,.5);
  box-shadow: 0 20px 42px rgba(5,150,105,.26);
}

.ulicense-admin-wrap {
  margin: 0 20px 0 0;
}

.ulicense-admin {
  margin-top: 0;
  min-height: calc(100vh - 80px);
  background:
    radial-gradient(circle at top left, rgba(5,150,105,.10), transparent 34%),
    linear-gradient(180deg, #fbfdfc 0%, #f6f8fb 100%);
  border: 1px solid var(--ulicense-line);
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr);
  border-radius: 0;
}

.ulicense-admin-sidebar {
  background: linear-gradient(180deg, #ffffff 0%, #f8fffc 100%);
  border-right: 1px solid var(--ulicense-line);
  padding: 18px 12px;
  position: sticky;
  top: 32px;
  height: calc(100vh - 32px);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}

.ulicense-admin-content {
  padding: 36px 28px;
  overflow: auto;
  min-width: 0;
}

.ulicense-admin-content > .ulicense-section-title {
  font-size: 28px;
  margin-bottom: 18px;
}

.ulicense-editor-top {
  position: sticky;
  top: 0;
  z-index: 20;
  margin: -14px -10px 18px;
  padding: 14px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: rgba(250, 253, 252, .92);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(220, 239, 232, .82);
}

.ulicense-editor-top .ulicense-section-title,
.ulicense-editor-top .ulicense-muted {
  margin: 0;
}

.ulicense-editor-top .ulicense-muted {
  margin-top: 4px;
}

.ulicense-admin .ulicense-brand {
  width: 100%;
  justify-content: flex-start;
  padding: 10px;
  margin-bottom: 12px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid #e8f1ed;
  box-shadow: 0 14px 34px rgba(17, 24, 39, .05);
}
.ulicense-admin .ulicense-brand .ulicense-logo-mark {
  width: 56px;
  height: 56px;
  min-width: 56px;
  border-radius: 14px;
}
.ulicense-admin .ulicense-brand .ulicense-logo-mark img {
  object-fit: contain;
  transform: scale(1.08);
}

.ulicense-admin-sidebar .ulicense-btn {
  width: 100%;
  justify-content: flex-start;
  min-height: 38px;
  margin-bottom: 5px;
  padding: 8px 14px;
  border-radius: 13px;
}

.ulicense-admin-profile {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  margin: 0 0 18px;
  border-radius: 15px;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  font-weight: 850;
}

.ulicense-admin-profile img {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  object-fit: cover;
}

.ulicense-certificate-settings {
  margin: 20px 0 18px;
  padding: 18px;
  border: 1px solid #dcefe8;
  border-radius: 8px;
  background: #fbfefc;
}

.ulicense-certificate-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 14px;
}

.ulicense-certificate-head h3,
.ulicense-certificate-head p {
  margin: 0;
}

.ulicense-certificate-head p {
  margin-top: 4px;
}

.ulicense-certificate-head img {
  width: 96px;
  height: 54px;
  object-fit: contain;
  border: 1px solid #dcefe8;
  border-radius: 8px;
  background: #fff;
  padding: 6px;
}

.ulicense-signature-pad {
  display: block;
  width: 100%;
  max-width: 620px;
  height: 180px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  touch-action: none;
  cursor: crosshair;
}

.ulicense-course-builder-hero {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  padding: 24px;
  margin-bottom: 16px;
  border-radius: 24px;
  border: 1px solid #d7f4e7;
  background:
    radial-gradient(circle at 90% 10%, rgba(20,184,166,.16), transparent 30%),
    linear-gradient(135deg, #fff, #ecfdf5);
  box-shadow: 0 22px 55px rgba(17,24,39,.07);
}

.ulicense-course-builder-hero h2,
.ulicense-course-builder-hero p {
  margin: 8px 0 0;
}

.ulicense-builder-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.ulicense-builder-steps button {
  padding: 11px 12px;
  border-radius: 14px;
  border: 1px solid #dbeafe;
  background: #f8fbff;
  font-size: 12px;
  font-weight: 900;
  color: #1f2937;
  cursor: pointer;
  text-align: left;
}

.ulicense-builder-steps button.active {
  background: var(--ulicense-primary);
  color: #fff;
  border-color: var(--ulicense-primary);
  box-shadow: 0 14px 26px rgba(5,150,105,.18);
}

.ulicense-builder-panel {
  margin-bottom: 18px;
  border-radius: 22px;
  overflow: visible;
  border-color: #dcefe8;
  box-shadow: 0 20px 50px rgba(17,24,39,.065);
}

.ulicense-builder-panel h3 {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 22px;
  margin-bottom: 4px;
}

.ulicense-builder-panel > .ulicense-muted {
  margin-top: 0;
  margin-bottom: 20px;
}

.ulicense-lessons-toolbar {
  margin-bottom: 18px;
  padding: 22px 24px;
  border-radius: 22px;
  border: 1px solid #dcefe8;
  background: linear-gradient(135deg, #fff, #f2fbf7);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  box-shadow: 0 18px 42px rgba(17,24,39,.055);
}

.ulicense-lessons-toolbar h2,
.ulicense-lessons-toolbar p {
  margin: 0;
}

.ulicense-lessons-toolbar p {
  margin-top: 8px;
}

.ulicense-lesson-editor-list {
  display: grid;
  gap: 18px;
}

.ulicense-lesson-editor {
  border-radius: 22px;
  border-color: #dcefe8;
  box-shadow: 0 18px 44px rgba(17,24,39,.055);
}

.ulicense-lesson-editor-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid #edf4f1;
}

.ulicense-lesson-editor-head h3 {
  margin: 10px 0 4px;
  font-size: 22px;
}

.ulicense-lesson-editor-head p {
  margin: 0;
  color: var(--ulicense-muted);
  font-weight: 750;
}

.ulicense-lesson-controls {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.ulicense-feature-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}

.ulicense-feature-toggle {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 16px;
  border: 1px solid #e3edf2;
  border-radius: 16px;
  background: linear-gradient(180deg, #fff, #f8fafc);
  cursor: pointer;
}

.ulicense-feature-toggle input {
  margin-top: 4px;
}

.ulicense-feature-toggle strong,
.ulicense-feature-toggle small {
  display: block;
}

.ulicense-feature-toggle small {
  margin-top: 3px;
  color: var(--ulicense-muted);
  line-height: 1.35;
}

.ulicense-stat-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  margin-bottom: 24px;
}

.ulicense-stat {
  padding: 18px;
  border-radius: 18px;
  position: relative;
  overflow: hidden;
}

.ulicense-stat:after {
  content: "";
  position: absolute;
  inset: auto -20px -35px auto;
  width: 92px;
  height: 92px;
  background: rgba(5, 150, 105, .09);
  border-radius: 999px;
}

.ulicense-stat strong {
  display: block;
  font-size: 28px;
}

.ulicense-shortcodes {
  margin-bottom: 24px;
}

.ulicense-shortcode-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin-top: 14px;
}

.ulicense-shortcode-item {
  display: grid;
  gap: 9px;
  padding: 14px;
  border: 1px solid var(--ulicense-line);
  border-radius: 14px;
  background: #f9fafb;
}

.ulicense-shortcode-item code {
  display: block;
  padding: 11px 12px;
  border-radius: 10px;
  background: #111827;
  color: #d1fae5;
  font-weight: 850;
  white-space: nowrap;
  overflow-x: auto;
}

.ulicense-offers-section {
  margin-top: 34px;
}

.ulicense-offer-card {
  display: grid;
  gap: 12px;
}

.ulicense-offer-card ul {
  margin: 0;
  padding-left: 18px;
  color: var(--ulicense-muted);
}

.ulicense-offer-courses {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ulicense-offer-courses span {
  padding: 6px 9px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 12px;
  font-weight: 850;
}

.ulicense-upsell-check {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 12px;
  border: 1px solid #dbeafe;
  border-radius: 14px;
  background: #f8fbff;
  font-weight: 850;
}

.ulicense-live-panel {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-top: 12px;
  padding: 14px;
  border: 1px solid #d7f4e7;
  border-radius: 16px;
  background: linear-gradient(135deg, #ffffff, #ecfdf5);
}

.ulicense-live-panel strong {
  display: block;
  margin-top: 6px;
}

.ulicense-activity-list {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.ulicense-activity-list article {
  display: grid;
  grid-template-columns: minmax(140px, .8fr) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid #edf2f7;
  border-radius: 14px;
  background: #fff;
}

.ulicense-activity-list span,
.ulicense-activity-list small {
  color: var(--ulicense-muted);
}

.ulicense-resource-admin,
.ulicense-resource-list {
  margin-bottom: 18px;
}

.ulicense-json-preview {
  max-height: 260px;
  overflow: auto;
  padding: 12px;
  border-radius: 12px;
  background: #111827;
  color: #d1fae5;
  font-size: 12px;
  line-height: 1.45;
}

.ulicense-quiz-box,
.ulicense-comments-box {
  display: grid;
  gap: 14px;
}

.ulicense-quiz-question {
  display: grid;
  gap: 9px;
  padding: 14px;
  border: 1px solid #edf2f7;
  border-radius: 14px;
  background: #f9fafb;
}

.ulicense-quiz-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.ulicense-quiz-options label {
  padding: 8px 10px;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  background: #fff;
  font-weight: 800;
}

.ulicense-quiz-builder-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 20px;
  align-items: start;
}

.ulicense-quiz-builder-preview {
  position: sticky;
  top: 16px;
}

.ulicense-quiz-builder-preview h4 {
  margin: 0 0 10px;
}

.ulicense-quiz-q-card {
  margin-bottom: 12px;
}

.ulicense-quiz-result {
  margin: 12px 0;
  padding: 12px 14px;
  border-radius: 12px;
}

.ulicense-quiz-result.is-passed {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
}

.ulicense-quiz-result.is-failed {
  background: #fef2f2;
  color: #b91c1c;
  border: 1px solid #fecaca;
}

@media (max-width: 1100px) {
  .ulicense-quiz-builder-layout {
    grid-template-columns: 1fr;
  }

  .ulicense-quiz-builder-preview {
    position: static;
  }
}

.ulicense-comments-list {
  display: grid;
  gap: 10px;
}

.ulicense-comments-list article {
  padding: 12px;
  border: 1px solid #edf2f7;
  border-radius: 14px;
  background: #fff;
}

.ulicense-comments-list p {
  margin: 5px 0;
  color: #374151;
}

.ulicense-comments-list small {
  color: var(--ulicense-muted);
}

.ulicense-analytics-grid {
  grid-template-columns: minmax(0, 1.3fr) minmax(260px, .7fr);
  margin-bottom: 24px;
}

.ulicense-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.ulicense-field {
  display: grid;
  gap: 8px;
  margin-bottom: 14px;
}

.ulicense-field label {
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  color: #475569;
}

.ulicense-input,
.ulicense-field input,
.ulicense-field select,
.ulicense-field textarea {
  width: 100%;
  min-height: 46px;
  border: 1px solid #dbe3ee;
  background: linear-gradient(180deg, #fff, #fbfdff);
  border-radius: 14px;
  padding: 12px 14px;
  color: var(--ulicense-ink);
  font-weight: 650;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.ulicense-input:focus,
.ulicense-field input:focus,
.ulicense-field select:focus,
.ulicense-field textarea:focus {
  outline: 0;
  border-color: #0ea5e9;
  background: #fff;
  box-shadow: 0 0 0 4px var(--ulicense-focus);
}

.ulicense-field select[multiple],
select[multiple].ulicense-input {
  min-height: 128px;
  padding: 10px;
}

.ulicense-field select[multiple] option,
select[multiple].ulicense-input option {
  padding: 8px 10px;
  border-radius: 8px;
}

.ulicense-field textarea {
  min-height: 110px;
}

.ulicense-premium-admin-form {
  margin-bottom: 18px;
  padding: 20px;
}

.ulicense-manual-access-panel {
  display: grid;
  gap: 14px;
}

.ulicense-create-client {
  border-radius: 18px;
}

.ulicense-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border: 1px solid var(--ulicense-line);
  border-radius: 14px;
  overflow: hidden;
}

.ulicense-table th,
.ulicense-table td {
  text-align: left;
  padding: 14px;
  border-bottom: 1px solid #f3f4f6;
  vertical-align: top;
}

.ulicense-table th {
  font-size: 11px;
  text-transform: uppercase;
  color: var(--ulicense-muted);
  background: #f9fafb;
}

.ulicense-table td:last-child {
  min-width: 260px;
}

.ulicense-table td:last-child .ulicense-btn,
.ulicense-table td:last-child .ulicense-input {
  margin: 3px;
}

.ulicense-crm-hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 18px;
  margin-bottom: 20px;
  padding: 22px;
  border: 1px solid #dff3ea;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(236,253,245,.96), rgba(255,255,255,.92));
  box-shadow: 0 18px 45px rgba(17, 24, 39, .05);
}

.ulicense-crm-hero .ulicense-input {
  max-width: 340px;
  background: #fff;
}

.ulicense-crm-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
  gap: 18px;
}

.ulicense-client-card {
  background: #fff;
  border: 1px solid var(--ulicense-line);
  border-radius: 20px;
  padding: 20px;
  box-shadow: 0 18px 40px rgba(17, 24, 39, .055);
}

.ulicense-client-head {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
}

.ulicense-client-head h3,
.ulicense-client-head p {
  margin: 0;
}

.ulicense-avatar {
  width: 48px;
  height: 48px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--ulicense-primary), var(--ulicense-secondary));
  color: #fff;
  font-weight: 950;
  box-shadow: 0 12px 24px rgba(5, 150, 105, .2);
}

.ulicense-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

.ulicense-status {
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  border: 1px solid;
}

.ulicense-status.is-active {
  color: #047857;
  background: #ecfdf5;
  border-color: #a7f3d0;
}

.ulicense-status.is-suspended {
  color: #dc2626;
  background: #fff1f2;
  border-color: #fecdd3;
}

.ulicense-client-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.ulicense-client-meta div {
  padding: 12px;
  border-radius: 14px;
  background: #f9fafb;
  border: 1px solid #eef2f7;
}

.ulicense-client-meta span {
  display: block;
  color: var(--ulicense-muted);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
  margin-bottom: 5px;
}

.ulicense-client-meta strong {
  display: block;
  font-size: 13px;
  line-height: 1.35;
}

.ulicense-client-progress,
.ulicense-client-access {
  margin-bottom: 14px;
}

.ulicense-client-access {
  min-height: 32px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.ulicense-client-actions {
  display: grid;
  gap: 9px;
  padding-top: 14px;
  border-top: 1px solid #eef2f7;
}

.ulicense-action-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.ulicense-action-row .ulicense-input {
  flex: 1 1 220px;
}

.ulicense-action-row .ulicense-btn {
  min-height: 38px;
  padding: 8px 12px;
}

.ulicense-create-client {
  display: grid;
  grid-template-columns: minmax(240px, 1.2fr) repeat(3, minmax(180px, 1fr));
  gap: 14px;
  align-items: end;
  margin-bottom: 18px;
}

.ulicense-create-client > div:first-child {
  align-self: center;
}

.ulicense-create-client h3,
.ulicense-create-client p {
  margin: 0;
}

.ulicense-resource-builder {
  display: grid;
  gap: 18px;
  margin-top: 18px;
}

.ulicense-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 99990;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(15, 23, 42, .48);
}

.ulicense-import-modal {
  width: min(980px, 100%);
  max-height: calc(100vh - 48px);
  overflow: auto;
  padding: 20px;
  border: 1px solid #dcefe8;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 28px 80px rgba(15, 23, 42, .28);
}

.ulicense-import-modal .ulicense-editor-top {
  margin: -6px -6px 18px;
}

.ulicense-import-assist {
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px dashed #b8e6d2;
  border-radius: 8px;
  background: #f8fffc;
}

.ulicense-import-assist .ulicense-actions {
  margin-top: 10px;
}

.ulicense-import-diagnostics {
  margin: 8px 0 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: #eef8f3;
  color: #1d5c42;
  font-size: 13px;
  font-weight: 700;
}

.ulicense-import-summary {
  display: grid;
  gap: 4px;
  margin: 16px 0;
  padding: 14px;
  border: 1px solid #d7f4e7;
  border-radius: 8px;
  background: #f2fbf7;
}

.ulicense-import-summary span {
  color: var(--ulicense-muted);
  font-weight: 750;
}

.ulicense-import-preview {
  display: grid;
  gap: 10px;
}

.ulicense-import-row {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(280px, 1fr);
  gap: 12px;
  padding: 12px;
  border: 1px solid #edf4f1;
  border-radius: 8px;
  background: #fff;
}

.ulicense-import-current,
.ulicense-import-suggestion {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.ulicense-import-current small,
.ulicense-import-suggestion small {
  color: var(--ulicense-muted);
  font-weight: 900;
  text-transform: uppercase;
}

.ulicense-import-suggestion {
  padding: 12px;
  border: 1px solid #d7f4e7;
  border-radius: 8px;
  background: #f8fffc;
}

.ulicense-import-suggestion strong,
.ulicense-import-suggestion p,
.ulicense-import-suggestion span,
.ulicense-import-suggestion em {
  margin: 0;
  overflow-wrap: anywhere;
}

.ulicense-import-suggestion span,
.ulicense-import-suggestion em {
  color: var(--ulicense-muted);
  font-size: 13px;
}

.ulicense-resource-builder h4 {
  margin: 0;
}

.ulicense-resource-row {
  display: grid;
  grid-template-columns: minmax(160px, .6fr) minmax(220px, 1fr) auto;
  gap: 8px;
  margin-top: 8px;
}

.ulicense-lesson-toggle {
  margin-bottom: 14px;
}

.ulicense-toast {
  position: fixed;
  z-index: 99999;
  top: 88px;
  right: 24px;
  background: #111827;
  color: #fff;
  border-radius: 14px;
  padding: 13px 16px;
  font-weight: 800;
  box-shadow: 0 18px 45px rgba(0,0,0,.22);
}

.ulicense-empty {
  padding: 40px;
  text-align: center;
  border: 1px dashed #d1d5db;
  background: #fff;
  border-radius: 16px;
}

.ulicense-login-panel {
  min-height: 420px;
  display: grid;
  place-items: center;
}

.ulicense-login-panel .ulicense-card {
  width: min(100%, 460px);
  text-align: center;
  padding: 34px;
}

.ulicense-login-panel .ulicense-logo-mark {
  margin: 0 auto 16px;
}

.ulicense-login-panel .ulicense-actions {
  justify-content: center;
  margin-top: 18px;
}

.ulicense-skeleton {
  min-height: 180px;
  border-radius: 16px;
  background: linear-gradient(90deg, #f3f4f6, #fff, #f3f4f6);
  background-size: 240% 100%;
  animation: ulicense-shimmer 1.4s infinite linear;
}

@keyframes ulicense-shimmer {
  to { background-position: -240% 0; }
}

@media (max-width: 900px) {
  .ulicense-dashboard,
  .ulicense-player-layout,
  .ulicense-admin,
  .ulicense-cart-layout,
  .ulicense-auth-shell {
    grid-template-columns: 1fr;
  }
  .ulicense-cart-summary {
    position: static;
  }
  .ulicense-cart-item {
    flex-direction: column;
  }
  .ulicense-cart-price {
    width: 100%;
    justify-content: space-between;
  }
  .ulicense-sidebar,
  .ulicense-admin-sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--ulicense-line);
  }
  .ulicense-lesson-sidebar {
    border-left: 0;
    border-top: 1px solid var(--ulicense-line);
  }
  .ulicense-form-grid {
    grid-template-columns: 1fr;
  }
  .ulicense-auth-copy,
  .ulicense-auth-panel,
  .ulicense-premium-admin-form {
    padding: 22px;
  }
  .ulicense-coupon-row {
    grid-template-columns: 1fr;
  }
  .ulicense-topbar {
    align-items: flex-start;
    flex-direction: column;
  }
  .ulicense-nav-actions {
    flex-wrap: wrap;
    width: 100%;
  }
  .ulicense-nav-actions .ulicense-btn,
  .ulicense-premium-form .ulicense-btn {
    flex: 1 1 auto;
  }
  .ulicense-editor-top,
  .ulicense-lessons-toolbar,
  .ulicense-lesson-editor-head {
    align-items: stretch;
    flex-direction: column;
  }
  .ulicense-editor-top .ulicense-actions,
  .ulicense-lesson-controls {
    width: 100%;
  }
  .ulicense-editor-top .ulicense-actions .ulicense-btn,
  .ulicense-lessons-toolbar .ulicense-btn {
    flex: 1;
  }
  .ulicense-player-head {
    align-items: center;
    flex-direction: column;
    text-align: center;
  }
  .ulicense-crm-hero {
    align-items: stretch;
    flex-direction: column;
  }
  .ulicense-crm-grid {
    grid-template-columns: 1fr;
  }
  .ulicense-client-meta {
    grid-template-columns: 1fr;
  }
  .ulicense-learning-hero,
  .ulicense-create-client {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: stretch;
  }
  .ulicense-resource-row {
    grid-template-columns: 1fr;
  }
  .ulicense-import-row {
    grid-template-columns: 1fr;
  }
}

/* Paginacion de cursos */
.ulicense-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 26px;
}

.ulicense-page-numbers {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.ulicense-page-btn,
.ulicense-page-num {
  min-width: 40px;
  height: 40px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid var(--ulicense-line, #e2e8f0);
  background: #fff;
  color: #0f172a;
  font-weight: 700;
  cursor: pointer;
  transition: all .16s ease;
}

.ulicense-page-num.is-active {
  background: linear-gradient(135deg, #059669, #10b981);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 8px 18px rgba(5, 150, 105, .28);
}

.ulicense-page-btn:hover:not(:disabled),
.ulicense-page-num:hover:not(.is-active) {
  border-color: rgba(5, 150, 105, .45);
  transform: translateY(-1px);
}

.ulicense-page-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.ulicense-page-info {
  margin-left: 6px;
  font-size: 12px;
  color: #64748b;
  font-weight: 600;
}

/* Modal generico */
.ulicense-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 99995;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(15, 23, 42, .55);
  backdrop-filter: blur(4px);
  animation: ulicense-fade-in .18s ease;
}

@keyframes ulicense-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

.ulicense-modal {
  width: min(960px, 100%);
  max-height: calc(100vh - 48px);
  overflow: auto;
  background: #f8fafc;
  border-radius: 22px;
  box-shadow: 0 32px 90px rgba(15, 23, 42, .35);
}

.ulicense-modal-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  background: #fff;
  border-bottom: 1px solid #e9eef5;
  border-radius: 22px 22px 0 0;
}

.ulicense-modal-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 850;
}

/* Estadisticas del alumno */
.ulicense-stats-modal {
  padding-bottom: 24px;
}

.ulicense-stats-loading {
  padding: 40px 24px;
  text-align: center;
}

.ulicense-stats-profile {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 18px;
  align-items: center;
  padding: 22px 24px;
}

.ulicense-avatar-lg {
  width: 72px;
  height: 72px;
  font-size: 24px;
}

.ulicense-stats-chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 8px;
}

.ulicense-stats-lastseen {
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ulicense-stats-lastseen strong {
  font-size: 16px;
}

.ulicense-stats-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
  padding: 0 24px;
}

.ulicense-stat-metric {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 16px;
  background: #fff;
  border: 1px solid #e9eef5;
  border-radius: 16px;
}

.ulicense-stat-value {
  font-size: 24px;
  font-weight: 850;
  color: #0f172a;
  line-height: 1.1;
}

.ulicense-stat-label {
  font-size: 12px;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.ulicense-stat-hint {
  font-size: 11px;
  color: #94a3b8;
}

.ulicense-stats-cols {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 16px;
  padding: 22px 24px 0;
}

.ulicense-stats-col h4 {
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #475569;
}

.ulicense-stats-courses {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ulicense-stats-course {
  padding: 14px 16px;
  background: #fff;
  border: 1px solid #e9eef5;
  border-radius: 16px;
}

.ulicense-stats-course .ulicense-progress {
  margin: 10px 0 8px;
}

.ulicense-stats-course-meta {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 12px;
  color: #64748b;
}

.ulicense-pill.is-done {
  background: rgba(5, 150, 105, .14);
  color: #047857;
}

.ulicense-stats-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.ulicense-stats-timeline li {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  font-size: 13px;
}

.ulicense-timeline-dot {
  width: 10px;
  height: 10px;
  margin-top: 5px;
  border-radius: 50%;
  background: #10b981;
  flex: 0 0 auto;
  box-shadow: 0 0 0 4px rgba(16, 185, 129, .15);
}

@media (max-width: 720px) {
  .ulicense-stats-profile {
    grid-template-columns: auto 1fr;
  }
  .ulicense-stats-lastseen {
    grid-column: 1 / -1;
    text-align: left;
  }
  .ulicense-stats-cols {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================
   MEJORAS ULicense Academy Pro — Parche v1.3.2+
   ========================================================== */

/* --- Recuperación de contraseña --- */
.ulicense-success-text {
  color: #059669;
  font-size: 13px;
  margin: 6px 0;
}

/* --- Toggle de contraseña --- */
.ulicense-field-password { position: relative; }
.ulicense-password-wrap {
  display: flex;
  align-items: center;
  position: relative;
}
.ulicense-password-wrap .ulicense-pw-input {
  flex: 1;
  padding-right: 40px;
}
.ulicense-toggle-pw {
  position: absolute;
  right: 8px;
  background: none;
  border: none;
  cursor: pointer;
  color: #94a3b8;
  padding: 4px;
  display: flex;
  align-items: center;
  border-radius: 4px;
  transition: color .15s;
}
.ulicense-toggle-pw:hover { color: #4f46e5; }

/* --- Búsqueda global en topbar --- */
.ulicense-topbar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.ulicense-topbar-search {
  flex: 1;
  min-width: 200px;
  max-width: 380px;
}
.ulicense-search-wrap { position: relative; }
.ulicense-search-icon {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  pointer-events: none;
}
.ulicense-search-input {
  width: 100%;
  padding: 7px 12px 7px 34px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: 13px;
  background: #f8fafc;
  transition: border-color .15s, background .15s;
  outline: none;
}
.ulicense-search-input:focus {
  border-color: #4f46e5;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(79,70,229,.1);
}
.ulicense-search-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0; right: 0;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,.1);
  z-index: 999;
  max-height: 320px;
  overflow-y: auto;
}
.ulicense-search-result {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 9px 14px;
  border: none;
  background: none;
  cursor: pointer;
  text-align: left;
  font-size: 13px;
  border-bottom: 1px solid #f1f5f9;
  transition: background .12s;
}
.ulicense-search-result:hover { background: #f8fafc; }
.ulicense-search-result:last-child { border-bottom: none; }
.ulicense-search-result-type {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #4f46e5;
  background: #ede9fe;
  padding: 2px 7px;
  border-radius: 4px;
  white-space: nowrap;
}
.ulicense-search-result-title { font-weight: 500; color: #1e293b; }
.ulicense-search-result-sub { font-size: 11px; color: #94a3b8; }

/* --- Navegación anterior / siguiente lección --- */
.ulicense-lesson-nav {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 32px;
  padding-top: 20px;
  border-top: 1px solid #e2e8f0;
}
.ulicense-lesson-nav-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  flex: 0 1 auto;
  max-width: 48%;
  text-align: left;
}
.ulicense-lesson-nav-label {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ulicense-lesson-nav-label small {
  font-size: 11px;
  opacity: .65;
  font-weight: 400;
}
.ulicense-lesson-nav-label strong {
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 200px;
}

/* --- Descargables mejorados (fix crítico) --- */
.ulicense-downloads {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
  margin-top: 10px;
}
.ulicense-download-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  text-align: left;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  cursor: pointer;
  transition: border-color .15s, background .15s;
  width: 100%;
}
.ulicense-download-card:hover {
  border-color: #4f46e5;
  background: #f5f3ff;
}
.ulicense-download-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: #ede9fe;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #4f46e5;
}
.ulicense-download-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.ulicense-download-body strong {
  font-size: 13px;
  font-weight: 500;
  color: #1e293b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ulicense-download-body .ulicense-muted {
  font-size: 11px;
}

/* --- Notas por lección --- */
.ulicense-notes-panel {
  margin-top: 20px;
}
.ulicense-notes-textarea {
  width: 100%;
  min-height: 120px;
  padding: 10px 12px;
  font-size: 13px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  resize: vertical;
  font-family: inherit;
  background: #f8fafc;
  transition: border-color .15s;
  outline: none;
  margin-top: 8px;
}
.ulicense-notes-textarea:focus {
  border-color: #4f46e5;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(79,70,229,.1);
}

/* --- Reseñas --- */
.ulicense-reviews-panel { margin-top: 20px; }
.ulicense-review-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.ulicense-review-avg {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
}
.ulicense-star-filled { color: #f59e0b; }
.ulicense-star-empty { color: #d1d5db; }
.ulicense-star-display { font-size: 16px; letter-spacing: 2px; }
.ulicense-star-picker {
  display: flex;
  gap: 4px;
  margin: 8px 0;
}
.ulicense-star-btn {
  font-size: 28px;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  cursor: pointer;
  color: #d1d5db;
  padding: 0 3px;
  margin: 0;
  transition: color .12s ease, transform .12s ease;
  line-height: 1;
  display: inline-block;
  vertical-align: middle;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0 !important;
}
.ulicense-star-btn:hover,
.ulicense-star-btn.active {
  color: #f59e0b;
  transform: scale(1.2);
  background: transparent !important;
  outline: none !important;
  box-shadow: none !important;
}
.ulicense-star-btn:focus {
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}
.ulicense-review-form {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 14px 16px;
  margin-bottom: 20px;
}
.ulicense-reviews-list { display: flex; flex-direction: column; gap: 14px; }
.ulicense-review-item {
  padding: 12px 0;
  border-bottom: 1px solid #f1f5f9;
}
.ulicense-review-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  margin-bottom: 6px;
}

/* --- Perfil editable --- */
.ulicense-profile-layout {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 24px;
  max-width: 900px;
  margin: 0 auto;
}
.ulicense-profile-sidebar {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ulicense-profile-avatar {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 20px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
}
.ulicense-avatar-img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid #fff;
  box-shadow: 0 2px 12px rgba(0,0,0,.1);
}
.ulicense-avatar-initials {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 32px;
  font-weight: 600;
}
.ulicense-profile-stat {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  font-size: 14px;
}
.ulicense-profile-content { display: flex; flex-direction: column; gap: 20px; }

/* --- Referidos --- */
.ulicense-referral-box {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ulicense-referral-url {
  display: flex;
  gap: 8px;
}
.ulicense-referral-url input {
  flex: 1;
  font-size: 13px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 8px 10px;
  color: #475569;
}
.ulicense-referral-stats {
  display: flex;
  gap: 20px;
}
.ulicense-referral-stats .ulicense-stat {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ulicense-referral-stats strong { font-size: 22px; font-weight: 600; }

/* --- KPIs de ingresos en dashboard --- */
.ulicense-revenue-panel { border-left: 3px solid #4f46e5; }
.ulicense-text-success { color: #059669; }
.ulicense-text-danger { color: #dc2626; }
.ulicense-pill-success { background: rgba(5,150,105,.14); color: #047857; }
.ulicense-cert-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 14px 18px;
  background: linear-gradient(135deg, #f0fdf4, #dcfce7);
  border: 1px solid #86efac;
  border-radius: 10px;
  margin-bottom: 16px;
}

/* --- Admin: moderación de reseñas --- */
.ulicense-star-display { letter-spacing: 3px; }
.ulicense-btn-danger {
  background: #fef2f2;
  color: #dc2626;
  border-color: #fca5a5;
}
.ulicense-btn-danger:hover { background: #fee2e2; border-color: #f87171; }

/* --- Alert banner --- */
.ulicense-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 8px;
  font-size: 13px;
  color: #92400e;
}

/* --- Catálogo: sort option visible --- */
.ulicense-catalog-filters select { min-width: 130px; }

/* --- Responsive mejoras --- */
@media (max-width: 768px) {
  .ulicense-topbar { flex-wrap: wrap; }
  .ulicense-topbar-search { order: 3; flex: 1 1 100%; max-width: 100%; }
  .ulicense-profile-layout { grid-template-columns: 1fr; }
  .ulicense-lesson-nav { flex-direction: column; }
  .ulicense-lesson-nav-btn { max-width: 100%; }
  .ulicense-search-dropdown { position: fixed; top: auto; left: 8px; right: 8px; }
}

/* ── Tooltip dentro de botones de steps del builder ─────── */
.ulicense-builder-steps button .ulicense-tip {
  top: 0;
  margin-left: 6px;
  background: rgba(255,255,255,.18);
  color: inherit;
  border-color: rgba(255,255,255,.3);
}
.ulicense-builder-steps button.active .ulicense-tip {
  background: rgba(255,255,255,.25);
  border-color: rgba(255,255,255,.5);
}

/* ── Tooltip dentro de th de tablas ─────────────────────── */
th .ulicense-tip {
  margin-left: 4px;
  background: rgba(79,70,229,.1);
  color: #4f46e5;
  border-color: rgba(79,70,229,.25);
}

/* ── Tooltip dentro de statCard ─────────────────────────── */
.ulicense-stat .ulicense-tip {
  background: rgba(255,255,255,.5);
  color: #4f46e5;
  border-color: rgba(79,70,229,.2);
  top: 0;
}

/* ── Tooltip en h1/h2/h3 de sección ─────────────────────── */
.ulicense-section-title .ulicense-tip,
h1 .ulicense-tip, h2 .ulicense-tip, h3 .ulicense-tip {
  background: #f5f3ff;
  color: #7c3aed;
  border-color: #ddd6fe;
}

/* ═══════════════════════════════════════════════════════
   FIXES & MEJORAS — v1.4.1
   ═══════════════════════════════════════════════════════ */

/* ── Fix: toggle mostrar/ocultar contraseña ─────────── */
.ulicense-password-wrap {
  display: flex;
  align-items: stretch;
  border: 1.5px solid #d1d5db;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  transition: border-color .15s, box-shadow .15s;
}
.ulicense-password-wrap:focus-within {
  border-color: #4f46e5;
  box-shadow: 0 0 0 3px rgba(79,70,229,.12);
}
.ulicense-password-wrap .ulicense-pw-input {
  flex: 1;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent;
  padding: 11px 14px;
  font-size: 14px;
  color: #1e293b;
  min-width: 0;
}
.ulicense-password-wrap .ulicense-pw-input::placeholder { color: #94a3b8; }
.ulicense-toggle-pw {
  flex-shrink: 0;
  width: 40px;
  height: 100%;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  border-left: 1px solid #e2e8f0;
  cursor: pointer;
  color: #94a3b8;
  transition: color .15s, background .15s;
  padding: 0;
  align-self: stretch;
  border-radius: 0 8px 8px 0;
  -webkit-appearance: none;
  appearance: none;
  outline: none !important;
}
.ulicense-toggle-pw:hover { color: #4f46e5; background: #f0f0ff; }
.ulicense-toggle-pw:focus { outline: none !important; box-shadow: none !important; }
.ulicense-toggle-pw svg { pointer-events: none; display: block; }

/* ── Fix: filtro catálogo — chip de certificado ──────── */
.ulicense-catalog-filters {
  padding: 18px;
  background: #fff;
  border: 1px solid #e8ebf2;
  border-radius: 16px;
  margin-bottom: 22px;
  box-shadow: 0 6px 22px rgba(15,23,42,.05);
}
/* Buscador destacado */
.ulicense-cf-search {
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 14px;
}
.ulicense-cf-search > svg {
  position: absolute;
  left: 16px;
  color: #94a3b8;
  pointer-events: none;
}
.ulicense-cf-search input {
  width: 100%;
  height: 48px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #f8fafc;
  padding: 0 16px 0 44px;
  font-size: 14.5px;
  color: #0f172a;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.ulicense-cf-search input:focus {
  outline: none;
  border-color: #4f46e5;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(79,70,229,.12);
}
/* Rejilla de controles */
.ulicense-cf-controls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}
.ulicense-cf-field { display: flex; flex-direction: column; gap: 5px; }
.ulicense-cf-field > label {
  font-size: 11.5px;
  font-weight: 600;
  color: #64748b;
  letter-spacing: .2px;
  padding-left: 2px;
}
.ulicense-cf-field input,
.ulicense-cf-field select {
  height: 42px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  padding: 0 12px;
  font-size: 13.5px;
  color: #0f172a;
  width: 100%;
  transition: border-color .15s, box-shadow .15s;
  cursor: pointer;
}
.ulicense-cf-field input { cursor: text; }
.ulicense-cf-field input:focus,
.ulicense-cf-field select:focus {
  outline: none;
  border-color: #4f46e5;
  box-shadow: 0 0 0 3px rgba(79,70,229,.1);
}
.ulicense-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 38px;
  padding: 0 14px;
  border-radius: 99px;
  border: 1.5px solid #e2e8f0;
  background: #fff;
  color: #475569;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
}
.ulicense-filter-chip:hover {
  border-color: #4f46e5;
  color: #4f46e5;
  background: #f5f3ff;
}
.ulicense-filter-chip.is-active {
  border-color: #4f46e5;
  background: #4f46e5;
  color: #fff;
}

/* ── Editor visual (TinyMCE) del contenido de la lección ── */
.ulicense-rte-field { grid-column: 1 / -1; }
.ulicense-rte-field textarea.ulicense-rte { min-height: 200px; line-height: 1.6; }
.ulicense-rte-field .wp-editor-wrap,
.ulicense-rte-field .mce-tinymce.mce-container,
.ulicense-rte-field .quicktags-toolbar { border-radius: 12px; }
.ulicense-rte-field .mce-tinymce.mce-container { box-shadow: none; border: 1px solid #e2e8f0; overflow: hidden; }
.ulicense-rte-field .mce-panel { background-image: none; }
.ulicense-rte-field .mce-toolbar-grp,
.ulicense-rte-field .mce-menubar { background: #f8fafc; border-bottom: 1px solid #eef1f6; }
.ulicense-rte-field .mce-btn button { color: #334155; }
.ulicense-rte-field .mce-btn:hover button { color: #4f46e5; }
.ulicense-rte-field .wp-editor-tabs { margin-bottom: 6px; }
.ulicense-rte-field .switch-html, .ulicense-rte-field .switch-tmce {
  border-radius: 8px 8px 0 0 !important; font-weight: 600;
}

/* Vista "Código" (Quicktags): que la barra de botones se vea horizontal y no estirada.
   El formulario admin fuerza inputs a width:100%; aquí lo revertimos solo para los botones. */
.ulicense-rte-field .quicktags-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-bottom: 0;
  border-radius: 12px 12px 0 0;
  min-height: 0;
}
.ulicense-rte-field .quicktags-toolbar input.ed_button,
.ulicense-rte-field .quicktags-toolbar input.button,
.ulicense-rte-field .quicktags-toolbar button {
  width: auto !important;
  min-width: 0 !important;
  max-width: none;
  display: inline-flex !important;
  align-items: center;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 5px 11px !important;
  font-size: 12.5px !important;
  line-height: 1.4 !important;
  border: 1px solid #d8dee9 !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: #334155 !important;
  box-shadow: none !important;
  cursor: pointer;
}
.ulicense-rte-field .quicktags-toolbar input.ed_button:hover,
.ulicense-rte-field .quicktags-toolbar input.button:hover {
  border-color: #4f46e5 !important;
  color: #4f46e5 !important;
  background: #f5f3ff !important;
}
/* El textarea de código pegado a su barra, con buen alto y monoespaciado */
.ulicense-rte-field .wp-editor-area,
.ulicense-rte-field textarea.wp-editor-area {
  border: 1px solid #e2e8f0 !important;
  border-radius: 0 0 12px 12px !important;
  min-height: 240px;
  padding: 12px 14px !important;
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  background: #fff !important;
}
/* Pestañas Visual / Código alineadas a la derecha y prolijas */
.ulicense-rte-field .wp-editor-tools { padding-bottom: 4px; overflow: visible; }
.ulicense-rte-field .wp-editor-tabs { float: right; }
.ulicense-rte-field .switch-html, .ulicense-rte-field .switch-tmce {
  height: auto; padding: 6px 14px; font-size: 12.5px;
}
.ulicense-filter-chip.is-active svg { stroke: #fff; }
/* Pie del menú de filtros: chip de certificado + acciones */
.ulicense-cf-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid #eef1f6;
}
.ulicense-cf-actions { display: flex; align-items: center; gap: 10px; }
.ulicense-cf-clear {
  border: 0;
  background: transparent;
  color: #64748b;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  padding: 9px 12px;
  border-radius: 9px;
  transition: background .15s, color .15s;
}
.ulicense-cf-clear:hover { background: #f1f5f9; color: #0f172a; }
.ulicense-cf-apply {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  padding: 0 22px;
  border: 0;
  border-radius: 11px;
  background: linear-gradient(135deg, #4f46e5, #6d5efc);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(79,70,229,.3);
  transition: filter .15s, transform .15s;
}
.ulicense-cf-apply:hover { filter: brightness(1.06); transform: translateY(-1px); }
.ulicense-cf-apply:active { transform: translateY(0); }

/* ── Vista del alumno — layout principal ─────────────── */
.ulicense-student-layout {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 24px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px 16px;
  align-items: start;
}

/* ── Sidebar del alumno ──────────────────────────────── */
.ulicense-student-sidebar {
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: sticky;
  top: 20px;
}
.ulicense-student-profile-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
}
.ulicense-student-avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.5px;
}
.ulicense-student-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ulicense-student-info h3 {
  font-size: 15px;
  font-weight: 600;
  color: #1e293b;
  margin: 0 0 2px;
}
.ulicense-student-info p { font-size: 12px; margin: 0; }

/* ── XP / nivel ──────────────────────────────────────── */
.ulicense-xp-block {
  padding: 14px 16px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}
.ulicense-xp-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.ulicense-xp-label {
  font-size: 13px;
  font-weight: 600;
  color: #4f46e5;
  background: #f0f0ff;
  padding: 2px 10px;
  border-radius: 99px;
}
.ulicense-xp-value { font-size: 13px; font-weight: 600; color: #1e293b; }
.ulicense-xp-bar {
  height: 6px;
  border-radius: 99px;
  background: #e2e8f0;
  overflow: hidden;
}
.ulicense-xp-fill {
  height: 100%;
  border-radius: 99px;
  background: linear-gradient(90deg, #4f46e5, #7c3aed);
  transition: width .5s cubic-bezier(.34,1.56,.64,1);
}
.ulicense-xp-next { font-size: 11px; color: #94a3b8; margin: 6px 0 0; }

/* ── Stats rápidas (3 columnas) ─────────────────────── */
.ulicense-student-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
.ulicense-student-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 10px 4px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  text-align: center;
}
.ulicense-student-stat strong { font-size: 20px; font-weight: 700; color: #1e293b; }
.ulicense-student-stat span { font-size: 10px; color: #94a3b8; text-transform: uppercase; letter-spacing: .04em; }

/* ── Logros (sidebar) ────────────────────────────────── */
.ulicense-badges-panel {
  padding: 12px 14px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}
.ulicense-badges-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: #94a3b8; margin: 0 0 8px; }
.ulicense-badges-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.ulicense-badge-item {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  background: #fef9c3;
  border: 1px solid #fde68a;
  border-radius: 99px;
  font-size: 12px;
  color: #92400e;
}
.ulicense-badge-icon { font-size: 14px; }
.ulicense-badge-name { font-size: 11px; font-weight: 500; }

/* ── Botones de acción sidebar ───────────────────────── */
.ulicense-student-actions { display: flex; flex-direction: column; gap: 8px; }
.ulicense-student-actions .ulicense-btn {
  justify-content: flex-start;
  gap: 8px;
  font-size: 13px;
}

/* ── Contenido principal (main) ─────────────────────── */
.ulicense-student-main { display: flex; flex-direction: column; gap: 24px; }

.ulicense-student-hero {
  padding: 24px 28px;
  background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
  border: 1px solid #bae6fd;
  border-radius: 16px;
}
.ulicense-student-hero h1 {
  font-size: 24px;
  font-weight: 700;
  color: #0c4a6e;
  margin: 0 0 6px;
}
.ulicense-student-hero p { margin: 0; font-size: 14px; color: #0369a1; }

/* ── Encabezado de sección ───────────────────────────── */
.ulicense-student-section-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 4px;
}
.ulicense-student-section-header h2 { font-size: 17px; font-weight: 600; color: #1e293b; margin: 0; }

/* ── Empty state ─────────────────────────────────────── */
.ulicense-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 48px 24px;
  text-align: center;
  background: #f8fafc;
  border: 2px dashed #e2e8f0;
  border-radius: 16px;
}
.ulicense-empty-state h3 { font-size: 18px; font-weight: 600; color: #1e293b; margin: 0; }
.ulicense-empty-state p { margin: 0; max-width: 320px; }

/* ── Actividad reciente ──────────────────────────────── */
.ulicense-activity-section { }
.ulicense-activity-timeline { display: flex; flex-direction: column; gap: 0; }
.ulicense-activity-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid #f1f5f9;
}
.ulicense-activity-row:last-child { border-bottom: none; }
.ulicense-activity-icon { font-size: 18px; flex-shrink: 0; width: 28px; text-align: center; }
.ulicense-activity-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.ulicense-activity-body strong { font-size: 13px; font-weight: 500; color: #1e293b; }
.ulicense-activity-body span { font-size: 12px; }
.ulicense-activity-time { font-size: 11px; color: #94a3b8; white-space: nowrap; flex-shrink: 0; }

/* ── Responsive ──────────────────────────────────────── */
@media (max-width: 860px) {
  .ulicense-student-layout {
    grid-template-columns: 1fr;
  }
  .ulicense-student-sidebar {
    position: static;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .ulicense-student-profile-card { grid-column: 1 / -1; }
  .ulicense-student-actions { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; }
}
@media (max-width: 560px) {
  .ulicense-student-sidebar { grid-template-columns: 1fr; }
  .ulicense-cf-footer { flex-direction: column; align-items: stretch; }
  .ulicense-cf-footer .ulicense-filter-chip { width: 100%; justify-content: center; }
  .ulicense-cf-actions { justify-content: space-between; }
  .ulicense-cf-apply { flex: 1; justify-content: center; }
}

/* ── Forgot password flow ─────────────────────────────── */
.ulicense-forgot-intro {
  font-size: 13px;
  color: #475569;
  margin: 0 0 14px;
  line-height: 1.55;
}
.ulicense-forgot-success,
.ulicense-forgot-fallback {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
  padding: 20px 0 8px;
}
.ulicense-forgot-success svg,
.ulicense-forgot-fallback svg { flex-shrink: 0; }
.ulicense-forgot-success h3 { font-size: 17px; font-weight: 600; color: #1e293b; margin: 0; }
.ulicense-forgot-success p,
.ulicense-forgot-fallback p { margin: 0; font-size: 13px; color: #475569; max-width: 280px; }
.ulicense-forgot-fallback strong { color: #92400e; }
.ulicense-forgot-fallback .ulicense-btn {
  margin-top: 4px;
  width: 100%;
  justify-content: center;
}

/* ── Link card (recursos) ─────────────────────────────── */
.ulicense-link-card {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  color: inherit !important;
}
.ulicense-link-card:hover {
  border-color: rgba(79,70,229,.35) !important;
  text-decoration: none !important;
}
.ulicense-link-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: #ede9fe;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #6d28d9;
}
.ulicense-link-body {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
  pointer-events: none !important;
}
.ulicense-link-body strong { font-size: 13px; font-weight: 500; color: #1e293b; }
.ulicense-link-body .ulicense-muted { 
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block !important;
  pointer-events: none !important;
}

/* ── Disable ALL native browser tooltips within the app ─ */
#ulicense-academy-app *[title]:not(img):not(iframe),
#ulicense-admin-app *[title]:not(img):not(iframe) {
  /* Prevent the browser from showing black tooltip box for title attrs */
}
/* Force no browser tooltip via pointer-events on hidden overflow text */
#ulicense-academy-app .ulicense-resource-card span,
#ulicense-academy-app .ulicense-lesson-item span,
#ulicense-academy-app .ulicense-chapter-title span {
  pointer-events: none;
}

/* ═══════════════════════════════════════════════════════════════
   LANDING BUILDER · Bloques no-code de la página de inicio
   (clases ulicense-hb-*)  ·  v1.5.0
   ═══════════════════════════════════════════════════════════════ */

/* ── Sección base y variantes de fondo / espaciado ───────────── */
.ulicense-hb-section {
  position: relative;
  padding-left: 20px;
  padding-right: 20px;
}
.ulicense-hb-section > * {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}
.ulicense-hb-pad-sm { padding-top: 28px; padding-bottom: 28px; }
.ulicense-hb-pad-md { padding-top: 56px; padding-bottom: 56px; }
.ulicense-hb-pad-lg { padding-top: 88px; padding-bottom: 88px; }

.ulicense-hb-bg-subtle { background: var(--ulicense-bg); }
.ulicense-hb-bg-gradient {
  background: linear-gradient(135deg, rgba(5, 150, 105, 0.10), rgba(15, 118, 110, 0.06) 60%, rgba(5, 150, 105, 0.10));
}
.ulicense-hb-bg-dark { background: #0b1220; }
.ulicense-hb-bg-dark .ulicense-section-title,
.ulicense-hb-bg-dark h2,
.ulicense-hb-bg-dark h3,
.ulicense-hb-bg-dark .ulicense-hb-feature h3,
.ulicense-hb-bg-dark .ulicense-hb-stat strong,
.ulicense-hb-bg-dark figcaption,
.ulicense-hb-bg-dark .ulicense-hb-prose { color: #f8fafc; }
.ulicense-hb-bg-dark .ulicense-hb-sub,
.ulicense-hb-bg-dark .ulicense-hb-feature p,
.ulicense-hb-bg-dark .ulicense-hb-stat span,
.ulicense-hb-bg-dark .ulicense-hb-prose p { color: #cbd5e1; }
.ulicense-hb-bg-dark .ulicense-hb-feature,
.ulicense-hb-bg-dark .ulicense-hb-testimonial {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.10);
}

/* ── HERO personalizado ──────────────────────────────────────── */
.ulicense-hb-hero {
  min-height: 420px;
  background-size: cover;
  background-position: center;
  border-radius: 0;
}
.ulicense-hb-hero-inner {
  max-width: 860px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}
.ulicense-hb-hero-inner .ulicense-pill { margin-bottom: 18px; }
.ulicense-hb-hero-image:before { display: none; }
.ulicense-hb-hero-light h1 { color: #fff; }
.ulicense-hb-hero-light p { color: rgba(255, 255, 255, 0.88); }
.ulicense-hb-hero-light .ulicense-pill {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.32);
  color: #fff;
}
.ulicense-hb-hero-light .ulicense-gradient-text {
  background: linear-gradient(90deg, #6ee7b7, #5eead4);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ── Texto enriquecido ───────────────────────────────────────── */
.ulicense-hb-narrow { max-width: 820px; margin: 0 auto; }
.ulicense-hb-narrow .ulicense-pill { margin-bottom: 14px; }
.ulicense-hb-richtext .ulicense-section-title { font-size: clamp(26px, 3.4vw, 38px); }
.ulicense-hb-prose { color: var(--ulicense-muted); font-size: 17px; line-height: 1.75; }
.ulicense-hb-prose p { margin: 0 0 14px; }
.ulicense-hb-prose a { color: var(--ulicense-primary); font-weight: 700; text-decoration: none; }
.ulicense-hb-prose a:hover { text-decoration: underline; }
.ulicense-hb-prose ul, .ulicense-hb-prose ol { margin: 0 0 14px; padding-left: 22px; }
.ulicense-hb-prose li { margin: 6px 0; }
.ulicense-hb-prose h3 { margin: 22px 0 10px; font-weight: 850; color: var(--ulicense-ink); }

/* ── Imagen suelta ───────────────────────────────────────────── */
.ulicense-hb-figure { margin: 0 auto; text-align: center; }
.ulicense-hb-w-full { max-width: 100%; }
.ulicense-hb-w-wide { max-width: 980px; }
.ulicense-hb-w-narrow { max-width: 620px; }
.ulicense-hb-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 4px;
}
.ulicense-hb-img.is-rounded { border-radius: 18px; box-shadow: var(--ulicense-premium-shadow); }
.ulicense-hb-figure figcaption {
  margin-top: 12px;
  font-size: 14px;
  color: var(--ulicense-muted);
  font-weight: 600;
}

/* ── Galería ─────────────────────────────────────────────────── */
.ulicense-hb-gallery { display: grid; gap: 16px; }
.ulicense-hb-gallery-item { margin: 0; position: relative; overflow: hidden; border-radius: 14px; }
.ulicense-hb-gallery-item img {
  display: block;
  width: 100%;
  height: 240px;
  object-fit: cover;
  transition: transform .4s ease;
}
.ulicense-hb-gallery-item:hover img { transform: scale(1.05); }
.ulicense-hb-gallery-item figcaption {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 22px 14px 12px;
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.66));
}

/* ── Beneficios / Features ───────────────────────────────────── */
.ulicense-hb-featuresblock { text-align: center; }
.ulicense-hb-sub {
  max-width: 640px;
  margin: 0 auto 12px;
  color: var(--ulicense-muted);
  font-size: 17px;
  font-weight: 600;
}
.ulicense-hb-features { display: grid; gap: 18px; margin-top: 34px; text-align: left; }
.ulicense-hb-feature {
  background: var(--ulicense-card);
  border: 1px solid var(--ulicense-line);
  border-radius: 16px;
  padding: 26px 24px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.ulicense-hb-feature:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(5, 150, 105, 0.10);
  border-color: rgba(5, 150, 105, 0.28);
}
.ulicense-hb-feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 14px;
  font-size: 26px;
  margin-bottom: 16px;
  background: linear-gradient(135deg, rgba(5, 150, 105, 0.14), rgba(15, 118, 110, 0.10));
}
.ulicense-hb-feature h3 { margin: 0 0 8px; font-size: 19px; font-weight: 850; color: var(--ulicense-ink); }
.ulicense-hb-feature p { margin: 0; color: var(--ulicense-muted); font-size: 15px; line-height: 1.6; }

/* ── Estadísticas ────────────────────────────────────────────── */
.ulicense-hb-statsblock { text-align: center; }
.ulicense-hb-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 18px;
  margin-top: 26px;
}
.ulicense-hb-stat {
  padding: 26px 14px;
  border-radius: 16px;
  background: var(--ulicense-card);
  border: 1px solid var(--ulicense-line);
}
.ulicense-hb-stat strong {
  display: block;
  font-size: clamp(30px, 4vw, 44px);
  font-weight: 950;
  line-height: 1;
  background: linear-gradient(120deg, var(--ulicense-primary), var(--ulicense-secondary));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ulicense-hb-stat span {
  display: block;
  margin-top: 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--ulicense-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* ── CTA / banner ────────────────────────────────────────────── */
.ulicense-hb-ctablock > .ulicense-hb-cta { max-width: 1180px; }
.ulicense-hb-cta {
  text-align: center;
  padding: 52px 32px;
  border-radius: 24px;
  background: linear-gradient(135deg, var(--ulicense-primary), var(--ulicense-secondary));
  color: #fff;
  box-shadow: 0 24px 60px rgba(5, 150, 105, 0.26);
}
.ulicense-hb-cta h2 { margin: 0 0 12px; font-size: clamp(26px, 3.6vw, 40px); font-weight: 950; color: #fff; }
.ulicense-hb-cta p {
  margin: 0 auto 22px;
  max-width: 640px;
  font-size: 17px;
  color: rgba(255, 255, 255, 0.92);
  font-weight: 600;
}
.ulicense-hb-cta .ulicense-btn-primary {
  background: #fff;
  color: var(--ulicense-secondary);
  border-color: #fff;
}
.ulicense-hb-cta .ulicense-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(0, 0, 0, 0.18); }

/* ── Testimonios ─────────────────────────────────────────────── */
.ulicense-hb-testimonials { display: grid; gap: 18px; margin-top: 30px; }
.ulicense-hb-testimonial {
  margin: 0;
  padding: 26px 24px;
  border-radius: 16px;
  background: var(--ulicense-card);
  border: 1px solid var(--ulicense-line);
  box-shadow: 0 10px 26px rgba(17, 24, 39, 0.05);
}
.ulicense-hb-testimonial > p {
  margin: 0 0 18px;
  font-size: 16px;
  line-height: 1.65;
  color: var(--ulicense-ink);
  font-style: italic;
}
.ulicense-hb-testimonial > p:before { content: "\201C"; color: var(--ulicense-primary); font-weight: 900; margin-right: 2px; }
.ulicense-hb-testimonial footer { display: flex; align-items: center; gap: 12px; }
.ulicense-hb-testimonial footer img {
  width: 46px; height: 46px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.ulicense-hb-testimonial footer span { display: flex; flex-direction: column; line-height: 1.3; }
.ulicense-hb-testimonial footer strong { font-weight: 850; color: var(--ulicense-ink); }
.ulicense-hb-testimonial footer em { font-style: normal; font-size: 13px; color: var(--ulicense-muted); }

/* ── Espaciador ──────────────────────────────────────────────── */
.ulicense-hb-spacer-sm { height: 24px; }
.ulicense-hb-spacer-md { height: 48px; }
.ulicense-hb-spacer-lg { height: 80px; }
.ulicense-hb-spacer-xl { height: 120px; }

/* ── Catálogo / ofertas dentro de la landing ─────────────────── */
.ulicense-hb-coursesblock .ulicense-section-title,
.ulicense-hb-offersblock .ulicense-section-title { text-align: center; margin-bottom: 20px; }

/* ═══════════════════════════════════════════════════════════════
   LANDING BUILDER · Editor del panel de administración
   ═══════════════════════════════════════════════════════════════ */
.ulicense-hb-builder { display: flex; flex-direction: column; gap: 18px; }
.ulicense-hb-topbar { margin-bottom: 2px; }

.ulicense-hb-toggle { padding: 18px 20px; }
.ulicense-hb-switch { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; margin: 0; }
.ulicense-hb-switch input[type="checkbox"] { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--ulicense-primary); cursor: pointer; }
.ulicense-hb-switch span { font-size: 15px; line-height: 1.45; }

/* lista de bloques */
.ulicense-hb-list { display: flex; flex-direction: column; gap: 14px; }
.ulicense-hb-block {
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--ulicense-line);
  transition: box-shadow .18s ease, border-color .18s ease;
}
.ulicense-hb-block:hover { box-shadow: 0 12px 30px rgba(17, 24, 39, 0.07); }
.ulicense-hb-block.is-hidden { opacity: .62; }
.ulicense-hb-block.is-hidden .ulicense-hb-block-head { background: repeating-linear-gradient(45deg, var(--ulicense-bg), var(--ulicense-bg) 10px, #f1f3f5 10px, #f1f3f5 20px); }
.ulicense-hb-block-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 18px;
  background: var(--ulicense-bg);
  border-bottom: 1px solid var(--ulicense-line);
}
.ulicense-hb-block-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 850;
  font-size: 15px;
  color: var(--ulicense-ink);
}
.ulicense-hb-block-title .ulicense-pill { padding: 3px 9px; font-size: 10px; }
.ulicense-hb-block-tools { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.ulicense-hb-block-tools .ulicense-icon-btn { width: 32px; height: 32px; font-size: 15px; }
.ulicense-hb-block-tools .ulicense-icon-btn[disabled] { opacity: .35; cursor: not-allowed; }
.ulicense-hb-block-body { padding: 20px 18px; display: flex; flex-direction: column; gap: 14px; }

/* columnas de botones (hero) */
.ulicense-hb-btn-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ulicense-hb-btn-col {
  padding: 14px;
  border: 1px dashed var(--ulicense-line);
  border-radius: 12px;
  background: var(--ulicense-bg);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ulicense-hb-btn-col h4 { margin: 0; font-size: 13px; font-weight: 850; color: var(--ulicense-secondary); text-transform: uppercase; letter-spacing: .03em; }

/* sub-elementos repetibles */
.ulicense-hb-items { display: flex; flex-direction: column; gap: 12px; }
.ulicense-hb-item {
  padding: 14px;
  border: 1px solid var(--ulicense-line);
  border-radius: 12px;
  background: var(--ulicense-bg);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ulicense-hb-item-head { display: flex; align-items: center; justify-content: space-between; }
.ulicense-hb-item-head span { font-size: 12px; font-weight: 800; color: var(--ulicense-muted); text-transform: uppercase; letter-spacing: .04em; }

/* selector de imagen */
.ulicense-hb-media { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ulicense-hb-media-thumb {
  width: 76px; height: 76px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid var(--ulicense-line);
  flex-shrink: 0;
}
.ulicense-hb-media-empty {
  width: 76px; height: 76px;
  display: flex; align-items: center; justify-content: center;
  text-align: center;
  border-radius: 10px;
  border: 1px dashed var(--ulicense-line);
  background: var(--ulicense-bg);
  color: var(--ulicense-muted);
  font-size: 11px;
  font-weight: 600;
  flex-shrink: 0;
}

/* color y checkbox */
.ulicense-hb-color { width: 100%; height: 40px; padding: 2px; border: 1px solid var(--ulicense-line); border-radius: 8px; background: #fff; cursor: pointer; }
.ulicense-hb-check { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; cursor: pointer; color: var(--ulicense-ink); }
.ulicense-hb-check input[type="checkbox"] { width: 17px; height: 17px; accent-color: var(--ulicense-primary); cursor: pointer; }

/* apariencia avanzada (details) */
.ulicense-hb-advanced {
  border: 1px solid var(--ulicense-line);
  border-radius: 12px;
  background: var(--ulicense-bg);
  padding: 0;
  overflow: hidden;
}
.ulicense-hb-advanced > summary {
  padding: 12px 16px;
  cursor: pointer;
  font-weight: 800;
  font-size: 13px;
  color: var(--ulicense-secondary);
  list-style: none;
  user-select: none;
}
.ulicense-hb-advanced > summary:before { content: "\25B8"; display: inline-block; margin-right: 8px; transition: transform .18s ease; }
.ulicense-hb-advanced[open] > summary:before { transform: rotate(90deg); }
.ulicense-hb-advanced > summary::-webkit-details-marker { display: none; }
.ulicense-hb-advanced .ulicense-form-grid { padding: 0 16px 16px; }

/* paleta para agregar secciones */
.ulicense-hb-palette { padding: 20px; }
.ulicense-hb-palette h3 { margin: 0 0 14px; font-size: 16px; font-weight: 850; }
.ulicense-hb-palette-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
}
.ulicense-hb-palette-btn {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  text-align: left;
  padding: 14px;
  border: 1px solid var(--ulicense-line);
  border-radius: 12px;
  background: var(--ulicense-card);
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.ulicense-hb-palette-btn:hover {
  transform: translateY(-3px);
  border-color: rgba(5, 150, 105, 0.4);
  box-shadow: 0 12px 26px rgba(5, 150, 105, 0.12);
}
.ulicense-hb-palette-icon { font-size: 22px; line-height: 1; }
.ulicense-hb-palette-label { font-weight: 850; font-size: 14px; color: var(--ulicense-ink); }
.ulicense-hb-palette-desc { font-size: 12px; color: var(--ulicense-muted); line-height: 1.4; }

/* estado vacío del builder */
.ulicense-hb-empty {
  text-align: center;
  padding: 38px 24px;
  border: 2px dashed var(--ulicense-line);
  border-radius: 16px;
  color: var(--ulicense-muted);
  font-size: 15px;
  line-height: 1.6;
  background: var(--ulicense-bg);
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .ulicense-hb-pad-md { padding-top: 40px; padding-bottom: 40px; }
  .ulicense-hb-pad-lg { padding-top: 56px; padding-bottom: 56px; }
  .ulicense-hb-hero { min-height: 340px; }
  .ulicense-hb-features,
  .ulicense-hb-gallery,
  .ulicense-hb-testimonials { grid-template-columns: 1fr !important; }
  .ulicense-hb-btn-cols { grid-template-columns: 1fr; }
  .ulicense-hb-cta { padding: 38px 22px; }
}
@media (max-width: 560px) {
  .ulicense-hb-block-head { flex-wrap: wrap; }
  .ulicense-hb-gallery-item img { height: 200px; }
}

/* ═══════════════════════════════════════════════════════════════
   LANDING BUILDER · Vista previa (modal con iframe)
   (clases ulicense-hbpv-*)  ·  v1.5.0
   ═══════════════════════════════════════════════════════════════ */
.ulicense-hbpv-trigger { display: inline-flex; align-items: center; gap: 7px; }
.ulicense-hbpv-trigger svg { flex-shrink: 0; }

.ulicense-hbpv-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
  background: rgba(8, 15, 30, 0.62);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  animation: ulicense-hbpv-fade .18s ease;
}
@keyframes ulicense-hbpv-fade { from { opacity: 0; } to { opacity: 1; } }

.ulicense-hbpv-modal {
  width: 100%;
  max-width: 1320px;
  height: 100%;
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 40px 120px rgba(8, 15, 30, 0.55);
  animation: ulicense-hbpv-pop .22s cubic-bezier(.2, .9, .3, 1.2);
}
@keyframes ulicense-hbpv-pop { from { transform: translateY(14px) scale(.985); opacity: 0; } to { transform: none; opacity: 1; } }

/* barra superior */
.ulicense-hbpv-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 16px;
  background: linear-gradient(180deg, #ffffff, #f7f9fb);
  border-bottom: 1px solid var(--ulicense-line);
  flex-shrink: 0;
}
.ulicense-hbpv-title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ulicense-hbpv-title > span { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.ulicense-hbpv-title strong { font-size: 15px; font-weight: 850; color: var(--ulicense-ink); }
.ulicense-hbpv-status {
  font-size: 12px;
  color: var(--ulicense-muted);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 360px;
}
.ulicense-hbpv-dot {
  width: 11px; height: 11px;
  border-radius: 50%;
  background: var(--ulicense-primary);
  box-shadow: 0 0 0 4px rgba(5, 150, 105, 0.16);
  flex-shrink: 0;
}

/* selector de dispositivo */
.ulicense-hbpv-devices {
  display: flex;
  gap: 2px;
  padding: 4px;
  background: var(--ulicense-bg);
  border: 1px solid var(--ulicense-line);
  border-radius: 999px;
  flex-shrink: 0;
}
.ulicense-hbpv-dev {
  border: 0;
  background: transparent;
  padding: 7px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 750;
  color: var(--ulicense-muted);
  cursor: pointer;
  transition: background .16s ease, color .16s ease, box-shadow .16s ease;
  white-space: nowrap;
}
.ulicense-hbpv-dev:hover { color: var(--ulicense-ink); }
.ulicense-hbpv-dev.is-active {
  background: #fff;
  color: var(--ulicense-secondary);
  box-shadow: 0 2px 6px rgba(17, 24, 39, 0.10);
}

/* herramientas */
.ulicense-hbpv-tools { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.ulicense-hbpv-refresh {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--ulicense-line);
  background: #fff;
  padding: 8px 14px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 750;
  color: var(--ulicense-ink);
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.ulicense-hbpv-refresh:hover { border-color: rgba(5, 150, 105, 0.4); box-shadow: 0 6px 16px rgba(5, 150, 105, 0.10); }
.ulicense-hbpv-refresh:active { transform: scale(.97); }
.ulicense-hbpv-refresh svg { flex-shrink: 0; }
.ulicense-hbpv-close {
  width: 38px; height: 38px;
  border: 1px solid var(--ulicense-line);
  background: #fff;
  border-radius: 10px;
  font-size: 17px;
  line-height: 1;
  color: var(--ulicense-muted);
  cursor: pointer;
  transition: background .16s ease, color .16s ease, border-color .16s ease;
}
.ulicense-hbpv-close:hover { background: var(--ulicense-danger); color: #fff; border-color: var(--ulicense-danger); }

/* escenario / lienzo */
.ulicense-hbpv-stage {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 22px;
  background:
    radial-gradient(circle at 1px 1px, rgba(15, 23, 42, 0.06) 1px, transparent 0) 0 0 / 22px 22px,
    #eef1f5;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
.ulicense-hbpv-frame-wrap {
  width: 100%;
  max-width: 100%;
  height: 100%;
  min-height: 100%;
  background: #fff;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(8, 15, 30, 0.18);
  transition: max-width .28s cubic-bezier(.2, .9, .3, 1);
}
.ulicense-hbpv-frame { width: 100%; height: 100%; border: 0; display: block; background: #fff; }

/* tablet */
.ulicense-hbpv-modal[data-device="tablet"] .ulicense-hbpv-frame-wrap {
  max-width: 820px;
  border-radius: 22px;
  border: 12px solid #11161f;
  box-shadow: 0 26px 60px rgba(8, 15, 30, 0.34);
}
/* móvil */
.ulicense-hbpv-modal[data-device="mobile"] .ulicense-hbpv-frame-wrap {
  max-width: 390px;
  border-radius: 30px;
  border: 12px solid #11161f;
  box-shadow: 0 26px 60px rgba(8, 15, 30, 0.34);
}

/* responsive del propio modal */
@media (max-width: 900px) {
  .ulicense-hbpv-overlay { padding: 0; }
  .ulicense-hbpv-modal { max-height: 100vh; height: 100vh; border-radius: 0; }
  .ulicense-hbpv-bar { flex-wrap: wrap; gap: 10px; }
  .ulicense-hbpv-devices { order: 3; width: 100%; justify-content: center; }
  .ulicense-hbpv-status { display: none; }
  .ulicense-hbpv-dev { padding: 7px 12px; font-size: 12px; }
}
@media (max-width: 560px) {
  .ulicense-hbpv-modal[data-device="tablet"] .ulicense-hbpv-frame-wrap,
  .ulicense-hbpv-modal[data-device="mobile"] .ulicense-hbpv-frame-wrap { border-width: 8px; }
  .ulicense-hbpv-refresh span, .ulicense-hbpv-refresh { font-size: 12px; }
}

/* ── Landing personalizado a todo el ancho (full-bleed) ──────── */
.ulicense-hb-canvas { padding: 0; }
.ulicense-hb-canvas-pad { padding: 24px 28px 0; }
@media (max-width: 768px) {
  .ulicense-hb-canvas-pad { padding: 16px 16px 0; }
}

/* Configuración: distribución profesional y controles claros */
.ulicense-settings-hero {
  display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:20px; padding:28px 30px;
  color:#fff; border-radius:22px;
  background:radial-gradient(circle at 85% 10%,rgba(255,255,255,.22),transparent 28%),linear-gradient(135deg,var(--ulicense-secondary),var(--ulicense-primary));
  box-shadow:0 22px 48px rgba(5,150,105,.22);
}
.ulicense-settings-hero h1 { margin:3px 0 8px; color:#fff; font-size:clamp(26px,3vw,38px); line-height:1.05; }
.ulicense-settings-hero p { max-width:720px; margin:0; color:rgba(255,255,255,.86); font-size:14px; }
.ulicense-settings-hero .ulicense-settings-kicker { color:#d1fae5; }
.ulicense-settings-hero .ulicense-btn-primary { flex:0 0 auto; color:var(--ulicense-secondary); background:#fff; border-color:#fff; }
.ulicense-settings-page { padding:24px; overflow:visible; border-color:#dcefe8; box-shadow:0 18px 50px rgba(15,23,42,.06); }
.ulicense-settings-section-head { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin:0 0 20px; }
.ulicense-settings-section-head h2 { margin:3px 0 5px; font-size:21px; color:#0f172a; }
.ulicense-settings-section-head p { margin:0; color:#64748b; }
.ulicense-settings-kicker { color:var(--ulicense-primary); font-size:11px; font-weight:950; letter-spacing:.12em; text-transform:uppercase; }
.ulicense-settings-page > .ulicense-form-grid { padding:20px; border:1px solid #e6efe9; border-radius:18px; background:#fbfefc; }
.ulicense-settings-page .ulicense-field label { display:flex; align-items:center; min-width:0; line-height:1.35; overflow-wrap:anywhere; }
.ulicense-settings-page .ulicense-field-full { grid-column:1 / -1; }
.ulicense-settings-page .ulicense-certificate-settings { padding:22px; border-radius:18px; background:linear-gradient(180deg,#fbfefc,#f6fbf8); }
.ulicense-email-toggles { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:18px 0; }
.ulicense-email-toggle { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px; padding:14px; border:1px solid #dfe8e3; border-radius:16px; background:#fff; cursor:pointer; transition:.16s; }
.ulicense-email-toggle:hover { transform:translateY(-1px); border-color:rgba(5,150,105,.4); box-shadow:0 12px 25px rgba(15,23,42,.07); }
.ulicense-email-toggle > span { display:grid; gap:3px; min-width:0; }
.ulicense-email-toggle strong { color:#0f172a; font-size:13px; }
.ulicense-email-toggle small { color:#64748b; line-height:1.35; }
.ulicense-email-toggle input { position:absolute; opacity:0; pointer-events:none; }
.ulicense-email-toggle i { width:42px; height:24px; padding:3px; border-radius:999px; background:#cbd5e1; transition:.16s; }
.ulicense-email-toggle i::after { content:""; display:block; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 2px 5px rgba(15,23,42,.2); transition:.16s; }
.ulicense-email-toggle input:checked + i { background:var(--ulicense-primary); }
.ulicense-email-toggle input:checked + i::after { transform:translateX(18px); }
.ulicense-email-templates { padding:22px; border-radius:18px; background:#fbfefc; }
.ulicense-template-variables { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; max-width:460px; }
.ulicense-template-variables strong { width:100%; color:#64748b; font-size:11px; text-align:right; text-transform:uppercase; }
.ulicense-template-variables code { padding:4px 7px; border-radius:7px; color:#047857; background:#ecfdf5; }
.ulicense-template-card { padding:18px; border:1px solid #e2e8f0; border-radius:16px; background:#fff; }
.ulicense-template-card h3 { grid-column:1 / -1; margin:0; font-size:16px; }
.ulicense-template-card textarea { min-height:150px; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:12px; line-height:1.55; }
.ulicense-settings-savebar { position:sticky; bottom:12px; z-index:12; display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:22px; padding:14px 16px; border:1px solid #bbf7d0; border-radius:16px; background:rgba(240,253,244,.94); box-shadow:0 16px 34px rgba(15,23,42,.12); backdrop-filter:blur(14px); }
.ulicense-settings-savebar div { display:grid; gap:2px; }
.ulicense-settings-savebar span { color:#64748b; font-size:12px; }
@media (max-width:1200px) { .ulicense-email-toggles { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:900px) {
  .ulicense-admin-sidebar { position:static; height:auto; max-height:none; overflow:visible; }
  .ulicense-settings-hero,.ulicense-settings-savebar,.ulicense-settings-section-head { align-items:stretch; flex-direction:column; }
  .ulicense-template-variables { justify-content:flex-start; }
  .ulicense-template-variables strong { text-align:left; }
}
@media (max-width:600px) { .ulicense-email-toggles { grid-template-columns:1fr; } .ulicense-settings-page,.ulicense-email-templates { padding:16px; } }

.ulicense-ai-model-sync {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 18px 0;
  padding: 16px;
  border: 1px solid #bae6fd;
  border-radius: 16px;
  background: linear-gradient(135deg, #f0f9ff, #ecfdf5);
}
.ulicense-ai-model-sync div { display: grid; gap: 4px; }
.ulicense-ai-model-sync strong { color: #0f172a; }
.ulicense-ai-model-sync span { color: #64748b; font-size: 12px; line-height: 1.45; }

/* Panel interno corporativo premium */
.ulicense-admin {
  --ulicense-admin-navy:#0f2f2a;
  --ulicense-admin-soft:#f3f8f6;
  --ulicense-admin-border:#dce9e4;
  grid-template-columns:286px minmax(0,1fr);
  background:#f4f8f6;
  border:0;
}
.ulicense-admin-sidebar {
  top:32px;
  height:calc(100vh - 32px);
  padding:18px 14px 24px;
  color:#d9eee7;
  background:
    radial-gradient(circle at 20% 0,rgba(52,211,153,.18),transparent 30%),
    linear-gradient(180deg,#123b34,#092a26);
  border-right:0;
  box-shadow:16px 0 40px rgba(15,47,42,.12);
}
.ulicense-admin .ulicense-brand {
  gap:11px;
  padding:10px;
  margin-bottom:14px;
  color:#fff;
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.12);
  box-shadow:none;
}
.ulicense-admin .ulicense-brand > span:last-child,
.ulicense-admin-profile > span:last-child { display:grid; gap:2px; min-width:0; text-align:left; }
.ulicense-admin .ulicense-brand strong,
.ulicense-admin-profile strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ulicense-admin .ulicense-brand small,
.ulicense-admin-profile small { color:rgba(220,252,231,.65); font-size:10px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; }
.ulicense-admin-profile {
  margin-bottom:20px;
  color:#fff;
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.1);
  font-weight:800;
}
.ulicense-admin-avatar {
  width:42px; height:42px; display:grid; place-items:center; flex:0 0 42px;
  border-radius:13px; color:#064e3b; background:linear-gradient(135deg,#d1fae5,#6ee7b7); font-size:18px; font-weight:950;
}
.ulicense-admin-nav { display:grid; gap:20px; }
.ulicense-admin-nav-group { display:grid; gap:4px; }
.ulicense-admin-nav-label {
  padding:0 11px 5px;
  color:rgba(209,250,229,.52);
  font-size:9px;
  font-weight:950;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.ulicense-admin-nav-item {
  position:relative;
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding:9px 11px;
  color:rgba(236,253,245,.78);
  background:transparent;
  border:1px solid transparent;
  border-radius:12px;
  font:inherit;
  font-size:12px;
  font-weight:760;
  text-align:left;
  cursor:pointer;
  transition:background .16s ease,color .16s ease,border-color .16s ease,transform .16s ease;
}
.ulicense-admin-nav-item:hover { color:#fff; background:rgba(255,255,255,.08); transform:translateX(2px); }
.ulicense-admin-nav-item:focus-visible,
.ulicense-admin-quick-grid button:focus-visible,
.ulicense-admin-disclosure summary:focus-visible {
  outline:3px solid rgba(110,231,183,.72);
  outline-offset:2px;
}
.ulicense-admin-nav-item.is-active {
  color:#064e3b;
  background:linear-gradient(135deg,#ecfdf5,#a7f3d0);
  border-color:rgba(255,255,255,.28);
  box-shadow:0 10px 24px rgba(0,0,0,.14);
}
.ulicense-admin-nav-item.is-active::before {
  content:""; position:absolute; left:-7px; width:3px; height:20px; border-radius:99px; background:#6ee7b7;
}
.ulicense-admin-nav-icon { width:18px; height:18px; display:inline-grid; place-items:center; flex:0 0 18px; }
.ulicense-admin-nav-icon svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ulicense-admin-content { padding:0 30px 52px; overflow:visible; }
.ulicense-admin-page-head {
  position:sticky;
  top:32px;
  z-index:19;
  min-height:112px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin:0 -30px 28px;
  padding:20px 30px;
  background:rgba(248,252,250,.92);
  border-bottom:1px solid var(--ulicense-admin-border);
  box-shadow:0 12px 30px rgba(15,47,42,.05);
  backdrop-filter:blur(18px);
}
.ulicense-admin-page-head h1 { margin:3px 0 4px; color:#102a26; font-size:clamp(24px,3vw,34px); line-height:1.05; letter-spacing:-.035em; }
.ulicense-admin-page-head p { margin:0; color:#64748b; font-size:13px; }
.ulicense-admin-eyebrow { display:flex; align-items:center; gap:7px; color:#07805f; font-size:10px; font-weight:950; letter-spacing:.13em; text-transform:uppercase; }
.ulicense-admin-eyebrow .ulicense-admin-nav-icon { width:14px; height:14px; }
.ulicense-admin-eyebrow svg { width:14px; height:14px; }
.ulicense-admin-head-actions { display:flex; gap:9px; flex-wrap:wrap; }
.ulicense-admin-head-actions .ulicense-btn { gap:7px; }
.ulicense-admin-head-actions .ulicense-admin-nav-icon { width:15px; height:15px; }
.ulicense-admin-head-actions svg { width:15px; height:15px; }
.ulicense-admin-page-body { max-width:1540px; margin:0 auto; }
.ulicense-admin-page-body > .ulicense-section-title { display:none; }
.ulicense-admin-page-body > .ulicense-row:first-child { margin-bottom:18px; }
.ulicense-admin-page-body > .ulicense-row:first-child .ulicense-section-title { margin:0; font-size:22px; }
.ulicense-admin-page-body .ulicense-card {
  border-color:var(--ulicense-admin-border);
  box-shadow:0 12px 34px rgba(15,47,42,.055);
}
.ulicense-admin-page-body .ulicense-card:hover { border-color:#c5ded5; }
.ulicense-admin-page-body .ulicense-card-body { border-radius:18px; }
.ulicense-admin-page-body .ulicense-btn { border-radius:11px; font-weight:800; }
.ulicense-admin-page-body .ulicense-btn-primary { box-shadow:0 9px 22px rgba(5,150,105,.18); }
.ulicense-admin-page-body .ulicense-btn-danger { color:#b91c1c; background:#fff7f7; border-color:#fecaca; box-shadow:none; }
.ulicense-admin-page-body .ulicense-field input,
.ulicense-admin-page-body .ulicense-field select,
.ulicense-admin-page-body .ulicense-field textarea,
.ulicense-admin-page-body .ulicense-input { border-color:#d9e6e1; background:#fff; border-radius:12px; }
.ulicense-admin-page-body .ulicense-field label { color:#334155; font-size:11px; font-weight:850; letter-spacing:.015em; }
.ulicense-admin-page-body .ulicense-table {
  display:block;
  max-width:100%;
  overflow-x:auto;
  border-color:var(--ulicense-admin-border);
  border-radius:16px;
  box-shadow:0 10px 28px rgba(15,47,42,.045);
}
.ulicense-admin-page-body .ulicense-table th { color:#49635c; background:#f0f7f4; letter-spacing:.08em; }
.ulicense-admin-page-body .ulicense-table tr:hover td { background:#f8fcfa; }
.ulicense-admin-page-body .ulicense-empty { padding:28px; border:1px dashed #bfd9cf; border-radius:16px; color:#64748b; background:#f8fcfa; text-align:center; }
.ulicense-module-intro {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px;
  padding:14px 16px;
  color:#49635c;
  background:#edf8f3;
  border:1px solid #d5ebe2;
  border-radius:15px;
}
.ulicense-module-intro p { margin:0; line-height:1.5; }
.ulicense-module-intro .ulicense-pill { flex:0 0 auto; }
.ulicense-health-panel {
  margin:0 0 18px;
  padding:20px;
  background:#fff;
  border:1px solid var(--ulicense-admin-border);
  border-radius:18px;
  box-shadow:0 8px 24px rgba(15,47,42,.045);
}
.ulicense-health-panel.needs-attention { border-color:#f2d59b; background:#fffdf8; }
.ulicense-health-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:14px; }
.ulicense-health-head h3 { margin:3px 0 0; color:#123b34; }
.ulicense-health-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.ulicense-health-item { display:flex; gap:10px; align-items:flex-start; padding:12px; border:1px solid #dce9e4; border-radius:13px; background:#f8fcfa; }
.ulicense-health-item > span { width:24px; height:24px; display:grid; place-items:center; flex:0 0 24px; border-radius:50%; color:#fff; background:#059669; font-weight:900; }
.ulicense-health-item.is-warning > span { background:#d97706; }
.ulicense-health-item div { display:grid; gap:2px; }
.ulicense-health-item small { color:#64748b; line-height:1.35; }
.ulicense-admin-page-head { min-height:88px; padding-top:14px; padding-bottom:14px; }
.ulicense-admin-page-head h1 { font-size:clamp(22px,2.5vw,30px); }
.ulicense-btn,
.ulicense-admin-nav-item,
.ulicense-icon-btn { min-height:40px; }
.ulicense-app-shell button:focus-visible,
.ulicense-app-shell a:focus-visible,
.ulicense-app-shell input:focus-visible,
.ulicense-app-shell select:focus-visible,
.ulicense-app-shell textarea:focus-visible {
  outline:3px solid rgba(14,165,233,.45);
  outline-offset:2px;
}
@media (max-width:900px) {
  .ulicense-health-grid { grid-template-columns:1fr; }
  .ulicense-health-head { align-items:flex-start; flex-direction:column; }
}
.ulicense-admin-welcome {
  display:flex; align-items:center; justify-content:space-between; gap:22px; margin-bottom:16px; padding:26px 28px;
  color:#fff; border-radius:22px;
  background:radial-gradient(circle at 85% 0,rgba(167,243,208,.25),transparent 28%),linear-gradient(135deg,#0f766e,#064e3b);
  box-shadow:0 20px 45px rgba(6,78,59,.2);
}
.ulicense-admin-welcome h2 { margin:5px 0 7px; color:#fff; font-size:30px; letter-spacing:-.035em; }
.ulicense-admin-welcome p { margin:0; color:rgba(236,253,245,.78); }
.ulicense-admin-welcome .ulicense-admin-eyebrow { color:#a7f3d0; }
.ulicense-admin-welcome-actions { display:flex; gap:9px; flex-wrap:wrap; }
.ulicense-admin-welcome-actions .ulicense-btn:not(.ulicense-btn-primary) { color:#064e3b; background:#fff; border-color:#fff; }
.ulicense-admin-welcome-actions .ulicense-btn-primary { color:#fff; background:rgba(255,255,255,.13); border-color:rgba(255,255,255,.24); box-shadow:none; }
.ulicense-admin-welcome-actions .ulicense-admin-nav-icon { width:15px; height:15px; }
.ulicense-admin-welcome-actions svg { width:15px; height:15px; }
.ulicense-admin-quick-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:20px; }
.ulicense-admin-quick-grid button {
  display:flex; align-items:center; gap:13px; padding:16px; color:#123b34; background:#fff; border:1px solid var(--ulicense-admin-border); border-radius:16px;
  box-shadow:0 10px 28px rgba(15,47,42,.05); cursor:pointer; text-align:left; transition:.16s;
}
.ulicense-admin-quick-grid button:hover { transform:translateY(-2px); border-color:#94d3bd; box-shadow:0 16px 32px rgba(15,47,42,.09); }
.ulicense-admin-quick-grid .ulicense-admin-nav-icon { width:38px; height:38px; flex-basis:38px; border-radius:12px; color:#047857; background:#ecfdf5; }
.ulicense-admin-quick-grid svg { width:20px; height:20px; }
.ulicense-admin-quick-grid span:last-child { display:grid; gap:2px; }
.ulicense-admin-quick-grid strong { font-size:21px; line-height:1; }
.ulicense-admin-quick-grid small { color:#64748b; font-size:11px; }
.ulicense-admin-disclosure { margin:18px 0; border:1px solid var(--ulicense-admin-border); border-radius:18px; background:#fff; box-shadow:0 12px 34px rgba(15,47,42,.05); overflow:hidden; }
.ulicense-admin-disclosure summary { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:17px 20px; color:#123b34; cursor:pointer; list-style:none; font-weight:900; }
.ulicense-admin-disclosure summary::-webkit-details-marker { display:none; }
.ulicense-admin-disclosure summary span { display:flex; align-items:center; gap:9px; }
.ulicense-admin-disclosure summary small { color:#64748b; font-weight:650; }
.ulicense-admin-disclosure[open] summary { border-bottom:1px solid var(--ulicense-admin-border); background:#f6fbf8; }
.ulicense-admin-disclosure > :not(summary) { margin:18px; }
.ulicense-admin-disclosure > .ulicense-card { width:auto; }
.ulicense-admin-disclosure .ulicense-shortcodes { box-shadow:none; }
.ulicense-admin-page-body .ulicense-stat-grid { gap:12px; }
.ulicense-admin-page-body .ulicense-stat { min-height:108px; background:linear-gradient(180deg,#fff,#f7fbf9); }
.ulicense-admin-page-body .ulicense-stat strong { margin-top:7px; color:#123b34; font-size:27px; letter-spacing:-.035em; line-height:1.3; padding-top:3px; overflow:visible; }
.ulicense-admin-page-body .ulicense-alert { padding:14px 16px; border-radius:14px; }
.ulicense-admin-page-body .ulicense-modal { border-radius:22px; box-shadow:0 28px 80px rgba(15,23,42,.22); }

@media (max-width:1180px) {
  .ulicense-admin { grid-template-columns:238px minmax(0,1fr); }
  .ulicense-admin-quick-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:900px) {
  .ulicense-admin { grid-template-columns:1fr; }
  .ulicense-admin-sidebar { position:static; height:auto; padding:14px; }
  .ulicense-admin-nav { display:flex; gap:10px; overflow-x:auto; padding-bottom:5px; }
  .ulicense-admin-nav-group { display:flex; gap:5px; flex:0 0 auto; }
  .ulicense-admin-nav-label { display:none; }
  .ulicense-admin-nav-item { width:auto; white-space:nowrap; background:rgba(255,255,255,.06); }
  .ulicense-admin-content { padding:0 18px 36px; }
  .ulicense-admin-page-head { position:static; margin:0 -18px 20px; padding:18px; }
  .ulicense-admin-page-body .ulicense-table th,
  .ulicense-admin-page-body .ulicense-table td { min-width:130px; }
}
@media (max-width:680px) {
  .ulicense-admin-page-head,.ulicense-admin-welcome { align-items:stretch; flex-direction:column; }
  .ulicense-admin-head-actions,.ulicense-admin-welcome-actions { width:100%; }
  .ulicense-admin-head-actions .ulicense-btn,.ulicense-admin-welcome-actions .ulicense-btn { flex:1; justify-content:center; }
  .ulicense-admin-quick-grid { grid-template-columns:1fr; }
  .ulicense-admin-disclosure summary { align-items:flex-start; flex-direction:column; }
  .ulicense-admin-page-body .ulicense-row { flex-wrap:wrap; }
}
@media (max-width:760px) { .ulicense-ai-model-sync { align-items: stretch; flex-direction: column; } }

/* Home builder: selector de modo y estudio de código */
.ulicense-home-mode {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 8px;
  border: 1px solid #dce7e2;
  border-radius: 18px;
  background: linear-gradient(180deg, #f8fbfa, #f2f7f5);
}
.ulicense-home-mode button {
  display: grid;
  gap: 4px;
  padding: 16px 18px;
  text-align: left;
  border: 1px solid transparent;
  border-radius: 13px;
  background: transparent;
  color: #64748b;
  cursor: pointer;
  transition: .18s ease;
}
.ulicense-home-mode button:hover { color: #0f172a; background: rgba(255,255,255,.7); }
.ulicense-home-mode button.is-active {
  color: #064e3b;
  border-color: rgba(5,150,105,.25);
  background: #fff;
  box-shadow: 0 12px 28px rgba(15,23,42,.08);
}
.ulicense-home-mode span { font-size: 15px; font-weight: 900; }
.ulicense-home-mode small { color: #64748b; font-size: 12px; }
.ulicense-code-studio {
  overflow: hidden;
  border: 1px solid #dce7e2;
  border-radius: 22px;
  background: #07111f;
  box-shadow: 0 24px 60px rgba(2,6,23,.18);
}
.ulicense-code-studio-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 24px;
  color: #f8fafc;
  background: radial-gradient(circle at 85% 0, rgba(52,211,153,.2), transparent 34%), #0b1728;
  border-bottom: 1px solid rgba(148,163,184,.16);
}
.ulicense-code-studio-head h2 { margin: 3px 0 5px; color: #fff; font-size: 24px; }
.ulicense-code-studio-head p { margin: 0; color: #94a3b8; }
.ulicense-code-kicker { color: #6ee7b7; font-size: 10px; font-weight: 950; letter-spacing: .14em; text-transform: uppercase; }
.ulicense-code-notice {
  margin: 18px 20px 0;
  padding: 11px 14px;
  color: #cbd5e1;
  border: 1px solid rgba(52,211,153,.2);
  border-radius: 11px;
  background: rgba(16,185,129,.08);
  font-size: 12px;
}
.ulicense-code-notice code { color: #6ee7b7; }
.ulicense-code-grid { display: grid; gap: 14px; padding: 20px; }
.ulicense-code-panel {
  display: grid;
  overflow: hidden;
  border: 1px solid rgba(148,163,184,.18);
  border-radius: 14px;
  background: #0b1422;
}
.ulicense-code-panel > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  color: #e2e8f0;
  border-bottom: 1px solid rgba(148,163,184,.14);
  background: #101d30;
}
.ulicense-code-panel b { font-size: 12px; letter-spacing: .08em; }
.ulicense-code-panel small { color: #64748b; font-size: 11px; }
.ulicense-code-panel.is-html b { color: #fb923c; }
.ulicense-code-panel.is-css b { color: #60a5fa; }
.ulicense-code-panel.is-js b { color: #facc15; }
.ulicense-code-panel.is-single b { color: #a78bfa; }
.ulicense-code-panel textarea {
  width: 100%;
  min-height: 230px;
  resize: vertical;
  padding: 16px;
  color: #dbeafe;
  border: 0;
  outline: 0;
  background: #07111f;
  font: 13px/1.65 ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  tab-size: 2;
  box-shadow: none;
}
.ulicense-code-panel textarea:focus { background: #091625; box-shadow: inset 3px 0 0 #10b981; }
.ulicense-code-panel textarea.ulicense-single-editor { min-height: 620px; }
.ulicense-single-studio { border-color: rgba(139,92,246,.4); }
.ulicense-single-studio .ulicense-code-studio-head { background: radial-gradient(circle at 85% 0, rgba(139,92,246,.28), transparent 36%), #0b1728; }
.ulicense-single-studio .ulicense-code-kicker { color: #c4b5fd; }
.ulicense-file-upload { position: relative; overflow: hidden; }
.ulicense-file-upload input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.ulicense-code-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 20px;
  color: #94a3b8;
  border-top: 1px solid rgba(148,163,184,.16);
  background: #0b1728;
  font-size: 12px;
}
.ulicense-custom-home { width: 100%; min-width: 0; }
@media (max-width: 760px) {
  .ulicense-home-mode { grid-template-columns: 1fr; }
  .ulicense-code-studio-head, .ulicense-code-footer { align-items: stretch; flex-direction: column; }
  .ulicense-code-panel textarea { min-height: 190px; }
}

/* ════════════════════ COMUNIDAD (capa social tipo BuddyBoss) ════════════════════ */
.ulicense-community { max-width: 760px; margin: 0 auto; }
.ulicense-community-header { margin-bottom: 18px; }
.ulicense-community-header h1 { font-size: 28px; font-weight: 900; color: var(--ulicense-ink); margin: 0 0 4px; }
.ulicense-community-nav .ulicense-cart-count { margin-left: 4px; }

/* Tabs */
.ulicense-community-tabs {
  display: flex; gap: 4px; background: var(--ulicense-card);
  border: 1px solid var(--ulicense-line); border-radius: 16px; padding: 6px;
  margin-bottom: 20px; box-shadow: var(--ulicense-premium-shadow); overflow-x: auto;
}
.ulicense-ctab {
  flex: 1; min-width: max-content; border: 0; background: transparent; cursor: pointer;
  padding: 10px 16px; border-radius: 11px; font-weight: 700; color: var(--ulicense-muted);
  font-size: 14px; transition: all .18s ease; white-space: nowrap;
}
.ulicense-ctab:hover { color: var(--ulicense-ink); background: var(--ulicense-bg); }
.ulicense-ctab.is-active { color: #fff; background: linear-gradient(135deg, var(--ulicense-primary), var(--ulicense-secondary)); }

/* Rank chip */
.ulicense-rank-chip {
  display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 800;
  padding: 3px 9px; border-radius: 999px; color: var(--rank, #6b7280);
  background: color-mix(in srgb, var(--rank, #6b7280) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--rank, #6b7280) 28%, transparent); white-space: nowrap;
}

/* Composer */
.ulicense-feed-scope { display: flex; gap: 8px; margin-bottom: 14px; }
.ulicense-chip {
  border: 1px solid var(--ulicense-line); background: var(--ulicense-card); cursor: pointer;
  padding: 7px 16px; border-radius: 999px; font-weight: 700; font-size: 13px; color: var(--ulicense-muted);
  transition: all .15s ease;
}
.ulicense-chip:hover { color: var(--ulicense-ink); }
.ulicense-chip.is-active { color: #fff; background: var(--ulicense-primary); border-color: var(--ulicense-primary); }
.ulicense-composer {
  display: flex; gap: 12px; background: var(--ulicense-card); border: 1px solid var(--ulicense-line);
  border-radius: 18px; padding: 16px; margin-bottom: 18px; box-shadow: var(--ulicense-premium-shadow);
}
.ulicense-composer-main { flex: 1; }
.ulicense-textarea {
  width: 100%; border: 1px solid var(--ulicense-line); border-radius: 12px; padding: 11px 13px;
  font: inherit; font-size: 15px; color: var(--ulicense-ink); resize: vertical; background: var(--ulicense-bg);
  box-sizing: border-box;
}
.ulicense-textarea:focus { outline: none; border-color: var(--ulicense-primary); box-shadow: 0 0 0 4px var(--ulicense-focus); }
.ulicense-composer-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; gap: 10px; }
.ulicense-composer-foot .ulicense-muted { font-size: 12px; }

/* Post card */
.ulicense-feed { display: flex; flex-direction: column; gap: 16px; }
.ulicense-post {
  background: var(--ulicense-card); border: 1px solid var(--ulicense-line); border-radius: 18px;
  padding: 18px; box-shadow: var(--ulicense-premium-shadow);
}
.ulicense-post-head { display: flex; align-items: flex-start; gap: 12px; }
.ulicense-post-author { display: flex; gap: 12px; align-items: center; border: 0; background: none; cursor: pointer; padding: 0; flex: 1; text-align: left; }
.ulicense-post-author-meta { display: flex; flex-direction: column; }
.ulicense-post-author-name { font-weight: 800; color: var(--ulicense-ink); }
.ulicense-post-sub { font-size: 12px; }
.ulicense-post-del { border: 0; background: none; color: var(--ulicense-muted); cursor: pointer; font-size: 15px; padding: 4px 8px; border-radius: 8px; }
.ulicense-post-del:hover { color: var(--ulicense-danger); background: color-mix(in srgb, var(--ulicense-danger) 10%, transparent); }
.ulicense-post-body { margin: 12px 0; color: var(--ulicense-ink); line-height: 1.6; white-space: pre-wrap; word-break: break-word; }
.ulicense-mention { color: var(--ulicense-primary); font-weight: 700; background: color-mix(in srgb, var(--ulicense-primary) 10%, transparent); padding: 0 3px; border-radius: 5px; }
.ulicense-post-stats { display: flex; gap: 14px; align-items: center; font-size: 13px; padding-bottom: 10px; border-bottom: 1px solid var(--ulicense-line); }
.ulicense-react-summary { font-size: 13px; color: var(--ulicense-muted); font-weight: 600; }

.ulicense-post-actions { display: flex; gap: 8px; padding: 8px 0; }
.ulicense-react-wrap { position: relative; flex: 1; }
.ulicense-post-action {
  width: 100%; border: 0; background: var(--ulicense-bg); cursor: pointer; padding: 9px; border-radius: 11px;
  font-weight: 700; font-size: 13px; color: var(--ulicense-muted); transition: all .15s ease;
}
.ulicense-post-action:hover { color: var(--ulicense-ink); background: var(--ulicense-line); }
.ulicense-post-action.is-active { color: var(--ulicense-primary); background: color-mix(in srgb, var(--ulicense-primary) 12%, transparent); }
.ulicense-react-picker {
  position: absolute; bottom: 110%; left: 0; display: flex; gap: 4px; background: var(--ulicense-card);
  border: 1px solid var(--ulicense-line); border-radius: 999px; padding: 6px 10px; box-shadow: var(--ulicense-premium-shadow); z-index: 5;
}
.ulicense-react-opt { border: 0; background: none; cursor: pointer; font-size: 22px; line-height: 1; padding: 3px; border-radius: 50%; transition: transform .12s ease; }
.ulicense-react-opt:hover { transform: scale(1.35); }

/* Comments */
.ulicense-post-comments { margin-top: 6px; display: flex; flex-direction: column; gap: 10px; }
.ulicense-comment { display: flex; gap: 9px; align-items: flex-start; }
.ulicense-comment-bubble { background: var(--ulicense-bg); border-radius: 13px; padding: 8px 13px; font-size: 14px; color: var(--ulicense-ink); }
.ulicense-comment-bubble strong { display: inline-block; margin-right: 6px; }
.ulicense-comment-ago { display: block; font-size: 11px; margin-top: 2px; }
.ulicense-comment-compose { display: flex; gap: 8px; margin-top: 4px; }
.ulicense-comment-compose .ulicense-input { flex: 1; }
.ulicense-btn-sm { padding: 6px 14px !important; font-size: 13px !important; }

/* Members */
.ulicense-members-search { margin-bottom: 16px; }
.ulicense-members-search .ulicense-input { width: 100%; box-sizing: border-box; }
.ulicense-members-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.ulicense-member-card {
  background: var(--ulicense-card); border: 1px solid var(--ulicense-line); border-radius: 16px; padding: 18px;
  text-align: center; display: flex; flex-direction: column; align-items: center; gap: 10px; box-shadow: var(--ulicense-premium-shadow);
}
.ulicense-member-id { border: 0; background: none; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.ulicense-member-name { font-weight: 800; color: var(--ulicense-ink); }
.ulicense-member-stats { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; font-size: 12px; color: var(--ulicense-muted); }
.ulicense-member-stats strong { color: var(--ulicense-ink); }
.ulicense-member-you { font-weight: 700; }

/* Profile */
.ulicense-back { margin-bottom: 14px; }
.ulicense-profile-hero {
  display: flex; gap: 18px; align-items: center; flex-wrap: wrap; background: var(--ulicense-card);
  border: 1px solid var(--ulicense-line); border-radius: 18px; padding: 22px; box-shadow: var(--ulicense-premium-shadow); margin-bottom: 20px;
}
.ulicense-profile-meta { flex: 1; min-width: 200px; display: flex; flex-direction: column; gap: 8px; }
.ulicense-profile-meta h2 { margin: 0; font-size: 22px; font-weight: 900; color: var(--ulicense-ink); }
.ulicense-profile-cta { display: flex; gap: 8px; }
.ulicense-section-title { font-size: 16px; font-weight: 800; color: var(--ulicense-ink); margin: 0 0 12px; }

/* Messages */
.ulicense-thread-list { display: flex; flex-direction: column; gap: 8px; }
.ulicense-thread-item {
  display: flex; gap: 12px; align-items: center; width: 100%; text-align: left; cursor: pointer;
  background: var(--ulicense-card); border: 1px solid var(--ulicense-line); border-radius: 14px; padding: 12px 14px; transition: all .15s ease;
}
.ulicense-thread-item:hover { border-color: var(--ulicense-primary); }
.ulicense-thread-item.is-unread { background: color-mix(in srgb, var(--ulicense-primary) 6%, var(--ulicense-card)); }
.ulicense-thread-info { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ulicense-thread-name { font-weight: 800; color: var(--ulicense-ink); display: flex; align-items: center; gap: 8px; }
.ulicense-thread-preview { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ulicense-thread-ago { font-size: 11px; white-space: nowrap; }
.ulicense-thread-head { display: flex; gap: 10px; align-items: center; padding: 10px 0 14px; border-bottom: 1px solid var(--ulicense-line); margin-bottom: 14px; }
.ulicense-thread-body { display: flex; flex-direction: column; gap: 8px; max-height: 52vh; overflow-y: auto; padding: 4px; }
.ulicense-msg { max-width: 78%; padding: 9px 14px; border-radius: 16px; font-size: 14px; line-height: 1.4; background: var(--ulicense-bg); color: var(--ulicense-ink); align-self: flex-start; }
.ulicense-msg.mine { align-self: flex-end; background: linear-gradient(135deg, var(--ulicense-primary), var(--ulicense-secondary)); color: #fff; }
.ulicense-msg-ago { display: block; font-size: 10px; opacity: .7; margin-top: 3px; }
.ulicense-thread-compose { display: flex; gap: 8px; margin-top: 14px; }
.ulicense-thread-compose .ulicense-input { flex: 1; }

/* Leaderboard */
.ulicense-leaderboard { display: flex; flex-direction: column; gap: 8px; }
.ulicense-leader {
  display: flex; gap: 14px; align-items: center; width: 100%; text-align: left; cursor: pointer;
  background: var(--ulicense-card); border: 1px solid var(--ulicense-line); border-radius: 14px; padding: 12px 16px; transition: all .15s ease;
}
.ulicense-leader:hover { border-color: var(--ulicense-primary); }
.ulicense-leader.is-me { border-color: var(--ulicense-primary); background: color-mix(in srgb, var(--ulicense-primary) 8%, var(--ulicense-card)); }

/* Premium student visual identity */
.ulicense-student-visual-hero {
  min-height: 520px;
  margin: -36px -28px 42px;
  padding: 72px 8%;
  justify-items: start;
  text-align: left;
  color: #fff;
  background-image: linear-gradient(90deg, rgba(4,30,27,.94) 0%, rgba(4,30,27,.76) 45%, rgba(4,30,27,.18) 100%), var(--student-visual);
  background-size: cover;
  background-position: center;
}
.ulicense-student-visual-hero > div { position: relative; z-index: 2; max-width: 720px; }
.ulicense-student-visual-hero p { margin-left: 0; color: rgba(255,255,255,.82); }
.ulicense-student-visual-hero .ulicense-actions { justify-content: flex-start !important; }
.ulicense-student-visual-hero .ulicense-btn:not(.ulicense-btn-primary) { color: #fff; border-color: rgba(255,255,255,.34); background: rgba(255,255,255,.12); backdrop-filter: blur(14px); }
.ulicense-catalog-visual-head {
  min-height: 270px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin: -12px 0 26px;
  padding: 34px;
  color: #fff;
  border-radius: 26px;
  background-image: linear-gradient(90deg, rgba(4,30,27,.95), rgba(4,30,27,.55), rgba(4,30,27,.08)), var(--student-visual);
  background-size: cover;
  background-position: center;
  box-shadow: 0 26px 64px rgba(15,47,42,.18);
}
.ulicense-catalog-visual-head .ulicense-muted { color: rgba(255,255,255,.78); }
.ulicense-catalog-visual-head .ulicense-pill { color: #fff; border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.12); }

.ulicense-course-card {
  border: 0;
  box-shadow: 0 18px 46px rgba(15,47,42,.11);
}
.ulicense-course-card:hover { transform: translateY(-6px); box-shadow: 0 26px 60px rgba(15,47,42,.18); }
.ulicense-course-image { height: clamp(210px, 24vw, 340px); background-color: #0b312b; }
.ulicense-course-image:before { filter: blur(24px) brightness(.46) saturate(1.1); }
.ulicense-course-image img { object-fit: contain; }
.ulicense-course-image:after { background: linear-gradient(180deg, rgba(4,30,27,.02), rgba(4,30,27,.78)); }

.ulicense-student-layout { max-width: 1440px; padding: 32px 24px 56px; gap: 30px; }
.ulicense-student-sidebar > *,
.ulicense-activity-section {
  border-color: rgba(15,118,110,.12);
  box-shadow: 0 14px 36px rgba(15,47,42,.065);
}
.ulicense-student-profile-card,
.ulicense-xp-block,
.ulicense-badges-panel { border-radius: 18px; }
.ulicense-student-avatar,
.ulicense-avatar-initials { background: linear-gradient(135deg, var(--ulicense-primary), var(--ulicense-secondary)); }
.ulicense-xp-label { color: var(--ulicense-secondary); background: #ecfdf5; }
.ulicense-xp-fill { background: linear-gradient(90deg, var(--ulicense-primary), #34d399); }
.ulicense-student-hero {
  min-height: 255px;
  display: flex;
  align-items: end;
  padding: 34px;
  position: relative;
  overflow: hidden;
  color: #fff;
  border: 0;
  border-radius: 24px;
  background-image: linear-gradient(90deg, rgba(4,30,27,.94), rgba(4,30,27,.52), rgba(4,30,27,.08)), var(--student-visual);
  background-size: cover;
  background-position: center;
  box-shadow: 0 26px 64px rgba(15,47,42,.18);
}
.ulicense-student-hero > div { position: relative; z-index: 2; max-width: 600px; }
.ulicense-student-hero h1 { color: #fff; font-size: clamp(28px,4vw,44px); font-weight: 900; }
.ulicense-student-hero p { color: rgba(255,255,255,.8); font-size: 15px; }
.ulicense-activity-section { padding: 22px; border: 1px solid #e0eee9; border-radius: 20px; background: #fff; }
.ulicense-empty-state {
  min-height: 320px;
  justify-content: end;
  color: #fff;
  border: 0;
  background-image: linear-gradient(180deg, rgba(4,30,27,.1), rgba(4,30,27,.9)), var(--student-visual);
  background-size: cover;
  background-position: center;
}

.ulicense-player-layout { background: linear-gradient(180deg,#f5faf8,#fff); }
.ulicense-player-head {
  min-height: 245px;
  align-items: end;
  position: relative;
  overflow: hidden;
  color: #fff;
  border: 0;
  background-image: linear-gradient(90deg, rgba(3,24,23,.96), rgba(3,24,23,.62), rgba(3,24,23,.18)), var(--student-visual);
  background-size: cover;
  background-position: center;
  box-shadow: 0 24px 58px rgba(15,47,42,.18);
}
.ulicense-player-head > * { position: relative; z-index: 2; }
.ulicense-player-head p { color: rgba(255,255,255,.76); }
.ulicense-player-head .ulicense-pill { color: #fff; border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.12); }
.ulicense-player-progress-card > span { color: #fff; border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.12); }

.ulicense-student-auth .ulicense-auth-copy {
  min-height: 650px;
  color: #fff;
  border: 0;
  background-image: linear-gradient(90deg, rgba(3,27,25,.94), rgba(3,27,25,.48)), var(--student-visual);
  background-size: cover;
  background-position: center;
}
.ulicense-student-auth .ulicense-auth-copy p { color: rgba(255,255,255,.78); }
.ulicense-student-auth .ulicense-auth-points span { color: #fff; border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.12); backdrop-filter: blur(12px); }
.ulicense-student-auth .ulicense-auth-panel { border-radius: 24px; box-shadow: 0 30px 80px rgba(15,47,42,.16); }

.ulicense-profile-page::before {
  content: "";
  display: block;
  height: 230px;
  max-width: 1100px;
  margin: 0 auto -92px;
  border-radius: 26px;
  background-image: linear-gradient(90deg, rgba(3,27,25,.78), rgba(3,27,25,.08)), var(--student-visual);
  background-size: cover;
  background-position: center;
  box-shadow: 0 24px 60px rgba(15,47,42,.16);
}
.ulicense-profile-page .ulicense-profile-layout { position: relative; z-index: 2; max-width: 1000px; }
.ulicense-profile-page .ulicense-profile-sidebar,
.ulicense-profile-page .ulicense-profile-content .ulicense-card { padding: 18px; border-radius: 20px; background: rgba(255,255,255,.96); box-shadow: 0 18px 48px rgba(15,47,42,.1); backdrop-filter: blur(18px); }
.ulicense-cart-page {
  background-image: linear-gradient(180deg, rgba(248,252,250,.84), #f8fcfa 440px), var(--student-visual);
  background-size: 100% 440px;
  background-position: top center;
  background-repeat: no-repeat;
}
.ulicense-cart-page .ulicense-cart-item,
.ulicense-cart-page .ulicense-cart-summary { border: 0; border-radius: 20px; box-shadow: 0 18px 48px rgba(15,47,42,.11); }

.ulicense-student-visual-settings { margin: 24px 0; padding: 22px; border: 1px solid #dce9e4; border-radius: 20px; background: linear-gradient(180deg,#f8fcfa,#fff); }
.ulicense-student-visual-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); gap: 14px; }
.ulicense-student-visual-setting { display: grid; gap: 10px; padding: 12px; border: 1px solid #dce9e4; border-radius: 16px; background: #fff; }
.ulicense-student-visual-preview { height: 110px; border-radius: 12px; background: #e8f3ef center/cover no-repeat; }
.ulicense-student-visual-setting div:nth-child(2) { display: grid; gap: 3px; }
.ulicense-student-visual-setting span { color: #64748b; font-size: 11px; }

@media (max-width: 860px) {
  .ulicense-student-visual-hero { min-height: 440px; margin: -36px -28px 32px; padding: 50px 28px; background-position: 62% center; }
  .ulicense-student-hero { min-height: 230px; }
  .ulicense-catalog-visual-head { min-height: 230px; align-items: end; }
  .ulicense-player-head { min-height: 220px; }
  .ulicense-profile-page::before { height: 180px; margin-bottom: -70px; }
}
@media (max-width: 600px) {
  .ulicense-student-visual-hero { min-height: 500px; background-position: 68% center; }
  .ulicense-student-visual-hero h1 { font-size: 38px; }
  .ulicense-student-hero { min-height: 280px; padding: 24px; background-position: 70% center; }
  .ulicense-catalog-visual-head { min-height: 300px; display: grid; padding: 24px; background-position: 68% center; }
  .ulicense-player-head { min-height: 300px; align-items: flex-end; padding: 20px; background-position: 66% center; }
  .ulicense-student-auth .ulicense-auth-copy { min-height: 420px; padding: 28px; }
}
.ulicense-leader-pos { font-weight: 900; font-size: 16px; color: var(--ulicense-muted); width: 28px; text-align: center; }
.ulicense-leader-pos.top { color: var(--ulicense-warning); }
.ulicense-leader-meta { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.ulicense-leader-name { font-weight: 800; color: var(--ulicense-ink); }
.ulicense-leader-xp { font-size: 14px; color: var(--ulicense-muted); }
.ulicense-leader-xp strong { color: var(--ulicense-ink); }

@media (max-width: 600px) {
  .ulicense-composer { padding: 12px; }
  .ulicense-members-grid { grid-template-columns: 1fr 1fr; }
  .ulicense-msg { max-width: 88%; }
}

/* Commercial settings */
.ulicense-plans-builder {
  display: grid;
  gap: 16px;
  padding: 20px;
  border: 1px solid var(--ulicense-line);
  border-radius: 18px;
  background: var(--ulicense-card);
}
.ulicense-section-head,
.ulicense-plan-editor-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.ulicense-section-head h3,
.ulicense-plan-editor-head strong { margin: 0; }
.ulicense-plan-list { display: grid; gap: 14px; }
.ulicense-plan-editor {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid var(--ulicense-line);
  border-radius: 14px;
  background: var(--ulicense-bg);
}
.ulicense-empty-action {
  display: grid;
  justify-items: start;
  gap: 8px;
  padding: 24px;
  border: 1px dashed var(--ulicense-line);
  border-radius: 14px;
}
@media (max-width: 700px) {
  .ulicense-section-head,
  .ulicense-plan-editor-head { align-items: stretch; flex-direction: column; }
}

/* ════════════════════════════════════════════════════════════════════════
   ULICENSE ACADEMY PRO · PREMIUM IMPACT UPGRADE
   Capa de realce visual (override por cascada). No altera estructura ni JS.
   Identidad: esmeralda · teal · jade, con acento dorado de lujo y vidrio.
   ════════════════════════════════════════════════════════════════════════ */

:root {
  /* Paleta premium ampliada (coherente con la marca verde existente) */
  --ul-emerald:      #059669;
  --ul-emerald-deep: #047857;
  --ul-teal:         #0f766e;
  --ul-jade:         #10b981;
  --ul-mint:         #34d399;
  --ul-lime:         #6ee7b7;
  --ul-gold:         #d4a017;   /* acento de lujo, uso puntual */
  --ul-gold-soft:    #f4d58d;

  /* Gradientes firma */
  --ul-grad-brand:   linear-gradient(135deg, #10b981 0%, #059669 42%, #0f766e 100%);
  --ul-grad-brand-vivid: linear-gradient(120deg, #34d399 0%, #059669 45%, #0d9488 100%);
  --ul-grad-text:    linear-gradient(100deg, #047857 0%, #059669 35%, #14b8a6 70%, #34d399 100%);
  --ul-grad-gold:    linear-gradient(135deg, #f4d58d, #d4a017);
  --ul-grad-sheen:   linear-gradient(115deg, transparent 0%, rgba(255,255,255,.55) 50%, transparent 100%);

  /* Sistema de sombras por capas (ambiente + clave + brillo de color) */
  --ul-shadow-sm:  0 2px 6px rgba(15,47,42,.06), 0 1px 2px rgba(15,47,42,.05);
  --ul-shadow-md:  0 8px 20px rgba(15,47,42,.08), 0 2px 6px rgba(15,47,42,.06);
  --ul-shadow-lg:  0 22px 48px rgba(15,47,42,.12), 0 6px 14px rgba(15,47,42,.07);
  --ul-shadow-xl:  0 38px 80px rgba(15,47,42,.18), 0 10px 24px rgba(15,47,42,.10);
  --ul-glow-brand: 0 14px 34px rgba(5,150,105,.34), 0 4px 10px rgba(13,148,136,.22);
  --ul-glow-brand-hover: 0 20px 48px rgba(5,150,105,.46), 0 6px 14px rgba(13,148,136,.30);

  /* Superficies / vidrio */
  --ul-glass:      rgba(255,255,255,.72);
  --ul-glass-line: rgba(255,255,255,.65);
  --ul-hairline:   linear-gradient(135deg, rgba(16,185,129,.55), rgba(15,118,110,.18) 55%, rgba(255,255,255,0));

  /* Override del token premium existente */
  --ulicense-premium-shadow: var(--ul-shadow-xl);
}

/* ── Easings de marca ──────────────────────────────────────────────────── */
/* (cubic-bezier suaves para micro-interacciones con sensación cara) */

/* ────────────────────────────────────────────────────────────────────────
   1 · FONDO DE APP — profundidad sutil con mallas de color
   ──────────────────────────────────────────────────────────────────────── */
.ulicense-app {
  background:
    radial-gradient(circle at 88% 6%, rgba(52,211,153,.16), transparent 30%),
    radial-gradient(circle at 4% 92%, rgba(13,148,136,.12), transparent 32%),
    linear-gradient(180deg, #fbfffe 0%, var(--ulicense-bg) 100%);
}

/* ────────────────────────────────────────────────────────────────────────
   2 · TIPOGRAFÍA — texto con degradado real (antes era plano)
   ──────────────────────────────────────────────────────────────────────── */
.ulicense-gradient-text {
  background: var(--ul-grad-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  background-size: 200% auto;
  animation: ulGradShift 7s ease-in-out infinite alternate;
}
@keyframes ulGradShift {
  to { background-position: 100% center; }
}

.ulicense-hero h1,
.ulicense-learning-hero h1,
.ulicense-student-hero h1 {
  letter-spacing: -.018em;
}

/* ────────────────────────────────────────────────────────────────────────
   3 · TOPBAR — vidrio premium con filo de luz
   ──────────────────────────────────────────────────────────────────────── */
.ulicense-topbar {
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.82));
  backdrop-filter: blur(22px) saturate(1.4);
  -webkit-backdrop-filter: blur(22px) saturate(1.4);
  border-bottom: 1px solid transparent;
  box-shadow: 0 1px 0 rgba(255,255,255,.6) inset, var(--ul-shadow-sm);
  position: relative;
}
.ulicense-topbar::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(16,185,129,.5), rgba(13,148,136,.35), transparent);
}

/* Marca / logo glossy */
.ulicense-logo-mark {
  background: var(--ul-grad-brand);
  box-shadow: var(--ul-glow-brand), inset 0 1px 0 rgba(255,255,255,.45);
  position: relative;
}
.ulicense-logo-mark::after {
  content: "";
  position: absolute; inset: 0;
  border-radius: inherit;
  background: linear-gradient(160deg, rgba(255,255,255,.4), transparent 55%);
  pointer-events: none;
}

/* ────────────────────────────────────────────────────────────────────────
   4 · BOTONES — gradiente, brillo de color y barrido de luz al hover
   ──────────────────────────────────────────────────────────────────────── */
.ulicense-btn {
  border-radius: 13px;
  font-weight: 800;
  letter-spacing: -.005em;
  position: relative;
  overflow: hidden;
  transition:
    transform .18s cubic-bezier(.34,1.56,.64,1),
    box-shadow .22s ease,
    border-color .2s ease,
    background .2s ease,
    filter .2s ease;
}
.ulicense-btn:active { transform: translateY(0) scale(.985); }

/* Barrido de brillo (solo en primario) */
.ulicense-btn-primary {
  background: var(--ul-grad-brand);
  border-color: transparent;
  color: #fff;
  box-shadow: var(--ul-glow-brand), inset 0 1px 0 rgba(255,255,255,.32);
}
.ulicense-btn-primary::before {
  content: "";
  position: absolute;
  top: 0; left: -120%;
  width: 60%; height: 100%;
  background: var(--ul-grad-sheen);
  transform: skewX(-18deg);
  transition: left .6s cubic-bezier(.22,.61,.36,1);
  pointer-events: none;
}
.ulicense-btn-primary:hover {
  background: var(--ul-grad-brand-vivid);
  box-shadow: var(--ul-glow-brand-hover), inset 0 1px 0 rgba(255,255,255,.4);
  transform: translateY(-2px);
  filter: saturate(1.06);
}
.ulicense-btn-primary:hover::before { left: 130%; }

/* Secundario / ghost: CONTRASTE GARANTIZADO (texto oscuro sobre claro).
   Especificidad 0,2,0 a propósito: NO debe pisar reglas de contexto (héroe,
   bienvenida admin, etc.) que necesitan texto blanco. */
.ulicense-btn:not(.ulicense-btn-primary) {
  background: linear-gradient(180deg, #ffffff, #f6fffb);
  color: var(--ulicense-ink);
  border-color: rgba(15,118,110,.16);
  box-shadow: var(--ul-shadow-sm);
}
.ulicense-btn:not(.ulicense-btn-primary):hover {
  background: #ecfdf5;
  color: var(--ul-emerald-deep);
  border-color: rgba(5,150,105,.45);
  box-shadow: var(--ul-shadow-md);
  transform: translateY(-2px);
}

/* Peligro (rojo): reafirmado con .ulicense-btn.ulicense-btn-danger (0,2,0)
   para que el secundario no lo pise y conserve su identidad roja. */
.ulicense-btn.ulicense-btn-danger {
  background: linear-gradient(180deg, #fff, #fff1f1);
  color: var(--ulicense-danger);
  border-color: #fecaca;
  box-shadow: var(--ul-shadow-sm);
}
.ulicense-btn.ulicense-btn-danger:hover {
  background: #fee2e2;
  color: var(--ulicense-danger);
  border-color: #f87171;
}

/* Secundarios sobre HÉROES OSCUROS: vidrio con texto blanco legible
   (normal y hover). Resuelve el botón "Ver catálogo" en blanco sobre blanco. */
.ulicense-student-visual-hero .ulicense-btn:not(.ulicense-btn-primary),
.ulicense-student-hero .ulicense-btn:not(.ulicense-btn-primary),
.ulicense-catalog-visual-head .ulicense-btn:not(.ulicense-btn-primary) {
  background: rgba(255,255,255,.16);
  color: #fff;
  border-color: rgba(255,255,255,.45);
  backdrop-filter: blur(14px);
  box-shadow: none;
}
.ulicense-student-visual-hero .ulicense-btn:not(.ulicense-btn-primary):hover,
.ulicense-student-hero .ulicense-btn:not(.ulicense-btn-primary):hover,
.ulicense-catalog-visual-head .ulicense-btn:not(.ulicense-btn-primary):hover {
  background: rgba(255,255,255,.28);
  color: #fff;
  border-color: rgba(255,255,255,.78);
}

/* Ícono de carrito con relieve */
.ulicense-cart-icon { box-shadow: var(--ul-glow-brand), inset 0 1px 0 rgba(255,255,255,.4); }

/* ────────────────────────────────────────────────────────────────────────
   5 · TARJETAS — elevación por capas + filo degradado + lift suave
   ──────────────────────────────────────────────────────────────────────── */
.ulicense-card {
  border: 1px solid rgba(15,118,110,.10);
  border-radius: 20px;
  box-shadow: var(--ul-shadow-md);
  position: relative;
  transition: transform .24s cubic-bezier(.22,.61,.36,1), box-shadow .24s ease;
}
.ulicense-card::before {
  content: "";
  position: absolute; inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: var(--ul-hairline);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity: .9;
  pointer-events: none;
}

/* Tarjetas de curso: lift premium + zoom de imagen */
.ulicense-course-card {
  border-radius: 22px;
  box-shadow: var(--ul-shadow-lg);
}
.ulicense-course-card:hover {
  transform: translateY(-8px);
  box-shadow: var(--ul-shadow-xl);
}
.ulicense-course-image img {
  transition: transform .5s cubic-bezier(.22,.61,.36,1);
}
.ulicense-course-card:hover .ulicense-course-image img {
  transform: scale(1.015);
}
.ulicense-course-image::after {
  background: linear-gradient(180deg, rgba(4,30,27,0) 30%, rgba(4,30,27,.55) 75%, rgba(4,30,27,.82));
}
/* Badge de progreso circular con glow */
.ulicense-course-overlay strong {
  background: var(--ul-grad-brand);
  box-shadow: 0 14px 30px rgba(5,150,105,.4), inset 0 1px 0 rgba(255,255,255,.4);
}

/* ────────────────────────────────────────────────────────────────────────
   6 · STAT CARDS — barra de acento, número con degradado, blob luminoso
   ──────────────────────────────────────────────────────────────────────── */
.ulicense-stat {
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff, #f7fffb);
  border: 1px solid rgba(15,118,110,.1);
  box-shadow: var(--ul-shadow-md);
  overflow: hidden;
}
.ulicense-stat::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--ul-grad-brand-vivid);
  opacity: .9;
}
.ulicense-stat::after {
  background: radial-gradient(circle, rgba(52,211,153,.20), transparent 70%);
  width: 120px; height: 120px;
}
.ulicense-stat strong {
  background: var(--ul-grad-text);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  font-weight: 950;
  letter-spacing: -.02em;
  line-height: 1.3;
  padding-top: 2px;
  overflow: visible;
}

/* ────────────────────────────────────────────────────────────────────────
   7 · HÉROES — degradados ricos + orbes de luz flotantes animados
   ──────────────────────────────────────────────────────────────────────── */
.ulicense-hero { isolation: isolate; }
.ulicense-hero::before {
  background: radial-gradient(circle, rgba(16,185,129,.22), transparent 70%);
  filter: blur(70px);
  animation: ulFloat 11s ease-in-out infinite;
}
.ulicense-hero::after {
  content: "";
  position: absolute;
  inset: auto -10% -25% 50%;
  height: 320px; width: 320px;
  background: radial-gradient(circle, rgba(13,148,136,.18), transparent 70%);
  filter: blur(80px);
  border-radius: 999px;
  z-index: -1;
  animation: ulFloat 13s ease-in-out infinite reverse;
}
@keyframes ulFloat {
  0%,100% { transform: translate(0,0) scale(1); }
  50%     { transform: translate(18px,-22px) scale(1.08); }
}

/* Learning hero: gradiente jade más profundo + filo */
.ulicense-learning-hero {
  border: 1px solid rgba(16,185,129,.22);
  background:
    radial-gradient(circle at 96% 8%, rgba(52,211,153,.22), transparent 32%),
    radial-gradient(circle at 4% 100%, rgba(13,148,136,.14), transparent 36%),
    linear-gradient(135deg, #ffffff 0%, #ecfdf5 65%, #d1fae5 100%);
  box-shadow: var(--ul-shadow-lg);
}
.ulicense-learning-score {
  background: var(--ul-grad-brand);
  box-shadow: var(--ul-glow-brand), inset 0 1px 0 rgba(255,255,255,.35);
}

/* Héroes con imagen (alumno / catálogo): overlay más cinematográfico */
.ulicense-student-visual-hero,
.ulicense-student-hero,
.ulicense-catalog-visual-head {
  position: relative;
  box-shadow: var(--ul-shadow-xl);
}
.ulicense-student-visual-hero::after,
.ulicense-student-hero::after,
.ulicense-catalog-visual-head::after {
  content: "";
  position: absolute; inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at 18% 30%, rgba(16,185,129,.28), transparent 45%);
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: 1;
}
.ulicense-student-visual-hero > *,
.ulicense-student-hero > * { position: relative; z-index: 2; }

/* ────────────────────────────────────────────────────────────────────────
   8 · BARRAS DE PROGRESO — gradiente + barrido de brillo animado
   ──────────────────────────────────────────────────────────────────────── */
.ulicense-progress {
  height: 10px;
  background: #e6f4ee;
  box-shadow: inset 0 1px 2px rgba(15,47,42,.08);
}
.ulicense-progress span {
  background: linear-gradient(90deg, var(--ul-emerald), var(--ul-mint), var(--ul-lime));
  box-shadow: 0 0 12px rgba(52,211,153,.55);
  position: relative;
  overflow: hidden;
}
.ulicense-progress span::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
  transform: translateX(-100%);
  animation: ulShimmer 2.2s ease-in-out infinite;
}
@keyframes ulShimmer { to { transform: translateX(100%); } }

.ulicense-xp-fill {
  background: linear-gradient(90deg, var(--ul-emerald), var(--ul-mint)) !important;
  box-shadow: 0 0 12px rgba(52,211,153,.5);
}

/* ────────────────────────────────────────────────────────────────────────
   9 · PILLS, CHIPS Y TÍTULOS — coherencia de marca y acabado fino
   ──────────────────────────────────────────────────────────────────────── */
.ulicense-pill {
  background: linear-gradient(180deg, rgba(16,185,129,.1), rgba(16,185,129,.05));
  border-color: rgba(16,185,129,.28);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
  letter-spacing: .02em;
}

/* Chips de catálogo: del índigo a la identidad esmeralda */
.ulicense-filter-chip:hover {
  border-color: var(--ul-emerald);
  color: var(--ul-emerald-deep);
  background: #ecfdf5;
}
.ulicense-filter-chip.is-active {
  border-color: transparent;
  background: var(--ul-grad-brand);
  color: #fff;
  box-shadow: var(--ul-glow-brand);
}

.ulicense-section-title {
  letter-spacing: -.015em;
}

/* Items de lección: acento lateral al hover/activo */
.ulicense-lesson-item {
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.ulicense-lesson-item:hover { transform: translateX(3px); }
.ulicense-lesson-item.active {
  box-shadow: inset 3px 0 0 var(--ul-emerald), var(--ul-shadow-sm);
}

/* Avatares con gradiente glossy */
.ulicense-student-avatar,
.ulicense-avatar-initials {
  background: var(--ul-grad-brand) !important;
  box-shadow: var(--ul-glow-brand), inset 0 1px 0 rgba(255,255,255,.4);
}

/* ────────────────────────────────────────────────────────────────────────
   10 · ENTRADAS ANIMADAS — aparición elegante de tarjetas y héroes
   ──────────────────────────────────────────────────────────────────────── */
@keyframes ulRise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
.ulicense-card,
.ulicense-stat,
.ulicense-learning-hero,
.ulicense-student-hero,
.ulicense-student-visual-hero,
.ulicense-catalog-visual-head {
  animation: ulRise .5s cubic-bezier(.22,.61,.36,1) both;
}

/* ── Respeto a preferencias de movimiento reducido ─────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .ulicense-gradient-text,
  .ulicense-hero::before,
  .ulicense-hero::after,
  .ulicense-progress span::after,
  .ulicense-card,
  .ulicense-stat,
  .ulicense-learning-hero,
  .ulicense-student-hero,
  .ulicense-student-visual-hero,
  .ulicense-catalog-visual-head {
    animation: none !important;
  }
  .ulicense-btn-primary::before { transition: none; }
}

/* ════════════════════ FIN · PREMIUM IMPACT UPGRADE ════════════════════ */

/* ════════════════════════════════════════════════════════════════════════
   CRM · FICHA DE CLIENTE PRO — diseño estilizado y profesional
   ════════════════════════════════════════════════════════════════════════ */
.ulicense-client-card {
  border: 1px solid rgba(15,118,110,.10);
  border-radius: 22px;
  padding: 24px;
  box-shadow: var(--ul-shadow-lg);
  position: relative;
  overflow: hidden;
  animation: ulRise .5s cubic-bezier(.22,.61,.36,1) both;
}
.ulicense-client-card::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0;
  height: 4px;
  background: var(--ul-grad-brand-vivid);
}

/* Cabecera */
.ulicense-client-head {
  grid-template-columns: 56px minmax(0,1fr) auto;
  gap: 14px;
  padding-bottom: 18px;
  margin-bottom: 18px;
  border-bottom: 1px solid #eef4f1;
}
.ulicense-client-identity h3 {
  font-size: 18px;
  font-weight: 950;
  letter-spacing: -.01em;
  line-height: 1.15;
}
.ulicense-client-identity p { font-size: 13px; margin-top: 2px; }

.ulicense-avatar {
  width: 56px; height: 56px;
  border-radius: 16px;
  background: var(--ul-grad-brand);
  box-shadow: var(--ul-glow-brand), inset 0 1px 0 rgba(255,255,255,.4);
  font-size: 18px;
}

.ulicense-client-head-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 7px;
}
.ulicense-client-xp {
  font-size: 12px;
  font-weight: 950;
  color: var(--ulicense-secondary);
  background: #ecfdf5;
  border: 1px solid rgba(16,185,129,.22);
  padding: 4px 10px;
  border-radius: 999px;
  letter-spacing: .02em;
}

/* Estado con punto */
.ulicense-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  letter-spacing: .04em;
}
.ulicense-status i {
  width: 7px; height: 7px; border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 18%, transparent);
}

/* Tiles de metadatos */
.ulicense-client-meta div {
  background: linear-gradient(180deg, #ffffff, #f6fdfa);
  border: 1px solid rgba(15,118,110,.1);
  border-radius: 14px;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.ulicense-client-meta div:hover {
  border-color: rgba(5,150,105,.32);
  box-shadow: var(--ul-shadow-sm);
  transform: translateY(-1px);
}
.ulicense-client-meta strong { font-weight: 850; }

/* Secciones y grupos */
.ulicense-client-section { margin-bottom: 16px; }
.ulicense-client-group-label {
  display: block;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ulicense-secondary);
  margin-bottom: 9px;
  padding-left: 11px;
  position: relative;
}
.ulicense-client-group-label::before {
  content: "";
  position: absolute; left: 0; top: 50%;
  transform: translateY(-50%);
  width: 4px; height: 13px;
  border-radius: 999px;
  background: var(--ul-grad-brand-vivid);
}

.ulicense-pill-tag {
  background: linear-gradient(180deg, #eef2ff, #e0e7ff);
  border-color: rgba(99,102,241,.22);
  color: #4338ca;
}

/* Bloque de acciones agrupado */
.ulicense-client-actions {
  display: grid;
  gap: 16px;
  padding: 18px;
  margin-top: 4px;
  border-radius: 18px;
  border: 1px solid #eef4f1;
  background: linear-gradient(180deg, #fbfffe, #f5fbf8);
}
.ulicense-client-group {
  padding-bottom: 14px;
  border-bottom: 1px dashed #dceee6;
}
.ulicense-client-group:last-of-type { padding-bottom: 0; border-bottom: 0; }
.ulicense-client-actions .ulicense-action-row { gap: 9px; margin-bottom: 9px; }
.ulicense-client-actions .ulicense-action-row:last-child { margin-bottom: 0; }
.ulicense-action-row .ulicense-input {
  flex: 1 1 200px;
  min-height: 40px;
}
.ulicense-action-row .ulicense-btn {
  min-height: 40px;
  padding: 8px 14px;
  font-size: 13px;
}

/* Zona de peligro destacada */
.ulicense-client-danger {
  display: flex;
  justify-content: flex-end;
  padding-top: 14px;
  border-top: 1px solid #f6e0e0;
}

@media (max-width: 720px) {
  .ulicense-client-head-side { align-items: flex-start; }
  .ulicense-client-meta { grid-template-columns: 1fr; }
}
/* ════════════════════ FIN · CRM FICHA DE CLIENTE PRO ════════════════════ */

@media (max-width: 720px) {
  .ulicense-cover-upload {
    grid-template-columns: 1fr;
  }

  .ulicense-course-image {
    height: 220px;
  }
}

/* ════════════════════ AISLAMIENTO DE HOVER / FOCUS ════════════════════
   Algunos temas de WordPress aplican fondos oscuros a cualquier <button>
   durante hover. Estos estados preservan la identidad visual de la app. */
.ulicense-app-shell .ulicense-card:hover,
.ulicense-app-shell .ulicense-member-card:hover,
.ulicense-app-shell .ulicense-post:hover,
.ulicense-app-shell .ulicense-profile-hero:hover {
  background: var(--ulicense-card) !important;
}

.ulicense-app-shell .ulicense-member-card {
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.ulicense-app-shell .ulicense-member-card:hover {
  transform: translateY(-4px);
  border-color: rgba(5, 150, 105, .3);
  box-shadow: var(--ul-shadow-lg);
}

.ulicense-app-shell .ulicense-member-id:hover,
.ulicense-app-shell .ulicense-member-id:focus-visible,
.ulicense-app-shell .ulicense-post-author:hover,
.ulicense-app-shell .ulicense-post-author:focus-visible,
.ulicense-app-shell .ulicense-react-opt:hover,
.ulicense-app-shell .ulicense-react-opt:focus-visible,
.ulicense-app-shell .ulicense-brand:hover,
.ulicense-app-shell .ulicense-brand:focus-visible,
.ulicense-app-shell .ulicense-chapter-title:hover,
.ulicense-app-shell .ulicense-chapter-title:focus-visible {
  background: transparent !important;
  color: inherit;
}

.ulicense-app-shell .ulicense-chip:hover,
.ulicense-app-shell .ulicense-chip:focus-visible {
  background: #ecfdf5 !important;
  border-color: rgba(5, 150, 105, .38);
  color: var(--ulicense-secondary) !important;
}

.ulicense-app-shell .ulicense-chip.is-active,
.ulicense-app-shell .ulicense-chip.is-active:hover,
.ulicense-app-shell .ulicense-chip.is-active:focus-visible {
  background: var(--ulicense-primary) !important;
  border-color: var(--ulicense-primary);
  color: #fff !important;
}

.ulicense-app-shell .ulicense-ctab:hover,
.ulicense-app-shell .ulicense-ctab:focus-visible {
  background: var(--ulicense-bg) !important;
  color: var(--ulicense-ink) !important;
}

.ulicense-app-shell .ulicense-ctab.is-active,
.ulicense-app-shell .ulicense-ctab.is-active:hover,
.ulicense-app-shell .ulicense-ctab.is-active:focus-visible {
  background: linear-gradient(135deg, var(--ulicense-primary), var(--ulicense-secondary)) !important;
  color: #fff !important;
}

.ulicense-app-shell .ulicense-thread-item:hover,
.ulicense-app-shell .ulicense-thread-item:focus-visible,
.ulicense-app-shell .ulicense-leader:hover,
.ulicense-app-shell .ulicense-leader:focus-visible {
  background: var(--ulicense-card) !important;
  border-color: var(--ulicense-primary);
  color: var(--ulicense-ink);
  box-shadow: var(--ul-shadow-md);
  transform: translateY(-2px);
}

.ulicense-app-shell .ulicense-thread-item.is-unread,
.ulicense-app-shell .ulicense-thread-item.is-unread:hover,
.ulicense-app-shell .ulicense-thread-item.is-unread:focus-visible,
.ulicense-app-shell .ulicense-leader.is-me,
.ulicense-app-shell .ulicense-leader.is-me:hover,
.ulicense-app-shell .ulicense-leader.is-me:focus-visible {
  background: color-mix(in srgb, var(--ulicense-primary) 8%, var(--ulicense-card)) !important;
}

.ulicense-app-shell .ulicense-post-del:hover,
.ulicense-app-shell .ulicense-post-del:focus-visible {
  background: color-mix(in srgb, var(--ulicense-danger) 10%, transparent) !important;
  color: var(--ulicense-danger) !important;
}

.ulicense-app-shell .ulicense-post-action:hover,
.ulicense-app-shell .ulicense-post-action:focus-visible {
  background: var(--ulicense-line) !important;
  color: var(--ulicense-ink) !important;
}

.ulicense-app-shell .ulicense-post-action.is-active,
.ulicense-app-shell .ulicense-post-action.is-active:hover,
.ulicense-app-shell .ulicense-post-action.is-active:focus-visible {
  background: color-mix(in srgb, var(--ulicense-primary) 12%, transparent) !important;
  color: var(--ulicense-primary) !important;
}

.ulicense-app-shell .ulicense-mini-cta:hover,
.ulicense-app-shell .ulicense-mini-cta:focus-visible {
  background: #ecfdf5 !important;
  color: var(--ulicense-secondary) !important;
  border-color: rgba(5, 150, 105, .35);
  border-radius: 8px;
}

.ulicense-app-shell .ulicense-admin-quick-grid button:hover,
.ulicense-app-shell .ulicense-admin-quick-grid button:focus-visible {
  background: #fff !important;
  color: #123b34 !important;
}

.ulicense-app-shell .ulicense-hb-palette-btn:hover,
.ulicense-app-shell .ulicense-hb-palette-btn:focus-visible,
.ulicense-app-shell .ulicense-page-btn:hover,
.ulicense-app-shell .ulicense-page-btn:focus-visible,
.ulicense-app-shell .ulicense-page-num:hover,
.ulicense-app-shell .ulicense-page-num:focus-visible,
.ulicense-app-shell .ulicense-filter-chip:hover,
.ulicense-app-shell .ulicense-filter-chip:focus-visible,
.ulicense-app-shell .ulicense-search-result:hover,
.ulicense-app-shell .ulicense-search-result:focus-visible {
  color: var(--ulicense-ink);
}

/* GeneratePress también aplica el fondo oscuro en button:focus. */
.ulicense-app-shell .ulicense-btn-primary:focus {
  background: var(--ul-grad-brand-vivid) !important;
  color: #fff !important;
}

.ulicense-app-shell .ulicense-btn:not(.ulicense-btn-primary):focus {
  background: #ecfdf5 !important;
  color: var(--ul-emerald-deep) !important;
  border-color: rgba(5, 150, 105, .45);
}

.ulicense-app-shell .ulicense-btn.ulicense-btn-danger:focus {
  background: #fee2e2 !important;
  color: var(--ulicense-danger) !important;
}

.ulicense-app-shell .ulicense-student-visual-hero .ulicense-btn:not(.ulicense-btn-primary):focus,
.ulicense-app-shell .ulicense-student-hero .ulicense-btn:not(.ulicense-btn-primary):focus,
.ulicense-app-shell .ulicense-catalog-visual-head .ulicense-btn:not(.ulicense-btn-primary):focus {
  background: rgba(255, 255, 255, .28) !important;
  color: #fff !important;
}

.ulicense-app-shell .ulicense-member-id:focus,
.ulicense-app-shell .ulicense-post-author:focus,
.ulicense-app-shell .ulicense-react-opt:focus,
.ulicense-app-shell .ulicense-brand:focus,
.ulicense-app-shell .ulicense-chapter-title:focus {
  background: transparent !important;
  color: inherit;
}

.ulicense-app-shell .ulicense-chip:focus {
  background: #ecfdf5 !important;
  color: var(--ulicense-secondary) !important;
}

.ulicense-app-shell .ulicense-chip.is-active:focus,
.ulicense-app-shell .ulicense-ctab.is-active:focus {
  background: linear-gradient(135deg, var(--ulicense-primary), var(--ulicense-secondary)) !important;
  color: #fff !important;
}

.ulicense-app-shell .ulicense-ctab:focus,
.ulicense-app-shell .ulicense-thread-item:focus,
.ulicense-app-shell .ulicense-leader:focus {
  background: var(--ulicense-card) !important;
  color: var(--ulicense-ink) !important;
}

.ulicense-app-shell .ulicense-thread-item.is-unread:focus,
.ulicense-app-shell .ulicense-leader.is-me:focus {
  background: color-mix(in srgb, var(--ulicense-primary) 8%, var(--ulicense-card)) !important;
}

.ulicense-app-shell .ulicense-mini-cta:focus {
  background: #ecfdf5 !important;
  color: var(--ulicense-secondary) !important;
}