/*!
Theme Name: Newton Media Library
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: newton-media-library
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Newton Media Library is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

@font-face {
    font-family: "silka";
    font-style: normal;
    font-weight: 400;
    src: url("assets/fonts/silka-regular-webfont.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "silka";
    font-style: normal;
    font-weight: 700;
    src: url("assets/fonts/silka-bold-webfont.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "StyreneA";
    font-style: normal;
    font-weight: 400;
    src: url("assets/fonts/StyreneA-Regular-Web.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "StyreneA";
    font-style: normal;
    font-weight: 700;
    src: url("assets/fonts/StyreneA-Bold-Web.woff2") format("woff2");
    font-display: swap;
}

/* General */

body {
    font-family: "silka", sans-serif;
    font-weight: 400;
    --deepBlue: #0a2c40;
    --lightBlue: #2451dc;
    --sequelYellow: #F9DE4C;
    margin: 0;
    --search-filter-input-background-color: #ffffff !important;
    --search-filter-input-border-color: white !important;
    --search-filter-input-border-hover-color: var(--deepBlue) !important;
    --search-filter-input-border-focus-color: var(--deepBlue) !important;
     display: flex;
    flex-direction: column;
}

html, body {
    height: 100%;
}

main {
    padding-top: 30px;
    flex: 1 0 auto;
}
footer {
    flex-shrink: 0;
}

h1,h2 {
    font-family:'StyreneA';
}

h3{
    font-family: "silka", sans-serif;
}

a {
    text-decoration: none;
    display: inline-block;
    color: var(--deepBlue);
    transition: color 0.3s ease;
}

a:hover{
    color: #0a2c40b8;
}

p,
div {
    color: var(--deepBlue);
}
p > a {
    text-decoration: underline;
    font-weight: 700;
}

.siteLogo {
    width: 100%;
    max-width: 97px;
    height: auto;
}

/* General Blue Btn */
.btn-style{
    background-color: var(--deepBlue);
    padding: 10px 15px;
    border-radius: 6px;
    position: relative;
    color: white;
    font-size: 16px;
    letter-spacing: 0.5px;
    line-height: 1;
    border: 1px solid transparent;
    transition: all 0.3s ease;
    min-width: 150px;
    text-align: center;
}

.btn-style::after{
    content: "";
    display: inline-block;
    width: 7px;
    height: 16px;
    margin-left: 8px;
    background-image: url("/wp-content/themes/newton-media-library/assets/img/buttonArrow.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transition: transform 0.3s ease;
    position: relative;
    top: 3px;
}

.btn-style:hover{
    color: white;
    background-color: #2451DC;
    border-color: #2451DC;
    opacity: 1;
}


.btn-style.sub {
    color: #0A2C40;
    background-color: white;
}

.btn-style.sub::after {
    background-image: url('/wp-content/themes/newton-media-library/assets/img/blackARROW.svg');
}


.btn-style.sub:hover {
    background-color: #2451DC;
    color: white;
}
.btn-style.sub:hover::after {
    background-image: url('/wp-content/themes/newton-media-library/assets/img/buttonArrow.svg');
}
/* Search */

.search-filter-input-text .search-filter-input-text__clear-button{
    display: none;
}

.search-filter-input-text{
    border: 0;
}

/* Header */
header {
    background: linear-gradient(336.1deg, #f0f6ff 13.65%, #f8fdff 82.96%);
    min-height: 57px;
}

header .header-logo img {
    width: 100%;
    max-width: 241px;
}


header .menuWrap ul#menu-main {
    margin: unset;
}

header .sub-menu {
    display: none;
}

header .menuWrap ul#menu-main {
    list-style: none;
}

/* Homepage */
section.home-hero {
    margin-bottom: 20px;
}
section.home-hero h1 {
    font-size: 36px;
    line-height: 1.2;
    font-weight: 400;
    margin-bottom: 20px;
    margin-top: 30px;
}

