/* Learning Hub pages rendered inside the installed IhsanYouth app. */
body[data-app-learning="true"]{background:#eaf1fb}
/* Keep the same shell, header and gutters as every other app tab. */
body[data-app-learning="true"] .app-shell>main{margin-inline:calc(-1 * var(--app-pad));width:auto;max-width:none}
body[data-app-learning="true"] .learning-home-redesign,
body[data-app-learning="true"] .lc-page,
body[data-app-learning="true"] .fg-page,
body[data-app-learning="true"] .learning-account-shell,
body[data-app-learning="true"] .learning-quran-page,
body[data-app-learning="true"] .learning-library-page,
body[data-app-learning="true"] .learning-classes-page{min-width:0;padding-bottom:22px}
body[data-app-learning="true"] .learning-home-redesign .container,
body[data-app-learning="true"] .learning-home-redesign .lh-body,
body[data-app-learning="true"] .lc-page .container,
body[data-app-learning="true"] .fg-page .container,
body[data-app-learning="true"] .learning-account-shell.container{width:100%;max-width:none}
body[data-app-learning="true"] .learning-home-redesign .lh-body{padding-inline:16px}
body[data-app-learning="true"] .learning-home-redesign .learning-intro.container{padding-inline:20px}
body[data-app-learning="true"] .learning-home-redesign .lh-course-nav.container{padding-inline:16px}
body[data-app-learning="true"] .learning-home-redesign .lh-community{margin-inline:16px}
body[data-app-learning="true"] .learning-home-redesign .lh-hero-account{right:20px}
body[data-app-learning="true"] .learning-account-shell{padding-inline:20px}

.app-learning-auth{padding:0 20px 24px}
.app-learning-auth .app-back{margin-top:4px}
.app-learning-auth-layout{display:grid;gap:18px}
.app-learning-auth-intro{position:relative;overflow:hidden;padding:24px 22px;border-radius:20px;color:#fff;background:radial-gradient(circle at 100% 0,#326fd7 0,transparent 40%),linear-gradient(135deg,#0b315f,#1256ae);box-shadow:0 12px 30px #0d376233}
.app-learning-auth-intro:after{content:"";position:absolute;right:-35px;bottom:-50px;width:160px;height:160px;border:1px solid #f3cb6f66;border-radius:50%}
.app-learning-auth-icon{display:grid;place-items:center;width:46px;height:46px;margin-bottom:15px;border-radius:14px;color:#153d70;background:#ffda83}
.app-learning-auth-icon .icon{width:28px;height:28px}
.app-learning-auth-kicker{margin:0 0 5px;color:#ffdb85!important;font-size:.75rem!important;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.app-learning-auth-intro h1{margin:0;color:#fff!important;font-size:clamp(1.85rem,8vw,2.45rem)!important;line-height:1.08;letter-spacing:-.045em}
.app-learning-auth-intro>p:not(.app-learning-auth-kicker){margin:10px 0 0;color:#e4efff!important;font-size:1rem!important;line-height:1.55}
.app-learning-auth-intro ul{position:relative;z-index:1;display:grid;gap:8px;margin:18px 0 0;padding:0;list-style:none;color:#f6f9ff;font-size:.9rem;font-weight:650}
.app-learning-auth-intro li{display:flex;align-items:flex-start;gap:8px}
.app-learning-auth-intro li:before{content:"✓";display:grid;place-items:center;flex:none;width:18px;height:18px;margin-top:1px;border-radius:50%;color:#173c71;background:#ffda83;font-size:.75rem;font-weight:900}
body[data-app-learning="true"] .app-learning-auth .learning-account-panel{width:100%;max-width:none;margin:0;padding:22px 20px;border-radius:20px;box-shadow:0 8px 22px #173e700d}
body[data-app-learning="true"] .app-learning-auth .learning-account-panel h1{font-size:clamp(1.65rem,7vw,2.15rem)!important}
body[data-app-learning="true"] .app-learning-auth .learning-account-note{font-size:.8rem;line-height:1.5}

@media(min-width:700px){
  body[data-app-learning="true"] .learning-home-redesign .lh-body{padding-inline:24px}
  body[data-app-learning="true"] .learning-home-redesign .learning-intro.container{padding-inline:28px}
  body[data-app-learning="true"] .learning-home-redesign .lh-course-nav.container{padding-inline:24px}
  body[data-app-learning="true"] .learning-home-redesign .lh-community{margin-inline:24px}
  .app-learning-auth{padding-inline:28px}
  .app-learning-auth-layout{grid-template-columns:minmax(0,.8fr) minmax(0,1fr);align-items:start}
  .app-learning-auth-intro{min-height:100%;padding:28px 24px}
}

@media(max-width:430px){
  body[data-app-learning="true"] .learning-home-redesign .lh-body{padding-inline:12px}
  body[data-app-learning="true"] .learning-home-redesign .learning-intro.container{padding-inline:12px}
  body[data-app-learning="true"] .learning-home-redesign .lh-course-nav.container{padding-inline:10px}
  body[data-app-learning="true"] .learning-home-redesign .lh-community{margin-inline:12px}
  .app-learning-auth{padding-inline:14px}
}

/* Selected compact home: three visible shortcuts beneath the hero. */
body[data-app-learning="true"] .lh-home-compact{background:#f0f7ff}
body[data-app-learning="true"] .lh-home-compact .learning-intro.container{
  width:calc(100% - 24px);margin:0 auto;padding:0;min-height:0;height:auto;
  border-radius:12px;background:radial-gradient(ellipse at 30% 45%,#074775,#052b4e 85%);
}
body[data-app-learning="true"] .lh-home-compact .lh-hero-inner{
  display:grid;grid-template-columns:minmax(0,1fr) 96px;
  grid-template-areas:"eyebrow account" "heading artwork" "description artwork" "actions actions" "quote quote";
  align-items:center;gap:10px 10px;height:auto;padding:12px 16px;
}
body[data-app-learning="true"] .lh-home-compact :is(.lh-hero-copy,.lh-hero-visual,.lh-hero-artwork){display:contents}
body[data-app-learning="true"] .lh-home-compact .lh-eyebrow{grid-area:eyebrow;min-height:0;padding:0;font-size:.75rem;line-height:1.4;letter-spacing:.07em}
body[data-app-learning="true"] .lh-home-compact .lh-eyebrow span{margin:0 1px}
body[data-app-learning="true"] .lh-home-compact .lh-hero-account{grid-area:account;position:relative;top:auto;right:auto;justify-self:end;max-width:100%}
body[data-app-learning="true"] .lh-home-compact .lh-sign-out{min-height:44px;padding:6px 0;gap:5px;border:0;background:transparent;font-size:.875rem;white-space:nowrap}
body[data-app-learning="true"] .lh-home-compact .lh-sign-out svg{width:18px;height:18px}
body[data-app-learning="true"] .lh-home-compact .lh-sign-out-status:not(:empty){position:absolute;top:44px;right:0;width:min(240px,75vw);z-index:5}
body[data-app-learning="true"] .lh-home-compact .learning-intro h1{grid-area:heading;align-self:end;margin:0;color:#fff;font-size:clamp(1.5rem,6.5vw,2rem);line-height:1.13;letter-spacing:-.045em}
body[data-app-learning="true"] .lh-home-compact .lh-hero-art{grid-area:artwork;display:block;width:96px;height:106px;object-fit:cover;border:1px solid #e4c77b;border-radius:12px}
body[data-app-learning="true"] .lh-home-compact .lh-hero-description{grid-area:description;align-self:start;max-width:none;font-size:1rem;line-height:1.35}
body[data-app-learning="true"] .lh-home-compact .lh-hero-values{display:none}
body[data-app-learning="true"] .lh-home-compact .learning-actions{grid-area:actions;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:2px 0 0}
body[data-app-learning="true"] .lh-home-compact .learning-actions a{width:100%;height:auto;min-height:44px;padding:8px 6px;white-space:normal;text-align:center;font-size:.875rem;line-height:1.3;border-radius:8px}
body[data-app-learning="true"] .lh-home-compact .learning-actions a span{margin-left:5px}
body[data-app-learning="true"] .lh-home-compact .lh-hero-quote{grid-area:quote;position:static;transform:none;width:100%;margin:0;padding:10px 12px;border-radius:8px;background:#fff4dc;color:#12324e;font:italic 600 1rem/1.35 Georgia,serif;text-align:center}
body[data-app-learning="true"] .lh-home-compact .lh-hero-quote cite{font-size:.875rem;font-style:normal;margin-top:4px}
body[data-app-learning="true"] .lh-home-compact .lh-quick-links.container{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:calc(100% - 24px);margin:8px auto 16px;padding:0;gap:4px;background:none;border:0;border-radius:0;box-shadow:none;overflow:visible}
body[data-app-learning="true"] .lh-home-compact .lh-quick-links a{min-width:0;min-height:48px;padding:8px 2px;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:4px;border:1px solid #164368;border-radius:10px;background:linear-gradient(110deg,#073455,#042746);color:#fff;text-align:center}
body[data-app-learning="true"] .lh-home-compact .lh-quick-links a+a::before{display:none}
body[data-app-learning="true"] .lh-home-compact .lh-quick-links .lh-my-learning{background:linear-gradient(115deg,#ffdc82,#ffe5a0);border-color:#ffdf95;color:#092c4b}
body[data-app-learning="true"] .lh-home-compact .lh-quick-links .lh-nav-img{width:20px;height:20px;flex:none;color:#f4d685}
body[data-app-learning="true"] .lh-home-compact .lh-quick-links .lh-my-learning .lh-nav-img{color:#092c4b}
body[data-app-learning="true"] .lh-home-compact .lh-quick-links strong{font-size:.875rem;line-height:1.25;font-weight:750;letter-spacing:-.035em}
body[data-app-learning="true"] .lh-home-compact .lh-quick-links small{display:none}
body[data-app-learning="true"] .lh-home-compact .lh-quick-links a:hover{border-color:#c99c44;transform:none;box-shadow:0 2px 8px #123a7026}
body[data-app-learning="true"] .lh-home-compact .lh-body{width:100%;padding-inline:12px}
body[data-app-learning="true"] .lh-home-compact .lh-featured>.lh-section-heading{display:flex;flex-wrap:wrap;align-items:flex-start;gap:2px;margin:0 0 10px}
body[data-app-learning="true"] .lh-home-compact .lh-featured .lh-section-heading h2{font-size:1.375rem;line-height:1.2;letter-spacing:-.04em}
body[data-app-learning="true"] .lh-home-compact .lh-featured :is(.lh-kicker,.lh-section-heading p,.lh-course-controls){display:none}
body[data-app-learning="true"] .lh-home-compact .lh-heading-actions{flex-basis:100%}
body[data-app-learning="true"] .lh-home-compact .lh-featured .lh-heading-actions>.lh-view-courses{min-height:44px;margin:0;padding:6px 0;border:0;background:none;box-shadow:none;color:#07579a;font-size:1rem;gap:6px}
body[data-app-learning="true"] .lh-home-compact .lh-courses{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0}
body[data-app-learning="true"] .lh-home-compact .lh-course-card{display:flex;flex-direction:column;border-radius:10px}
body[data-app-learning="true"] .lh-home-compact .lh-course-image{height:auto;aspect-ratio:1.9}
body[data-app-learning="true"] .lh-home-compact .lh-course-image>img{width:100%;height:100%;object-fit:cover}
body[data-app-learning="true"] .lh-home-compact .lh-course-image::after{display:none}
body[data-app-learning="true"] .lh-home-compact :is(.lh-start-badge,.lh-course-number){display:none}
body[data-app-learning="true"] .lh-home-compact .lh-course-info{flex:1;min-height:0;padding:10px;gap:10px}
body[data-app-learning="true"] .lh-home-compact .lh-course-card h3{min-height:0;font-size:1rem;line-height:1.25;letter-spacing:-.035em}
body[data-app-learning="true"] .lh-home-compact .lh-course-card p{display:none}
body[data-app-learning="true"] .lh-home-compact .lh-course-card a{min-height:52px;margin-top:auto;padding:8px 5px;font-size:.875rem;line-height:1.25;text-align:center;border-radius:8px}
@media(max-width:360px){
  body[data-app-learning="true"] .lh-home-compact .lh-hero-inner{grid-template-columns:minmax(0,1fr) 84px;padding-inline:12px}
  body[data-app-learning="true"] .lh-home-compact .lh-hero-art{width:84px;height:102px}
  body[data-app-learning="true"] .lh-home-compact .lh-quick-links a{flex-direction:column;gap:4px}
}