/**
 * The NMFG developer's override sheet.
 *
 * A visual pass over the site, authored outside this repo against the built
 * pages and handed over as one file. It is kept as one file, and linked after
 * `public/css/styles.css` rather than folded into it, so that what he wrote
 * stays legible as his: he re-sends this file, and the diff is his diff.
 *
 * Where it sits in the cascade, and why that is the only safe place:
 *
 *   1. `public/css/styles.css`   <link>   the Hugo contract
 *   2. THIS FILE                 <link>   overrides it
 *   3. tokens/rtl/latin-ext      <style>  Astro inlines its bundle last
 *
 * Almost every selector here carries `#wrapper` or `#main`, so it outranks
 * anything in the inlined bundle on specificity and the third position costs
 * nothing. Two rules do not, and they are the reason for position 2 rather
 * than a `src/styles/` import: `.whats-new` and `.book-intro__cover` tie with
 * `styles.css` and win only by coming after it. Adding a rule here that names
 * no id, and that `tokens.css`, `rtl.css` or `blocks.css` also names, will
 * lose silently.
 *
 * Sides are written in the direction-relative form -- `margin-inline-end`,
 * `padding-inline`, `text-align: start` -- because five locales read
 * right to left: Arabic, Hebrew, Farsi, Urdu and Western Punjabi. A physical
 * side here is a bug on all five, and it renders correctly in English, so
 * nothing catches it but a measurement. `float` is the one exception, for the
 * reason given beside the rule at the foot of the file.
 */

/* NMFG FIX */

#wrapper .top-bar__dropdown,
#wrapper .top-bar__dropdown-sub { min-width:200px; }
#wrapper .top-bar__item:nth-child(3) .top-bar__dropdown { min-width:400px; }		
#wrapper .top-bar__item:nth-child(3) .top-bar__dropdown a { float:left; width:50%; }	

#wrapper .primary-nav__dropdown { min-width:240px; }	
	
#wrapper .search-toggle { margin-inline-end:-8px; }	
#wrapper .search-toggle svg { 
width:28px; height:28px; -webkit-transform: scaleX(-1); transform: scaleX(-1); }

#wrapper .search-modal { padding:100px 20px 20px; }
#wrapper .search-modal__inner { padding:0; background:transparent;}
#wrapper .search-modal__title,
#wrapper .search-modal__close	{ display:none; }	
#wrapper .search-field__input { border:none; }	
#wrapper.search-open .primary-nav { opacity:0; } 	
	
#wrapper .home-hero { padding:20px 0 65px; }	
#wrapper .home-hero__inner { gap:32px; }	
#wrapper .hero__title { line-height:1.3; }
#wrapper .home-hero__text { 
padding-block:50px 0; padding-inline:6% 2%; font-weight:500; line-height:1.5; text-shadow: 1px 1px 2px rgba(0,0,0,.7); }
		
#main .key-topics, .whats-new { max-width:100%; }     
#main .key-topics__grid, .whats-new__grid { max-width:1342px; margin:0 auto; }
	
#main .key-topics { 
padding-top:32px; background-color:#fff; 
background-image: linear-gradient(180deg,rgba(247,250,252,0.2) 0%,rgba(247,250,252,1) 100%); }	

#main [class*="quote-slider"] .splide__slide { 
display:flex; flex-flow:column; justify-content:center; padding-block:40px; padding-inline:50px 90px; }
#main [class*="quote-slider"] .splide__arrow--prev { display:none; }	
#main [class*="quote-slider"] .splide__arrow--next { inset-inline-end:20px; }
   
#main .begin-reading { padding-top:0; padding-bottom:40px; }  
	
#main .home-section-heading { margin:0 0 32px; }	

#main .explore-library__image { background:#000; }
#main .explore-library__image img { width:110%; height:110%; margin-top:15px; }
	
#main .subscribe-section__interest-list { padding-inline-start:15px; }
		
#main .book-accordion__toggle { margin-bottom:0; }	
#main .book-accordion__icon,	
#main .book-accordion__icon svg { width:24px; height:24px; }
#main .book-accordion__icon.intro-accordion__plus { width:18px; height:18px; opacity:.6; transition:opacity .3s ease; }
#main .book-accordion__toggle:hover .book-accordion__icon.intro-accordion__plus { opacity:1; }
#main .intro-accordion__plus:before { height:4px; }
#main .intro-accordion__plus:after { width:4px; }	
#main .book-accordion__panel { margin-bottom:10px; border-radius:0 0 6px 6px; background:#fff; border:none; }		

#main .video-embed__wrapper { border-radius:6px; overflow:hidden; }	

#wrapper .scroll-top { bottom:20px; inset-inline-end:20px; }	
#wrapper .scroll-top svg { width:28px; height:28px; }	
	
/* LIBRARY START */	
#main:has(.content-area--library) { 
background-image: linear-gradient(180deg,rgba(247,250,252,0.2) 0%,rgba(247,250,252,1) 600px); }	
#main .library__intro { text-align:start; }		
#main .library__explore .book-accordion__panel { background:transparent; }		
#main .library__explore > .book-accordion__toggle.open {
background-color:transparent; color:var(--nm-gray-800); /*#1A202C*/ }	
#main .library__book-title { font:22px/1.5 Lora; padding:10px 20px; }