.hero-content p {
    line-height: 1.4;
}

    .info-banner {
        margin-bottom:52px;
    }
    .info-banner  .banner-content-wrapper {
        background: linear-gradient(90deg, #0D0D21 0%, #0A2C40 100%);
        color: #ffffff;
        padding: 30px 60px;
        border-top-right-radius: 12px;
        box-shadow: 6px 6px 30px 0px #0A2C404D;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 40px;
    }
    .info-banner .banner-text {
        max-width: 60%;
    }
    
    .banner-text h1 {
        font-size: 30px;
        font-weight: 700;
        line-height: 1.2;
        margin-bottom: 5px;
        color: white;
        text-transform: uppercase;
    }
    .banner-text h2 {
        font-size: 18px;
        font-weight: 400;
        line-height: 1.4;
        color: white;
        margin-bottom: 20px;
    }
    .banner-text p {
        font-size: 14px;
        line-height: 1.5;
        margin-bottom: 10px;
        color: white;
    }

    .banner-text p:last-child {
        margin-bottom: 15px;
    }

/* Logo Styling */
.banner-logos {
    display: flex;
    align-items: center;
}

.banner-logos img {
    max-width: 300px;
    height: auto;
}

img.banner-img {
    width: 100%;
    max-width: 203px;
    height: auto;
}


/* Search & Filter */
header .search-filter-input-text {
    display: flex;
    flex-direction: row-reverse;
}
/* Footer */

footer {
    background: linear-gradient(336.1deg, #f0f6ff 13.65%, #f8fdff 82.96%);
    padding-top: 57px;
    padding-bottom: 30px;
    margin-top: 60px;
}

footer p {
    margin: unset;
}

.footer-top-row {
    margin-bottom: 50px;
}
.footer-legal a {
    text-decoration: underline;
}

header {
    position: relative;
}

li.internal {
    display: none;
}

.logged-in li.internal::before {
        background-image: url('/wp-content/uploads/2025/11/Layer_1-4.svg');
}
.logged-in li.internal {
    display: block;
}
.logged-in li.internal a {
    font-weight: 600;
    color: var(--lightBlue);
}

a.profile-link {
    display: flex;
    align-items: center;
    gap: 8px;
}

a.profile-link .logInText,
a.profile-link .logOutText
{
    white-space: nowrap;
}

img.user-avatar {
    width: 20px;
    border-radius: 15px;
}
.userStatus {
    display: flex;
    align-items: center;
    gap: 20px;
}
@media (min-width: 1400px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        max-width: 1250px;
    }
}

@media (min-width: 991px) {
    header .menuWrap ul#menu-main {
        display: flex;
        gap: 60px;
        margin: unset;
    }

    header .menuWrap ul#menu-main a:hover {
        color: var(--lightBlue);
    }

