/* Jannah's own header, footer and widgets (used by the blog and any normal page).
   Structure and options stay Jannah's; this file only maps colours, type and controls to the Felowin tokens.
   The two marketing pages do not use these (they have their own header/footer: marketing-chrome.css). */

body.fw-site{background:var(--paper);color:var(--ink);font-family:var(--font-body);line-height:1.9;-webkit-font-smoothing:antialiased}
body.fw-site .background-overlay,
body.fw-site #tie-container,
body.fw-site #tie-wrapper{background:transparent}
body.fw-site ::selection{background:var(--ink);color:var(--paper)}
body.fw-site a{transition:color var(--dur-2) var(--ease-out)}

/* header: tokens only */
body.fw-site #theme-header,
body.fw-site #theme-header .main-nav-wrapper,
body.fw-site #theme-header #main-nav,
body.fw-site #theme-header .main-nav{background-color:var(--surface)!important;border-color:var(--line)!important;box-shadow:none}
body.fw-site #theme-header #main-nav .main-menu > ul > li > a,
body.fw-site #theme-header #main-nav .main-menu .menu > li > a{font-family:var(--font-body);font-weight:600;color:var(--muted)!important;background:transparent!important}
body.fw-site #theme-header #main-nav .main-menu .menu > li:hover > a,
body.fw-site #theme-header #main-nav .main-menu .menu > li.current-menu-item > a,
body.fw-site #theme-header #main-nav .main-menu .menu > li.current-menu-ancestor > a{color:var(--ink)!important}
body.fw-site #theme-header .components > li > a{color:var(--muted)!important}
body.fw-site #theme-header .components > li > a:hover{color:var(--ink)!important}
body.fw-site #theme-header #main-nav .menu-sub-content,
body.fw-site #theme-header #main-nav .sub-menu{background:var(--surface)!important;border:1px solid var(--line)!important;box-shadow:var(--shadow-float)}
body.fw-site #theme-header #main-nav .sub-menu a{color:var(--muted)!important}
body.fw-site #theme-header #main-nav .sub-menu a:hover{color:var(--ink)!important;background:var(--sunken)!important}
body.fw-site #theme-header .logo-text{color:var(--ink)}
body.fw-site .mobile-menu-icon .nav-icon,
body.fw-site .mobile-menu-icon .nav-icon::before,
body.fw-site .mobile-menu-icon .nav-icon::after{background-color:var(--ink)}
body.fw-site #slide-sidebar-widgets,
body.fw-site .side-aside{background:var(--surface)!important;color:var(--ink)}
body.fw-site .side-aside a{color:var(--ink)}


/* footer: tokens only */
body.fw-site #footer,
body.fw-site .site-footer{background:var(--sunken)!important;color:var(--ink)}
body.fw-site #footer .widget-title,
body.fw-site #footer .widget-title .the-subtitle{color:var(--ink);font-weight:800}
body.fw-site #footer a{color:var(--ink)}
body.fw-site #footer a:hover{color:var(--muted)}
body.fw-site #footer .widget,body.fw-site #footer .textwidget,body.fw-site #footer .widget li{color:var(--muted);border-color:var(--line)}
body.fw-site #site-info,body.fw-site .site-info{background:var(--surface)!important;color:var(--muted);border-top:1px solid var(--line)}
body.fw-site #site-info a{color:var(--muted)}

/* forms and buttons used by Jannah (search, comments, widgets) */
body.fw-site input[type="text"],body.fw-site input[type="email"],body.fw-site input[type="url"],body.fw-site input[type="search"],body.fw-site input[type="tel"],body.fw-site input[type="password"],body.fw-site textarea,body.fw-site select{
	background:var(--surface);color:var(--ink);border:1.5px solid var(--line-strong);border-radius:16px;font:500 15px var(--font-body);transition:border-color var(--dur-2),box-shadow var(--dur-2)}
body.fw-site input[type="text"],body.fw-site input[type="email"],body.fw-site input[type="url"],body.fw-site input[type="search"],body.fw-site input[type="tel"],body.fw-site input[type="password"],body.fw-site select{height:var(--input-h);padding-inline:16px}
body.fw-site textarea{padding:14px 16px;line-height:1.9}
body.fw-site input:focus,body.fw-site textarea:focus,body.fw-site select:focus{outline:0;border-color:var(--ink);box-shadow:0 0 0 4px var(--sunken)}
body.fw-site ::placeholder{color:var(--muted);opacity:.8}
body.fw-site:not(.fw-marketing) .button,body.fw-site:not(.fw-marketing) a.button,body.fw-site:not(.fw-marketing) button[type="submit"],body.fw-site:not(.fw-marketing) input[type="submit"],body.fw-site:not(.fw-marketing) .more-link{
	display:inline-flex;align-items:center;justify-content:center;gap:10px;height:var(--btn-h);padding-inline:26px;border-radius:var(--r-pill);border:1.5px solid transparent;
	background:var(--ink);color:var(--paper);font:700 16px/1 var(--font-body);text-decoration:none;cursor:pointer;transition:transform .25s var(--ease-pop)}
body.fw-site:not(.fw-marketing) .button:hover,body.fw-site:not(.fw-marketing) a.button:hover,body.fw-site:not(.fw-marketing) button[type="submit"]:hover,body.fw-site:not(.fw-marketing) input[type="submit"]:hover,body.fw-site:not(.fw-marketing) .more-link:hover{background:var(--ink);color:var(--paper);transform:translateY(-2px)}


/* Vazirmatn for every heading and title Jannah prints (its Typography options inject other fonts) */
body.fw-site h1,body.fw-site h2,body.fw-site h3,body.fw-site h4,body.fw-site h5,body.fw-site h6,
body.fw-site .entry-title,body.fw-site .post-title,body.fw-site .post-title a,
body.fw-site .the-global-title,body.fw-site .widget-title,body.fw-site .widget-title .the-subtitle,
body.fw-site .mag-box-title,body.fw-site .page-title,body.fw-site .archive-title,
body.fw-site .comment-reply-title,body.fw-site .block-head-1 .the-global-title,
body.fw-site .entry-content h1,body.fw-site .entry-content h2,body.fw-site .entry-content h3,
body.fw-site .entry-content h4,body.fw-site .entry-content h5,body.fw-site .entry-content h6{font-family:'Vazirmatn',Tahoma,system-ui,sans-serif!important}

/* Jannah paints the menu bar with a gradient image: replace it with the plain surface */
body.fw-site #theme-header #main-nav,
body.fw-site #theme-header .main-nav,
body.fw-site #theme-header .main-nav-wrapper,
body.fw-site #theme-header .main-menu-wrapper{background:var(--surface)!important;background-image:none!important}
/* header search: the <li> stays transparent, the form is the pill */
body.fw-site #theme-header li.search-bar{background:transparent!important}
body.fw-site #theme-header #search{background:var(--sunken)!important;border:1px solid var(--line);border-radius:var(--r-pill)}
body.fw-site #theme-header #search-input,body.fw-site #theme-header #search-input:focus{background:transparent!important;color:var(--ink)!important;border:0;box-shadow:none;height:44px;padding-inline:18px}
body.fw-site #theme-header #search ::placeholder,body.fw-site #theme-header #search-input::placeholder{color:var(--muted)}
body.fw-site #theme-header #search-submit,body.fw-site #theme-header #search .tie-icon-search{color:var(--muted)!important;background:transparent!important}