/* LIBRARY */	
#main .book-intro__cover img { border-radius:6px; }	
	
#main .sidebar { padding:0 0 40px; padding-inline-end:0 !important; border:0 !important; }
#main .sidebar-nav, #main .sidebar-teachings__list { max-width:340px; }	
#main .sidebar-nav__item:last-child { border-bottom:none; }	
#main .sidebar-nav a, #main .sidebar-teachings__list a { text-decoration:none; }	
#main .sidebar-nav__chapter-link { color:var(--nm-gray-700); }
#main .sidebar-nav__chapter-link:hover,	
#main .sidebar-nav__chapter-link.current { color:var(--nm-bronze); }
#main .sidebar-nav__arrow svg { width:20px; height:20px; }
	
#main .media-tabs__list { border:none; }
#main .media-tabs__tab { margin-inline-end:6px; border:1px solid var(--nm-gray-300); border-bottom:0; }
#main .media-tabs__panel { 
margin-top:-1px; border:1px solid var(--nm-gray-300); border-radius:6px; border-start-start-radius:0; }	

#wrapper .step-title__number { font-size:34px; color:#FFE9AC; } 	
	
/* RESPONSIVE */	

@media (max-width: 1200px) {

#main .book-intro__cover { float:none; width:100%; max-width:420px; margin:0 auto 30px; }		

}	
	
@media (max-width: 1024px) {
	
#wrapper .site-header-wrap {
background-image:url('/images/site/NM-Page-Header-Mountain.jpg');
background-position:50% 13%;
}		
   
#wrapper .logo { display:flex; max-width:310px; justify-content:center; }  

#wrapper .mobile-menu-toggle { margin-inline-start:-8px; }	
	
#wrapper .home-hero { padding-bottom:40px; }		
#wrapper .home-hero__text { padding-block:0; padding-inline:3% 0; font-size:18px; }
	
#wrapper .hero__title { font-size:36px; }
	
#main [class*="quote-slider"] .quote-slide__text { font-size:18px; line-height:1.5; }	

#main .whats-new__card-title { font-size:20px; }
	
#main .intro-pullquote p,
#main .topic-pullquote p,
#main .library__book-title { font-size:19px; }	

#main .content-area { grid-template-columns: 30% 1fr; gap:32px; padding:40px 0 0; }	
#main .sidebar-nav, #main .sidebar-teachings__list { max-width:100%; }			
#main .content-area.content-area--no-sidebar { grid-template-columns:1fr; }	
	
}
   
@media (max-width: 767px) {
	
#wrapper .site-header-wrap {
background-image:url('/images/site/NM-Page-Header-Mountain-Mobile.jpg');
background-position:50% 0%;
}	
	
#wrapper .search-toggle { margin-inline-end:-12px; }	
#wrapper .search-toggle svg { width:25px; height:25px; }	
	
#wrapper .home-hero { padding:0 0 40px; }		
#wrapper .home-hero__text { padding:0; font-size:17px; } 
	
#wrapper .hero__title { font-size:25px; }
	
#wrapper .step-title__number { font-size:23px; } 	
	
#main .key-topics { padding-top:22px; padding-bottom:22px; }

#main .home-section-heading { margin:0 0 22px; }

#main .whats-new__card { border-width:10px; padding:15px; }
#main .whats-new__card-title { font-size:18px; } 

#main [class*="quote-slider"] .splide__slide { padding:24px; }	
#main [class*="quote-slider"] .quote-slide__text { font-size:16px; }
	
#main .intro-pullquote p,
#main .topic-pullquote p { font-size:18px; }	
	
#main .intro-paragraphs__content p,
#main .intro-accordion .book-accordion__panel li,	
#main .intro-accordion .book-accordion__panel p { font-size:17px; }	

#main .intro-video-quote__text,	
#main .topic-video-quote__text { padding:0; }
	
#main .topic-tabs__accordion-header { font-weight:600; color:var(--nm-gray-800); }

#main .library__explore-toggle,
#main .library__volume-toggle { font-size:26px; }	
#main .library__book-grid { gap:10px; }	
#main .library__book-title { font-size:20px; padding-block:10px; padding-inline:17px 15px; }	

#main .content-area { grid-template-columns:1fr; }
	
#main .ns-further__ctas { justify-content:center; }	
	
}
   
@media (max-width: 440px) {
   
#wrapper .logo { max-width: 70%; } 
#wrapper .logo img { width:100%; height:auto; }    
 
}
    
/* RTL: ARABIC, HEBREW, FARSI, URDU, WESTERN PUNJABI */

/* Every other side in this file is stated as "the side the reader starts on",
   so the browser mirrors it. `float` is the exception: `float: inline-end`
   reached Safari only in version 26, and a browser that does not know a value
   drops the whole declaration, which would stop the two-column dropdown
   floating on older Safari in English too. So the physical value stays and is
   mirrored here, the same way styles.css and rtl.css handle the book cover and
   the audio tabs. */

:root[dir='rtl'] #wrapper .top-bar__item:nth-child(3) .top-bar__dropdown a { float:right; }