header .menuWrap ul#menu-main > li.menu-item-has-children > .sub-menu {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        display: flex;
        justify-content: flex-start;
        gap: 80px;
        padding-top: 27px;
        padding-bottom: 60px;
        padding-left: max(15px, calc((100% - 1250px) / 2 + 15px));
        padding-right: max(15px, calc((100% - 1250px) / 2 + 15px));
        background: linear-gradient(336.1deg, #f0f6ff 13.65%, #f8fdff 82.96%);
        border-radius: 0 0 8px 8px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
                visibility: hidden;
        opacity: 0;
        transition: opacity 0.3s ease, visibility 0.3s ease; /* Removed transform transition */
        box-sizing: border-box;
        pointer-events: none; /* Prevents accidental clicks when hidden */
    }

        header .menuWrap ul#menu-main > li.menu-item-has-children > .sub-menu::before {
        content: "";
        position: absolute;
        top: -30px;
        left: 0;
        width: 100%;
        height: 30px;
        background: transparent;
        z-index: 1;
    }

   header .menuWrap ul#menu-main > li.menu-item-has-children > .sub-menu li {
        margin-bottom: 20px;
        transform: translateY(10px);
        transition: transform 0.3s ease;
     }

       header .menuWrap ul#menu-main > li.menu-item-has-children > .sub-menu li:last-child {
        margin-bottom: unset;
       }

        header .menuWrap ul#menu-main > li.menu-item-has-children:hover > .sub-menu {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
        }

        header .menuWrap ul#menu-main > li.menu-item-has-children:hover > .sub-menu li {
            transform: translateY(0);
        }
        

    header .menuWrap ul#menu-main > li > .sub-menu > li {
        list-style-type: none;
        max-width: 250px;
        padding: 0;
    }

    header .menuWrap ul#menu-main > li > .sub-menu > li > a {
        color: var(--lightBlue);
        font-weight: 700;
        text-transform: uppercase;
        font-size: 16px;
        margin-bottom: 20px;
        display: block;
    }

    header .menuWrap ul#menu-main > li > .sub-menu > li > .sub-menu {
        display: block !important;
        position: static;
        padding: 0;
        list-style: none;
        opacity: 1;
        visibility: visible;
        background: none;
        box-shadow: none;
        transform: none;
    }

    header .menuWrap ul#menu-main > li > .sub-menu > li > .sub-menu a {
        font-size: 16px;
        font-weight: 400;
        color: var(--deepBlue);
        display: block;
        transition: color 0.2s ease;
        margin-bottom: 20px;
    }

    header .menuWrap ul#menu-main > li > .sub-menu > li > .sub-menu a:last-child {
        margin-bottom: unset;
    }

    header .menuWrap ul#menu-main > li > .sub-menu > li > .sub-menu a:hover {
        color: var(--lightBlue);
        font-weight: 400;
    }
}

@media (max-width: 990px) {

    main {
    padding-top: unset;
    }

    .noBr br {
        display: none;
    }

    .info-banner .banner-text {
        max-width: 100%;
    }
    header {
        padding: 40px 10px;
        background: unset;
    }
    body.mobile-menu-is-open {
        overflow: hidden;
    }
    .btn-style {
        white-space: nowrap;
    }

    .mobile-menu-trigger,
    .mobile-menu-close {
        cursor: pointer;
    }

    .mobile-menu-overlay {
        position: fixed;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        background-color: #ffffff;
        z-index: 1000;
        transform: translateX(100%);
        transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        overflow: hidden;
    }

	.mobile-menu-overlay * {
		font-family: 'StyreneA';
	}

    body.mobile-menu-is-open .mobile-menu-overlay {
        transform: translateX(0);
    }

.mobile-menu-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding: 40px;
}

    .mobile-menu-overlay #menu-main {
        list-style: none;
        padding: 0 40px;
        margin: 0;
    }

.mobile-menu-overlay #menu-main > li > a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: clamp(18px, 7vw, 27px);
    font-weight: 400;
	padding: 40px 0;
	border-bottom: 1px solid #C9CED1;
}
    .mobile-menu-overlay #menu-main > li:last-child > a {
        border-bottom: none;
    }

    /* Sliding Panel Styling */
    .mobile-menu-overlay .sub-menu {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #ffffff;
        padding: 40px;
        box-sizing: border-box;
        overflow-y: auto;
        list-style: none;
        margin: 0;
        transform: translateX(100%);
        transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        z-index: 10;
    }


    .mobile-menu-overlay .sub-menu.is-active {
        transform: translateX(0);
    }

    /* Styles for the dynamically added content inside panels */
    .mobile-panel-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 30px;
    }
    .menu-back-btn,
    .mobile-panel-close {
        cursor: pointer;
    }
    .mobile-panel-title {
        font-size: 27px;
        font-weight: 500;
        color: var(--deepBlue);
        margin-bottom: 30px;
    }

    /* A sub-menu INSIDE an active panel should just be a static list */
    .sub-menu .sub-menu {
        position: static;
        transform: none;
        padding: 0;
        margin-top: 30px;
		margin-bottom: 90px;
        height: auto;
        overflow-y: visible;
    }

	.sub-menu .sub-menu li {
    position: relative;
}

	.sub-menu .sub-menu li::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #C9CED1;
    width: calc(100% + 80px);
    height: 1px;
    margin-left: -40px;
}

