/*
  Targeted UI fixes — 2026-08-03
  1) Article-detail hero actions: compact, consistently aligned buttons.
  2) Login/register mobile checkboxes: restore native compact dimensions.
*/

/* Article detail hero buttons: align with RTL copy and keep both controls compact. */
body.learn-detail-page .charisma-page-hero .hero-actions{
  display:flex !important;
  flex-flow:row wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  direction:rtl !important;
  width:auto !important;
  max-width:100% !important;
  gap:10px !important;
  margin:16px 0 0 !important;
}
body.learn-detail-page .charisma-page-hero .hero-actions .btn{
  flex:0 0 auto !important;
  width:auto !important;
  min-width:132px !important;
  min-height:44px !important;
  padding:9px 18px !important;
  border-radius:14px !important;
  font-size:.86rem !important;
  line-height:1.55 !important;
  font-weight:850 !important;
  white-space:nowrap !important;
  box-shadow:0 12px 26px rgba(15,23,42,.16) !important;
}

@media (max-width:640px){
  body.learn-detail-page .charisma-page-hero .hero-actions{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    width:min(100%,320px) !important;
    gap:8px !important;
    margin:14px 0 0 !important;
  }
  body.learn-detail-page .charisma-page-hero .hero-actions .btn{
    width:100% !important;
    min-width:0 !important;
    min-height:42px !important;
    padding:8px 10px !important;
    border-radius:13px !important;
    font-size:.81rem !important;
  }

  /* Loaded only on the authentication pages. This overrides the broad mobile input rule. */
  body > .page .check input[type="checkbox"]{
    appearance:auto !important;
    -webkit-appearance:checkbox !important;
    display:inline-block !important;
    width:18px !important;
    min-width:18px !important;
    max-width:18px !important;
    height:18px !important;
    min-height:18px !important;
    max-height:18px !important;
    padding:0 !important;
    border-radius:4px !important;
    box-shadow:none !important;
    flex:0 0 18px !important;
    accent-color:#7a5cff !important;
  }
  body > .page .row .check input[type="checkbox"]{
    margin:0 !important;
  }
  body > .page .policy .check input[type="checkbox"]{
    margin:4px 0 0 !important;
  }
}

@media (max-width:360px){
  body.learn-detail-page .charisma-page-hero .hero-actions{
    grid-template-columns:1fr !important;
    width:min(100%,230px) !important;
  }
}