/*User Registration Dashboard*/
@layer components {
    .ur-dashboard-skin {
        position: relative;
        padding:10% 0!important;
    }
    .ur-dashboard-skin #user-registration{
        margin:0 !important;
    }
    /* ====== LAYOUT WRAPPER ====== */
    .ur-dashboard-skin #user-registration.user-registration-MyAccount {
      max-width: 1400px !important;
      margin-inline: auto !important;
      display: grid !important;
      grid-template-columns: 340px 1fr !important;
      background: transparent !important; /* purple */
      border-radius: 0 20px 20px 0 !important;
      overflow: hidden !important;
      box-shadow: 0 24px 80px rgba(0,0,0,.35) !important;
    }
  
    @media (max-width: 1023px) {
      .ur-dashboard-skin #user-registration.user-registration-MyAccount {
        grid-template-columns: 1fr !important;
        border-radius: 20px !important;
        text-align:left !important;
      }
    }
  
    /* curățare: pluginul uneori pune padding/margini aiurea */
    .ur-dashboard-skin #user-registration.user-registration-MyAccount.vertical {
      padding: 0 !important;
      border: 0 !important;
    }
  
    /* ====== LEFT NAV ====== */
    .ur-dashboard-skin .user-registration-MyAccount-navigation--wrapper {
      position: relative !important;
      background: #2e1a47e3 !important; /* purple */
      border-right: 1px solid rgba(255,255,255,.08) !important;
      overflow: hidden !important;
      max-width: 480px !important;
      padding: 20px 0!important;
      border-radius:0 !important;
    }
  

  

  
    .ur-dashboard-skin .user-registration-MyAccount-navigation ul {
      list-style: none !important;
      margin: 0 !important;
      padding: 0 !important;
      position: relative !important;
      z-index: 2 !important;
    }
  
    .ur-dashboard-skin .user-registration-MyAccount-navigation li {
      margin: 0 !important;
    }
  
    .ur-dashboard-skin .user-registration-MyAccount-navigation li a {
      display: flex !important;
      align-items: center !important;
      padding: 18px 22px !important;
      font-weight: 800 !important;
      font-size: 13px !important;
      letter-spacing: .2px !important;
      color: rgba(255,255,255,.78) !important;
      text-decoration: none !important;
      border-top: 1px solid rgba(255,255,255,.06) !important;
      background: rgba(255,255,255,.02) !important;
      transition: background .18s ease, color .18s ease !important;
      border-color:none !important;
      border:0 !important;
      border-radius:0 !important;
    }
  
    .ur-dashboard-skin .user-registration-MyAccount-navigation li a:hover {
      background: rgba(215,230,106,.12) !important;
      color: rgba(255,255,255,.92) !important;
    }
  
    /* active item (ai deja .is-active pe <li>) */
    .ur-dashboard-skin .user-registration-MyAccount-navigation li.is-active a {
      background:var(--secondary-color)!important;
      color: #2A1740 !important;
    }
  
    /* ====== RIGHT CONTENT ====== */
    .ur-dashboard-skin .user-registration-MyAccount-content {
      padding: 42px 48px !important;
      color: rgba(255,255,255,.72) !important;
      text-align: left !important;
      background: var(--primary-color) !important; /* purple */
      min-height:500px;
    }
  
    @media (max-width: 1023px) {
      .ur-dashboard-skin .user-registration-MyAccount-content {
        padding: 26px 22px !important;
      }
    }
  
    /* scoatem headerul “Dashboard” din top (în screenshot nu apare ca title separat) */
    .ur-dashboard-skin .user-registration-MyAccount-content__header {
      display: none !important;
    }
  
    /* “Welcome, X!” */
    .ur-dashboard-skin .user-registration-MyAccount-content__body > h2 {
      margin: 0 0 14px 0 !important;
      color: #D7E66A !important;
      font-weight: 900 !important;
      letter-spacing: -0.02em !important;
      font-size: 44px !important;
      line-height: 1.05 !important;
    }
  
    @media (max-width: 1023px) {
      .ur-dashboard-skin .user-registration-MyAccount-content__body > h2 {
        font-size: 34px !important;
      }
    }
  
    /* blocul de sub welcome (în screenshot e subtil / aproape invizibil) */
    .ur-dashboard-skin .user-registration-profile-header {
      display: none !important;
    }
  
    /* paragrafe */
    .ur-dashboard-skin .user-registration-MyAccount-content__body p {
      margin-top: 12px !important;
      line-height: 1.75 !important;
      color: rgba(255,255,255,.66) !important;
      max-width: 62ch !important;
    }
  
    /* linkuri (profile details / password) */
    .ur-dashboard-skin .user-registration-MyAccount-content__body a {
      color: #D7E66A !important;
      text-decoration: underline !important;
      text-underline-offset: 2px !important;
    }
  
    /* “Not X? Sign out.” – îl împingem jos ca în screenshot */
    .ur-dashboard-skin .user-registration-MyAccount-content__body p:last-of-type {
      
      color: rgba(255,255,255,.55) !important;
    }
  
    .ur-dashboard-skin .user-registration-MyAccount-content__body p:last-of-type a {
      font-weight: 800 !important;
    }
    .ur-dashboard-skin .ur-frontend-form.login{
        background:var(--primary-color)!important;
    }
    .ur-dashboard-skin .user-registration-myaccount-notice-box {
        background-color: var(--primary-color)!important;
        border: 0 !important;
        border-radius: 8px;
        padding: 20px;
        margin-bottom: 32px;
        box-shadow: none !important;
        position: relative;
        border-left: 0 !important;
 
    }
  }

  /*User Registration Fields*/
  @layer components {
    /* ===== User Registration - Form fields skin (My Account) ===== */
  
    /* spațiere între rânduri */
    .ur-dashboard-skin .user-registration-MyAccount-content form,
    .ur-dashboard-skin .user-registration-MyAccount-content .ur-frontend-form {
      display: block !important;
    }
  
    .ur-dashboard-skin .user-registration-MyAccount-content .ur-form-row,
    .ur-dashboard-skin .user-registration-MyAccount-content .ur-row,
    .ur-dashboard-skin .user-registration-MyAccount-content .form-row,
    .ur-dashboard-skin .user-registration-MyAccount-content p {
      margin: 0 0 18px 0 !important;
    }
  
    /* LABELS (lime) */
    .ur-dashboard-skin .user-registration-MyAccount-content label,
    .ur-dashboard-skin .user-registration-MyAccount-content .ur-label,
    .ur-dashboard-skin .user-registration-MyAccount-content .user-registration-MyAccount-content__body label {
      display: block !important;
      margin: 0 0 10px 0 !important;
      color: var(--secondary-color) !important;
      font-weight: 800 !important;
      font-size: 14px !important;
      letter-spacing: .2px !important;
    }
  
    /* INPUT / TEXTAREA / SELECT (alb, înalt, rounded) */
    .ur-dashboard-skin .user-registration-MyAccount-content input[type="text"],
    .ur-dashboard-skin .user-registration-MyAccount-content input[type="email"],
    .ur-dashboard-skin .user-registration-MyAccount-content input[type="tel"],
    .ur-dashboard-skin .user-registration-MyAccount-content input[type="url"],
    .ur-dashboard-skin .user-registration-MyAccount-content input[type="number"],
    .ur-dashboard-skin .user-registration-MyAccount-content input[type="password"],
    .ur-dashboard-skin .user-registration-MyAccount-content textarea,
    .ur-dashboard-skin .user-registration-MyAccount-content select {
      width: 100% !important;
      max-width: 100% !important;
  
      background: #ffffff !important;
      color: var(--primary-color)!important;
  
      border: 0 !important;
      border-radius: 12px !important;
  
      padding: 18px 18px !important;
      min-height: 68px !important;
  
      outline: none !important;
      box-shadow: 0 2px 0 rgba(0,0,0,.18) !important; /* linia subtilă de jos ca în poză */
    }
  
    /* textarea să fie mai înalt */
    .ur-dashboard-skin .user-registration-MyAccount-content textarea {
      min-height: 140px !important;
      resize: vertical !important;
    }
  
    /* placeholder discret */
    .ur-dashboard-skin .user-registration-MyAccount-content input::placeholder,
    .ur-dashboard-skin .user-registration-MyAccount-content textarea::placeholder {
      color: rgba(42,23,64,.45) !important;
    }
  
    /* focus: halo lime discret (fără să schimbe layout) */
    .ur-dashboard-skin .user-registration-MyAccount-content input:focus,
    .ur-dashboard-skin .user-registration-MyAccount-content textarea:focus,
    .ur-dashboard-skin .user-registration-MyAccount-content select:focus {
      box-shadow:
        0 2px 0 rgba(0,0,0,.18),
        0 0 0 4px rgba(215,230,106,.25) !important;
    }
  
    /* dacă pluginul pune “background” pe wrapperul de field */
    .ur-dashboard-skin .user-registration-MyAccount-content .ur-field,
    .ur-dashboard-skin .user-registration-MyAccount-content .ur-form-field,
    .ur-dashboard-skin .user-registration-MyAccount-content .form-group {
      background: transparent !important;
      border: 0 !important;
      padding: 0 !important;
      margin: 0 0 18px 0 !important;
    }
  
    /* buton (optional) – să se potrivească cu tema */
    .ur-dashboard-skin .user-registration-MyAccount-content button,
    .ur-dashboard-skin .user-registration-MyAccount-content input[type="submit"],
    .ur-dashboard-skin .user-registration-MyAccount-content .button {
        display: flex !important;
        width: 100%;
        justify-content: left !important;
        align-items: center !important;
        gap: 0.75rem !important;
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
        height: 60px !important;
        padding: 10px 24px;
        font-size: 15px;
        line-height: 25px;
        font-weight: 600 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.12em !important;
        border-bottom-left-radius: 10px !important;
        background-color: var(--secondary-color) !important;
        color: var(--primary-color) !important;
        transition: background-color 0.2s ease, color 0.2s ease !important;
        border: 1px solid var(--secondary-color) !important;
        cursor: pointer !important;
    }
  
    .ur-dashboard-skin .user-registration-MyAccount-content button:hover,
    .ur-dashboard-skin .user-registration-MyAccount-content input[type="submit"]:hover,
    .ur-dashboard-skin .user-registration-MyAccount-content .button:hover {
      filter: brightness(0.97) !important;
    }
    .ur-dashboard-skin .user-registration-profile-fields h2 {
        text-align: left !important;
        color: var(--secondary-color) !important;
    }
  }
  
  