.sub-menu > .menu-item-has-children > a {
    color: var(--lightBlue);
    font-weight: 400;
    text-transform: uppercase;
    font-size: 20px;
    pointer-events: none;
}

    .sub-menu .sub-menu > li > a {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 28px 0;
        font-size: 20px;
        border-bottom: 1px solid #eee;
    }
    .sub-menu .sub-menu > li:last-child > a {
        border-bottom: none;
    }

    .mobile-menu-overlay a::after {
        content: none;
    } /* Reset all arrows first */

    /* ONLY show arrows on the specific links we want */
.mobile-menu-overlay #menu-main > .menu-item-has-children > a::after, .mobile-menu-overlay .sub-menu .sub-menu > li > a::after {
    content: "";
    width: clamp(18px, 7vw, 30px);
    height: clamp(18px, 7vw, 30px);
    display: inline-block;
    background-image: url("/wp-content/themes/newton-media-library/assets/img/menu-mobile-arrow.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-left: auto;
}

section.home-hero {
    margin-bottom: 40px;
}
section.home-hero h1 {
    font-size: 40px;
}

.hero-content p {
    font-size: 22px;
    line-height: 1.4;
}
.banner-text {
    display: flex;
    flex-direction: column;
    align-items: start;
}
.banner-text * {
    text-align: left;
}
.info-banner .banner-content-wrapper {
    border-radius: 12px;
    padding: 20px;
    padding-bottom: 40px;
}

.banner-text h1 {
    font-size: 25px;
}

.banner-text h2 {
    font-size: 16px;
    margin-bottom: 15px;
}
    .banner-content-wrapper {
        flex-direction: column;
        text-align: center;
    }
    footer {
        margin-top: 70px;
    }
    .banner-logos {
        margin-top: 20px;
    }
    .footer-logo {
        margin-bottom: 30px;
    }
    .footer-buttons {
        margin-bottom: 30px;
    }
    .footer-top-row {
        margin-bottom: 40px;
    }
}




/* --- Brand Assets Section --- */

section.brand-assets-section {
    margin-bottom: 60px;
}

.brand-cards-wrapper {
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
    column-gap: 20px;
    row-gap: 60px;
}

.brand-card-item {
    position: relative;
    flex: 1 1 340px;
    max-width: 400px;
    padding: 30px;
    border: 1px solid;
    border-radius: 14px;
    display: flex;
    align-items: flex-start;
    min-height: 195px;

}



.company-logo {
    width: 166px;
    height: 57px;
    object-fit: contain;
    object-position: left center;
    margin-bottom: 20px;
    display: block;
}

.card-side-image {
    position: absolute;
    bottom: 0;
    right: -1px;
    height: 120%;
    width: auto;
    pointer-events: none;
    border-radius: 10px;
}


/* --- Mobile Responsiveness --- */
@media (max-width: 1200px) {
    .brand-cards-wrapper {
        justify-content: flex-start; /* Align to start on tablets */
    }
}


@media (max-width: 768px) {
    .brand-cards-wrapper {
        flex-direction: column;
        align-items: center; /* Center cards in a single column */
    }
    .brand-card-item {
        width: 100%;
        max-width: calc(100% );
        flex-basis: auto;
    }
}

@media (max-width: 480px) {
    .brand-card-item {
        height: 160px;
        padding: 20px;
    }

    .card-side-image {
        height: 100%;
    }


    .brand-card-item .btn-style {
    font-size: 14px;
    padding: 10px;
}

}



.top-assets-section .top-wrapper {
    padding: 0 40px;
    padding-top: 30px;
    padding-bottom: 70px;
    border: 1px solid #A9B2B6;
    border-radius: 12px;
}

