.ap-card-head p {
      font-size: .78rem;
      color: var(--ap-secondary);
      margin: .15rem 0 0;
    }

    .ap-card-body {
      padding: 1.35rem;
    }

    .form-label {
      font-size: .82rem;
      font-weight: 600;
      color: var(--ap-text-strong);
    }

    .form-text {
      font-size: .74rem;
    }

    .form-control,
    .form-select {
      background: var(--ap-bg);
      border: 1px solid var(--ap-border);
      border-radius: var(--ap-radius-sm);
      font-size: .85rem;
      color: var(--ap-text-strong);
    }

    .form-control:focus,
    .form-select:focus {
      border-color: var(--ap-primary);
      box-shadow: 0 0 0 3px var(--ap-primary-100);
    }

    .form-control:disabled,
    .form-select:disabled {
      background: var(--ap-border);
      opacity: .6;
    }

    .form-check-input {
      cursor: pointer;
    }

    .form-check-label {
      font-size: .85rem;
      color: var(--ap-text);
    }

    .form-switch .form-check-input {
      width: 2.6em;
      height: 1.4em;
      cursor: pointer;
    }

    .section-title {
      font-size: .95rem;
      font-weight: 700;
      color: var(--ap-text-strong);
      margin-bottom: 1rem;
    }

    /* Input group icons */
    .ap-input-icon-group {
      position: relative;
    }

    .ap-input-icon-group i {
      position: absolute;
      left: .8rem;
      top: 50%;
      transform: translateY(-50%);
      color: var(--ap-secondary);
      font-size: .95rem;
      z-index: 5;
    }

    .ap-input-icon-group .form-control {
      padding-left: 2.3rem;
    }

    .ap-toggle-pass {
      position: absolute;
      right: .75rem;
      top: 50%;
      transform: translateY(-50%);
      border: 0;
      background: transparent;
      color: var(--ap-secondary);
      font-size: .95rem;
      z-index: 5;
    }

    /* Password strength */
    .ap-strength {
      height: 4px;
      border-radius: 10px;
      background: var(--ap-border);
      margin-top: .5rem;
      overflow: hidden;
    }

    .ap-strength-bar {
      height: 100%;
      width: 0%;
      background: var(--ap-danger);
      transition: width .2s ease, background .2s ease;
    }

    .ap-strength-label {
      font-size: .72rem;
      color: var(--ap-secondary);
      margin-top: .3rem;
    }

    /* Chip / tag multi-select */
    .ap-chip-select {
      display: flex;
      flex-wrap: wrap;
      gap: .5rem;
      background: var(--ap-bg);
      border: 1px solid var(--ap-border);
      border-radius: var(--ap-radius-sm);
      padding: .5rem;
    }

    .ap-chip {
      background: var(--ap-primary-100);
      color: var(--ap-primary);
      font-size: .78rem;
      font-weight: 600;
      padding: .25rem .5rem .25rem .7rem;
      border-radius: 20px;
      display: inline-flex;
      align-items: center;
      gap: .35rem;
    }

    .ap-chip button {
      border: 0;
      background: transparent;
      color: var(--ap-primary);
      font-size: .75rem;
      line-height: 1;
      padding: 0;
    }

    .ap-chip-input {
      border: 0;
      background: transparent;
      outline: none;
      font-size: .85rem;
      color: var(--ap-text-strong);
      flex: 1;
      min-width: 80px;
    }

    /* Range slider */
    .form-range::-webkit-slider-thumb {
      background: var(--ap-primary);
    }

    .form-range::-moz-range-thumb {
      background: var(--ap-primary);
    }

    .ap-range-value {
      font-size: .8rem;
      font-weight: 700;
      color: var(--ap-primary);
    }

    /* Color swatches */
    .ap-color-swatch {
      width: 34px;
      height: 34px;
      border-radius: 8px;
      cursor: pointer;
      border: 2px solid transparent;
      display: inline-block;
    }

    .ap-color-swatch.active {
      border-color: var(--ap-text-strong);
    }

    .ap-color-input-preview {
      width: 36px;
      height: 36px;
      border-radius: 8px;
      border: 1px solid var(--ap-border);
      flex-shrink: 0;
    }

    /* File upload dropzone */
    .ap-upload-box {
      border: 2px dashed var(--ap-border);
      border-radius: var(--ap-radius-sm);
      padding: 1.8rem;
      text-align: center;
      color: var(--ap-secondary);
      font-size: .83rem;
      background: var(--ap-bg);
      cursor: pointer;
      transition: border-color .15s ease, background .15s ease;
    }

    .ap-upload-box:hover,
    .ap-upload-box.dragover {
      border-color: var(--ap-primary);
      background: var(--ap-primary-100);
    }

    .ap-upload-box i {
      font-size: 1.8rem;
      color: var(--ap-primary);
      margin-bottom: .5rem;
      display: block;
    }

    .ap-file-row {
      display: flex;
      align-items: center;
      gap: .7rem;
      padding: .6rem 0;
      border-bottom: 1px solid var(--ap-border);
      font-size: .82rem;
    }

    .ap-file-row:last-child {
      border-bottom: none;
    }

    .ap-file-icon {
      width: 34px;
      height: 34px;
      border-radius: var(--ap-radius-sm);
      background: var(--ap-danger-100);
      color: var(--ap-danger);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    /* Rich text editor mock */
    .ap-rte {
      border: 1px solid var(--ap-border);
      border-radius: var(--ap-radius-sm);
      overflow: hidden;
    }

    .ap-rte-toolbar {
      display: flex;
      flex-wrap: wrap;
      gap: .15rem;
      padding: .5rem;
      border-bottom: 1px solid var(--ap-border);
      background: var(--ap-bg);
    }

    .ap-rte-btn {
      width: 30px;
      height: 30px;
      border-radius: 6px;
      border: 0;
      background: transparent;
      color: var(--ap-text);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: .85rem;
    }

    .ap-rte-btn:hover,
    .ap-rte-btn.active {
      background: var(--ap-primary-100);
      color: var(--ap-primary);
    }

    .ap-rte-divider {
      width: 1px;
      background: var(--ap-border);
      margin: .3rem .3rem;
    }

    .ap-rte-body {
      min-height: 140px;
      padding: 1rem;
      font-size: .85rem;
      color: var(--ap-text-strong);
      outline: none;
    }

    .ap-rte-body:empty::before {
      content: attr(data-placeholder);
      color: var(--ap-secondary);
    }

    /* Wizard */
    .ap-wizard-steps {
      display: flex;
      margin-bottom: 2rem;
    }

    .ap-wizard-step {
      flex: 1;
      text-align: center;
      position: relative;
    }

    .ap-wizard-step:not(:last-child)::after {
      content: "";
      position: absolute;
      top: 19px;
      left: 50%;
      width: 100%;
      height: 2px;
      background: var(--ap-border);
      z-index: 0;
    }

    .ap-wizard-step.done:not(:last-child)::after {
      background: var(--ap-success);
    }

    .ap-wizard-circle {
      width: 38px;
      height: 38px;
      border-radius: 50%;
      background: var(--ap-bg);
      border: 2px solid var(--ap-border);
      color: var(--ap-secondary);
      font-weight: 700;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto .5rem;
      position: relative;
      z-index: 1;
      font-size: .9rem;
    }

    .ap-wizard-step.active .ap-wizard-circle {
      background: var(--ap-primary);
      border-color: var(--ap-primary);
      color: #fff;
    }

    .ap-wizard-step.done .ap-wizard-circle {
      background: var(--ap-success);
      border-color: var(--ap-success);
      color: #fff;
    }

    .ap-wizard-label {
      font-size: .78rem;
      font-weight: 600;
      color: var(--ap-secondary);
    }

    .ap-wizard-step.active .ap-wizard-label {
      color: var(--ap-text-strong);
    }

    .ap-wizard-pane {
      display: none;
    }

    .ap-wizard-pane.active {
      display: block;
      animation: apFade .2s ease;
    }

    @keyframes apFade {
      from {
        opacity: 0;
        transform: translateY(4px);
      }

      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    /* Validation states demo */
    .was-validated-demo .form-control.is-valid,
    .form-control.is-valid {
      border-color: var(--ap-success);
      background-image: none;
    }

    .was-validated-demo .form-control.is-invalid,
    .form-control.is-invalid {
      border-color: var(--ap-danger);
      background-image: none;
    }

    .valid-feedback,
    .invalid-feedback {
      font-size: .76rem;
      display: block;
    }

    /* ============ Utility classes (extracted from inline styles) ============ */

    /* Font sizes */
    .ap-fs-13 {
      font-size: 1.3rem;
    }

    .ap-fs-06 {
      font-size: .6rem;
    }

    .ap-fs-095 {
      font-size: .95rem;
    }

    .ap-fs-083 {
      font-size: .83rem;
    }

    .ap-fs-085 {
      font-size: .85rem;
    }

    .ap-fs-072 {
      font-size: .72rem;
    }

    .ap-fs-2 {
      font-size: 2rem;
    }

    /* Text colors */
    .ap-color-strong {
      color: var(--ap-text-strong);    margin-right: 1%;
    }

    .ap-color-secondary {
      color: var(--ap-secondary);
    }

    .ap-color-primary {
      color: var(--ap-primary);
    }

    .ap-color-success {
      color: var(--ap-success);
    }

    .ap-color-danger {
      color: var(--ap-danger);
    }

    /* Font weight */
    .ap-fw-600 {
      font-weight: 600;
    }

    .ap-fw-700 {
      font-weight: 700;
    }

    /* Transparent button */
    .ap-btn-transparent {
      background: transparent;
    }

    /* Small dropdown menu */
    .ap-menu-sm {
      font-size: .85rem;
    }

    /* Input group text addon */
    .ap-input-group-text {
      background: var(--ap-bg);
      border-color: var(--ap-border);
      color: var(--ap-secondary);
      font-size: .83rem;
    }

    /* Password input extra padding for toggle */
    .ap-input-with-toggle {
      padding-right: 2.4rem;
    }

    /* Color input (native picker) */
    .ap-color-input {
      width: 44px;
      height: 36px;
      padding: .2rem;
    }

    /* File row body */
    .ap-file-row-body {
      flex-grow: 1;
    }

    .ap-file-row-name {
      font-weight: 600;
      color: var(--ap-text-strong);
    }

    .ap-file-row-size {
      color: var(--ap-secondary);
      font-size: .72rem;
    }

    .ap-file-badge {
      background: var(--ap-success-100);
      color: var(--ap-success);
      font-weight: 700;
    }

    /* Upload browse link */
    .ap-upload-browse {
      color: var(--ap-primary);
      font-weight: 600;
    }

    .ap-upload-hint {
      font-size: .72rem;
    }

    /* Validation feedback inline */
    .ap-feedback-valid {
      color: var(--ap-success);
      display: block;
    }

    .ap-feedback-invalid {
      color: var(--ap-danger);
      display: block;
    }

    /* Wizard success icon */
    .ap-wizard-success-icon {
      font-size: 2rem;
      color: var(--ap-success);
    }

    .ap-wizard-success-text {
      color: var(--ap-secondary);
      font-size: .83rem;
    }

    /* Footer */
    .ap-footer {
      color: var(--ap-secondary);
    }