.top-assets-section .section-title {
    font-size: 30px;
    font-weight: 700;
    margin: 0 0 30px 0;
}

/* Grid Container for the three columns */
.assets-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px; /* Space between columns */
}

.assets-column .column-title {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    margin: 0 0 20px 0;
}

/* Specific colors for the first two column titles */
.column-title.neurolens-title {
    color: var(--lightBlue);
}
.column-title.sequel-title {
    color: var(--sequelYellow);
}
.column-title.videos-title {
    color: var(--deepBlue);
}

/* Styling for the asset lists */
.assets-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Each list item gets a bottom border */
.assets-list li {
    border-bottom: 1px solid #e9ecef;
}
.assets-list li:last-child {
    border-bottom: none; /* Remove border from the last item */
}
.assets-list li a span:not(.cpt-tag),
.child-category-list li a {
    transition: color 0.3s ease;
}
.assets-list li a:hover span:not(.cpt-tag),
.child-category-list li a:hover
{
    color: var(--lightBlue);
}

.assets-list li a:hover svg path,
.child-category-list li a svg path
{
    fill: #2451DC;
}




/* Common styles for all asset links */
.asset-link,
.asset-link-with-tag {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0;
    text-decoration: none;
    color: #212529;
    transition: color 0.2s ease-in-out;
}


li:first-child .asset-link,
li:first-child .asset-link-with-tag {
    padding-top: unset;
} 

/* Asset title text */
.asset-title {
    font-size: 1rem;
    font-weight: 500;
}

/* Wrapper for tag + arrow in the videos column */
.tag-and-arrow-wrapper {
    display: flex;
    align-items: center;
    gap: 15px; /* Space between the tag and the arrow */
    flex-shrink: 0; /* Prevents the wrapper from shrinking if the title is long */
}

/* General styling for the CPT tag */
.cpt-tag {
    display: inline-block;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 500;
    border-radius: 5px;
    text-transform: uppercase;
}

/* Specific colors for each CPT tag */
.cpt-tag.cpt-tag-neurolens {
    background-color: var(--lightBlue);
    color: #ffffff;
}

.cpt-tag.cpt-tag-sequel {
    background-color: #FFDE05;
    color: var(--deepBlue);
}

.arrow-icon {
    width: 15px;
    height: 12px;
}


@media (max-width: 992px) {
    .assets-grid {
        grid-template-columns: 1fr; /* Stack columns vertically */
        gap: 40px; /* Becomes space between the stacked column sections */
    }

    .top-assets-section {
        padding: unset;
    }

    .top-assets-section .top-wrapper {
    padding: 30px 25px;
}
}

/* For mobile phones */
@media (max-width: 576px) {
    .top-assets-section {
        padding: unset;
    }

    .top-assets-section .section-title {
        font-size: 25px;
    }
    
    .asset-link-with-tag {
        /* On very small screens, let the tag wrap if needed */
        flex-wrap: wrap;
    }

    .tag-and-arrow-wrapper {
        margin-left: 10px; /* Add some space if it wraps */
    }
}

/* Archive */


section.archive-banner {
    margin-bottom: 65px;
}

section.archive-banner img {
    width: 100%;
}

.parent-category-title {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--lightBlue);
}

ul.child-category-list {
    list-style: none;
    padding: inherit;
}

ul.child-category-list li {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #A9B2B6;
}
ul.child-category-list li:last-child {
    border-bottom: unset;
}

.category-column {
    width: 30%;
    margin-bottom: 30px;
}

.category-column img
 {
    width: 100%;
    border-top-right-radius: 20px;
}

.category-column .column-image-wrapper a {
    display: inline-block;
    width: 100%;
}


/* Show the mobile image */
.mobile-banner-image {
    display: none; 
}


@media (max-width: 990px) {

    .category-column {
        width: 100%;
    }
    section.archive-banner {
    margin-bottom: 30px;
}

.column-image-wrapper a {
width: 100%;
}

.column-image-wrapper a img {
width: 100%;
}

    .desktop-banner-image {
        display: none; 
    }

    .mobile-banner-image {
        display: block;
    }
}
 

/*
--- Modern Search Results Page ---
*/

/* 1. Page Header */
.search-header {
    padding-top: 30px;
    margin-bottom: 70px;
}

.search-title {
    font-size: clamp(20px, 5vw, 36px);
    font-weight: 700;
    color: var(--deepBlue);
    margin: 0;
}

.search-term {
    color: #0d6efd; /* A nice, modern blue */
}

.search-results-grid {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
}

/* 3. The Search Result Card */
.search-result-card {
    display: block;
    background-color: #ffffff;
    border-bottom: 1px solid #A9B2B6;
    padding-bottom: 20px;
    text-decoration: none;
    color: var(--deepBlue);
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

/* 4. Card Content Styling */
.card-meta .post-type-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.search-result-card.neurolens .card-meta .post-type-badge {
    background-color: var(--lightBlue);
    color: white;
}

.search-result-card.sequel .card-meta .post-type-badge {
    background-color: var(--sequelYellow);
    color: black;
}
.card-title {
    font-size: 16px;
    font-weight: 400;
    color: var(--deepBlue);
    margin: unset;
}
.search-result-card .head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
}

.search-result-card .head .head-end {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    column-gap: 24px;
}


.card-excerpt {
    font-size: 1rem;
    line-height: 1.6;
    color: #6c757d;
}

/* 5. No Results Styling */
.no-results-container {
    text-align: center;
    padding: 80px 40px;
    background-color: #f8f9fa;
    border-radius: 8px;
}

.no-results-container h2 {
    margin-bottom: 15px;
}

.no-results-container .search-form {
    margin-top: 30px;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

/* 6. Pagination Styling */
.pagination {
    margin-top: 50px;
}
.nav-links {
    display: flex;
    justify-content: center;
    gap: 10px;
}
.nav-links .page-numbers {
    padding: 10px 15px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    text-decoration: none;
    color: #0d6efd;
}
.nav-links .page-numbers.current,
.nav-links .page-numbers:hover {
    background-color: #0d6efd;
    color: #ffffff;
    border-color: #0d6efd;
}


/* General Pop */

/* --- Overlay & Positioning --- */
.newton-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #FFFFFFB2;    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.newton-popup-overlay.is-visible {
    opacity: 1;
    visibility: visible;
}

/* --- The Modal Card --- */
.newton-popup-container {
    background: #fff;
    width: 100%;
    max-width: 1240px;
    padding: 40px;
    border-radius: 12px;
    border: 1px solid var(--deepBlue);
    box-shadow: 0 20px 50px rgba(0,0,0,0.1);
    position: relative;
    margin: 20px;
    transform: translateY(20px);
    transition: transform 0.3s ease;
}

.newton-popup-overlay.is-visible .newton-popup-container {
    transform: translateY(0);
}

/* --- Close Button --- */
.close-btn {
    position: absolute;
    top: 20px;
    right: 20px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: #333;
    transition: transform 0.2s;
}

.close-btn:hover {
    transform: scale(1.1);
    color: #000;
}

.newton-popup-header {
    margin-bottom: 50px;
    text-align: left;
}

.popup-title {
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
    color: var(--deepBlue);
    margin: 0 0 20px 0;
}

.popup-subtitle {
    font-size: 17px;
    line-height: 1;
    color: var(--deepBlue);
    margin: 0;
}

/* --- Form Grid Layout (The Sharpness) --- */
.newton-popup-form .form-columns {
    display: grid;
    grid-template-columns: 1fr 1fr; /* Two equal columns */
    gap: 30px;
    margin-bottom: 20px;
}

.newton-popup-form .col-left {
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Distributes inputs evenly */
    gap: 20px; 
}

.newton-popup-form .col-right {
    display: flex;
    flex-direction: column;
}

/* Ensure textarea fills height to match inputs */
.newton-popup-form .text-area-wrapper {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.newton-popup-form textarea {
    height: 100%; /* Fills the right column height */
    min-height: 150px;
    resize: none;
}

/* --- Input Styling (Clean & Sharp) --- */
.newton-popup-form input[type="text"],
.newton-popup-form input[type="email"],
.newton-popup-form input[type="tel"],
.newton-popup-form textarea {
    width: 100%;
    padding: 15px 0;
    background: transparent;
    border: none;
    border-bottom: 2px solid #e0e0e0; /* Underline style */
    border-radius: 0;
    font-size: 16px;
    color: #333;
    outline: none;
    transition: border-color 0.3s;
}

.newton-popup-form label {
    font-size: 12px;
    color: #999;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 5px;
    display: block;
}

.newton-popup-form input:focus,
.newton-popup-form textarea:focus {
    border-bottom-color: #2c3e50; /* Dark color on focus */
}

/* --- Submit Button --- */
.form-footer {
    text-align: right; /* Aligns button to right */
    margin-top: 10px;
}

.newton-popup-form input[type="submit"] {
    background-color: #1a2b49; /* Dark Blue */
    color: #fff;
    border: none;
    padding: 12px 40px;
    border-radius: 50px; /* Pill shape */
    cursor: pointer;
    font-weight: 600;
    font-size: 16px;
    transition: background 0.3s;
    width: auto; /* Overrides the 100% width from general input rule */
}

.newton-popup-form input[type="submit"]:hover {
    background-color: #2c3e50;
}

.trigger-popup {
    cursor: pointer;
    /* Optional: Transition for hover effect */
    transition: opacity 0.3s;
}

.trigger-popup:hover {
    opacity: 0.8;
}

/* --- Responsive (Mobile) --- */
@media screen and (max-width: 768px) {
    .newton-popup-container {
        padding: 30px 20px;
        width: 90%;
        max-height: 90vh;
        overflow-y: auto; /* Allow scroll inside modal on small screens */
    }

    .newton-popup-form .form-columns {
        grid-template-columns: 1fr; /* Stack vertically */
        gap: 20px;
    }
    
    .newton-popup-form textarea {
        height: 150px; /* Fixed height for mobile */
    }
    
    .form-footer {
        text-align: center; /* Center button on mobile */
    }
    
    .newton-popup-form input[type="submit"] {
        width: 100%;
    }
}

/* --- Pro Search Bar Styling --- */

/* Wrapper for the form */
.pro-header-search {
    width: 100%;
    max-width: 300px; /* Adjust width as needed */
    margin-left: 20px; /* Space between Login info and Search */
}

/* Container creating the visual border/background */
.pro-search-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    background-color: white;
    border-radius: 6px;
    padding: 0;
    transition: all 0.3s ease;
}

/* Focus State: Darker border when user types */
.pro-search-wrapper:focus-within {
    border-color: #A0A0A0;
    background-color: #fff;
}

.pro-search-wrapper::after {
    content: '';
    background-image: url('/wp-content/themes/newton-media-library/assets/img/search.png');
    background-position: center center;
    background-size: contain;
    position: absolute;
    width: 19px;
    height: 19px;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
}

/* The Submit Button (Hidden background, acts as the icon container) */
.pro-search-submit {
    background: none;
    border: none;
    padding: 8px 0 8px 12px; /* Position the icon */
    cursor: pointer;
    display: flex;
    align-items: center;
    color: #888;
}



.pro-search-wrapper:focus-within .pro-search-icon {
    color: #333; /* Darker icon on focus */
}

.pro-search-input {
    border: none !important;
    background: transparent !important;
    outline: none !important;
    box-shadow: none !important;
    width: 100%;
    padding: 7px 8px;
    color: #333;
    font-size: 15px;
}

/* Placeholder Color */
.pro-search-input::placeholder {
    color: #999;
    opacity: 1;
}