/* ==========================================================================
   Phoenix BioLabs — Dark Mode Overrides
   All dark: prefixed Tailwind patterns from the prototype converted to
   html.dark selector overrides.
   ========================================================================== */

/* ---- Body & Page ---- */
html.dark body {
    background-color: var(--ph-bg-dark);
    color: #ffffff;
}

/* ---- Top Announcement Banner ---- */
html.dark .ph-announcement-banner {
    background: var(--ph-zinc-900);
}

/* ---- Navigation ---- */
html.dark .ph-nav {
    background: var(--ph-nav-bg);
    border-bottom-color: var(--ph-zinc-900);
}

html.dark .ph-nav__link {
    color: #ffffff;
}

/* ---- Hero Section ---- */
html.dark .ph-hero-slider {
    background: var(--ph-hero-bg-dark);
}

html.dark .ph-hero-slide__heading {
    color: #ffffff;
}

html.dark .ph-hero-slide__sub {
    color: var(--ph-zinc-200);
}

html.dark .ph-hero-slide__frame {
    background: var(--ph-zinc-900);
    border-color: var(--ph-zinc-800);
}

html.dark .ph-hero-slider__control-btn {
    background: rgba(0, 0, 0, 0.8);
    border-color: var(--ph-zinc-800);
    color: #ffffff;
}

html.dark .ph-hero-dot--inactive {
    background: var(--ph-zinc-600);
}

/* ---- Features Grid ---- */
html.dark .ph-features-grid-section {
    background: #000000;
    border-color: var(--ph-zinc-900);
}

html.dark .ph-feature-item__title {
    color: #ffffff;
}

/* ---- Product Cards ---- */
html.dark .ph-product-card {
    border-color: var(--ph-zinc-900);
    background: rgba(9, 9, 11, 0.5);
}

html.dark .ph-product-card__image-wrap {
    background: #000000;
}

html.dark .ph-product-card__name {
    color: #ffffff;
}

html.dark .ph-product-card:hover .ph-product-card__cta {
    background: #ffffff;
    color: #000000;
}

/* ---- Product Grid Section ---- */
html.dark .ph-product-grid-section {
    background: var(--ph-zinc-950);
}

/* ---- Batch Cert Section ---- */
html.dark .ph-batch-cert-section {
    background: var(--ph-zinc-950);
}

html.dark .ph-batch-cert__image-frame {
    background: var(--ph-zinc-900);
    border-color: var(--ph-zinc-800);
}

html.dark .ph-batch-cert__floating-badge {
    background: #000000;
    border-color: var(--ph-zinc-900);
}

html.dark .ph-batch-cert__heading {
    color: #ffffff;
}

/* ---- Section Headers ---- */
html.dark .ph-section-header__heading {
    color: #ffffff;
}

/* ---- FAQ ---- */
html.dark .ph-faq-section {
    background: var(--ph-zinc-950);
}

html.dark .ph-faq-group {
    background: var(--ph-charcoal);
    border-color: var(--ph-zinc-800);
}

html.dark .ph-faq-question h3 {
    color: #ffffff;
}

html.dark .ph-faq-answer p {
    color: var(--ph-zinc-400);
}

html.dark .ph-faq-search {
    background: var(--ph-charcoal);
    border-color: var(--ph-zinc-800);
    color: #ffffff;
}

/* ---- Blog Cards ---- */
html.dark .ph-blog-card {
    background: var(--ph-zinc-900);
    border-color: var(--ph-zinc-800);
}

html.dark .ph-blog-card__title {
    color: #ffffff;
}

/* ---- COA Document ---- */
html.dark .ph-coa-document__frame {
    background: var(--ph-zinc-900);
    border-color: var(--ph-zinc-800);
}

/* ---- Account / Checkout Surfaces ---- */
html.dark .ph-surface {
    background: var(--ph-charcoal);
    border-color: var(--ph-zinc-800);
}

html.dark .ph-input {
    background: var(--ph-charcoal);
    border-color: var(--ph-zinc-800);
    color: #ffffff;
}

/* ---- Footer ---- */
html.dark .ph-footer {
    background: var(--ph-footer-bg-dark);
}

/* ---- Dark Mode Toggle Button ---- */
.ph-dark-toggle__sun { display: none; }
html.dark .ph-dark-toggle__sun  { display: block; }
html.dark .ph-dark-toggle__moon { display: none; }

html.dark .ph-dark-toggle__btn {
    background: #000000;
    border-color: var(--ph-zinc-800);
}

/* Floating Toggle Specifics from Admin Panel */
.ph-dark-toggle--theme {
    /* Base reset for the floating container */
    margin: 0;
    padding: 0;
    pointer-events: none; /* Let clicks pass through the container */
}

.ph-dark-toggle--theme .ph-dark-toggle__btn {
    pointer-events: auto; /* Re-enable clicks on the button itself */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
}


/* ---- Research Disclaimer ---- */
html.dark .ph-disclaimer p {
    color: var(--ph-zinc-400);
}

/* ---- Headings color inheritance ---- */
html.dark h1,
html.dark h2,
html.dark h3,
html.dark h4,
html.dark h5,
html.dark h6 {
    color: #ffffff;
}

/* ==========================================================================
   WOOCOMMERCE MY ACCOUNT overrides (Login, Dashboard, etc.)
   ========================================================================== */

.ph-my-account {
    background: var(--ph-zinc-50);
    color: var(--ph-text);
    padding: 3rem 0 6rem 0;
    min-height: 100vh;
}
html.dark .ph-my-account {
    background: var(--ph-zinc-950);
    color: #ffffff;
}

.ph-my-account__inner {
    max-width: var(--ph-max-width, 1280px);
    margin: 0 auto;
    padding: 0 var(--ph-gutter, 1.5rem);
}

.ph-my-account__header {
    text-align: center;
    margin-bottom: 3rem;
}

.ph-my-account__title {
    font-family: var(--ph-font-display, "Cinzel", serif);
    font-size: 2.25rem;
    letter-spacing: 0.1em;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.ph-my-account__rule {
    height: 1px;
    width: 6rem;
    background: var(--ph-primary);
    margin: 0 auto 1rem auto;
}

.ph-my-account__subtitle {
    color: var(--ph-zinc-500);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}
html.dark .ph-my-account__subtitle {
    color: var(--ph-zinc-400);
}

/* Layout Grid */
.ph-my-account__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}
@media (min-width: 1024px) {
    .ph-my-account__layout {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .ph-my-account__sidebar { grid-column: span 1 / span 1; }
    .ph-my-account__content { grid-column: span 3 / span 3; }
}

/* Panels & Cards */
.ph-account-panel {
    background: #ffffff;
    border: 1px solid var(--ph-zinc-200);
    padding: 1.5rem;
}
html.dark .ph-account-panel {
    background: var(--ph-charcoal);
    border-color: var(--ph-zinc-800);
}

/* Profile Sidebar */
.ph-account-profile {
    text-align: center;
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--ph-zinc-200);
}
html.dark .ph-account-profile {
    border-bottom-color: var(--ph-zinc-800);
}
.ph-account-profile__avatar {
    width: 5rem;
    height: 5rem;
    margin: 0 auto 1rem auto;
    background: var(--ph-zinc-100);
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
}
html.dark .ph-account-profile__avatar {
    background: var(--ph-zinc-800);
}
.ph-account-profile__avatar .material-symbols-outlined {
    font-size: 2.25rem;
    color: var(--ph-primary);
}
.ph-account-profile__email {
    font-size: 0.75rem;
    color: var(--ph-zinc-500);
    word-break: break-all;
}

/* Account Navigation */
.ph-account-nav {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0;
    margin: 0;
}
.ph-account-nav__link {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    font-family: var(--ph-font-sans);
    font-size: 0.6875rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--ph-zinc-600);
    text-decoration: none;
    transition: all 0.3s ease;
}
html.dark .ph-account-nav__link { color: var(--ph-zinc-400); }

.ph-account-nav__link:hover { color: var(--ph-primary); }
html.dark .ph-account-nav__link:hover { color: var(--ph-primary); }

.ph-account-nav__link--active {
    border-left: 3px solid var(--ph-primary);
    background: rgba(197, 160, 89, 0.05);
    color: var(--ph-primary);
}
html.dark .ph-account-nav__link--active {
    color: var(--ph-primary);
}

/* Dashboard Welcome */
.ph-account-welcome { margin-bottom: 2rem; padding: 2rem; }
.ph-account-welcome__title {
    font-family: var(--ph-font-display);
    font-size: 1.5rem;
    letter-spacing: 0.1em;
    margin-bottom: 1rem;
}
.ph-account-welcome__name { color: var(--ph-primary); font-family: var(--ph-font-serif); font-style: italic; }
.ph-account-welcome__desc { font-size: 0.875rem; color: var(--ph-zinc-600); line-height: 1.6; margin-bottom: 0.5rem; }
html.dark .ph-account-welcome__desc { color: var(--ph-zinc-400); }

/* Dashboard Recent Activity */
html.dark .ph-account-activity__empty-icon {
    color: var(--ph-zinc-700);
}
html.dark .ph-account-activity__empty-text {
    color: var(--ph-zinc-400);
}
html.dark .ph-account-activity__item {
    border-bottom-color: var(--ph-zinc-800);
}
html.dark .ph-account-activity__order-date {
    color: var(--ph-zinc-400);
}
html.dark .ph-account-activity__order-status {
    background: var(--ph-zinc-800);
}

/* My Account subpages dark mode */
html.dark .ph-my-account .woocommerce-info,
html.dark .ph-my-account .woocommerce-message,
html.dark .ph-my-account .woocommerce-error {
    background: var(--ph-charcoal) !important;
    border-color: var(--ph-zinc-800) !important;
    color: var(--ph-zinc-400) !important;
}
html.dark .ph-my-account .woocommerce-info .button,
html.dark .ph-my-account .woocommerce-info .woocommerce-Button,
html.dark .ph-my-account .woocommerce-message .button,
html.dark .ph-my-account .woocommerce-message .woocommerce-Button,
html.dark .ph-my-account .woocommerce-error .button,
html.dark .ph-my-account .woocommerce-error .woocommerce-Button {
    background: #ffffff !important;
    color: #000000 !important;
}
html.dark .ph-my-account .woocommerce-info .button:hover,
html.dark .ph-my-account .woocommerce-message .button:hover,
html.dark .ph-my-account .woocommerce-error .button:hover {
    background: var(--ph-primary) !important;
    color: #ffffff !important;
}
html.dark .ph-my-account .woocommerce-orders-table th,
html.dark .ph-my-account .woocommerce-orders-table td,
html.dark .ph-my-account .account-orders-table th,
html.dark .ph-my-account .account-orders-table td {
    border-bottom-color: var(--ph-zinc-800);
}
html.dark .ph-my-account .woocommerce-orders-table th,
html.dark .ph-my-account .account-orders-table th {
    color: var(--ph-zinc-400);
}

.ph-account-welcome__logout { font-size: 0.6875rem; color: var(--ph-zinc-500); text-transform: uppercase; letter-spacing: 0.1em; }
.ph-account-welcome__link { color: var(--ph-primary); text-decoration: none; }

/* Dashboard Cards Grid */
.ph-account-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}
@media (min-width: 768px) { .ph-account-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .ph-account-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.ph-account-card {
    background: #ffffff;
    border: 1px solid var(--ph-zinc-200);
    padding: 1.5rem;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
    display: block;
}
html.dark .ph-account-card { background: var(--ph-charcoal); border-color: var(--ph-zinc-800); }

.ph-account-card:hover {
    transform: translateY(-2px);
    border-color: var(--ph-primary);
    box-shadow: 0 10px 30px -10px rgba(197, 160, 89, 0.3);
}

.ph-account-card__icon-wrap {
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
    background: rgba(197, 160, 89, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s ease;
}
.ph-account-card:hover .ph-account-card__icon-wrap { background: var(--ph-primary); }

.ph-account-card__icon { font-size: 1.5rem; color: var(--ph-primary); transition: color 0.3s ease; }
.ph-account-card:hover .ph-account-card__icon { color: #ffffff; }

.ph-account-card__title {
    font-family: var(--ph-font-display);
    font-size: 0.875rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
}
.ph-account-card__desc { font-size: 0.75rem; color: var(--ph-zinc-500); }
html.dark .ph-account-card__desc { color: var(--ph-zinc-400); }

@media (min-width: 768px) {
    .ph-account-card--wide { grid-column: span 2 / span 2; }
}
@media (min-width: 1024px) {
    .ph-account-card--wide { grid-column: span 3 / span 3; }
}

/* Authentication (Login/Register) */
.ph-account-auth-wrapper {
    background: var(--ph-zinc-50);
    color: var(--ph-text);
    padding: 6rem 0;
    min-height: 100vh;
}
html.dark .ph-account-auth-wrapper {
    background: var(--ph-zinc-950);
    color: #ffffff;
}

.ph-account-auth-wrapper__inner {
    max-width: var(--ph-max-width, 1280px);
    margin: 0 auto;
    padding: 0 var(--ph-gutter, 1.5rem);
}

.ph-account-auth {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
    max-width: 64rem;
    margin: 0 auto;
}
@media (min-width: 1024px) {
    .ph-account-auth { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.ph-account-auth__col { width: 100%; float: none; }
.ph-account-auth__panel { padding: 2rem; height: 100%; }
.ph-account-auth__title { font-family: var(--ph-font-display); font-size: 1.5rem; letter-spacing: 0.1em; text-transform: uppercase; text-align: center; margin-bottom: 1.5rem; }
.ph-account-auth__rule { height: 1px; width: 4rem; background: var(--ph-primary); margin: 0 auto 2rem auto; }

.ph-account-form { display: flex; flex-direction: column; gap: 1.5rem; }
.ph-account-form__row { margin: 0; }
.ph-account-form__label { display: block; font-size: 0.6875rem; font-family: var(--ph-font-sans); text-transform: uppercase; letter-spacing: 0.15em; font-weight: 500; margin-bottom: 0.5rem; }

/* The standard inputs for WooCommerce */
.ph-input, .woocommerce-form-login input.input-text, .woocommerce-form-register input.input-text {
    width: 100%;
    background: var(--ph-zinc-50);
    border: 1px solid var(--ph-zinc-200);
    padding: 0.75rem;
    font-size: 0.875rem;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    color: #000;
}
html.dark .ph-input,
html.dark .woocommerce-form-login input.input-text,
html.dark .woocommerce-form-register input.input-text,
html.dark .ph-account-auth-wrapper input[type="text"],
html.dark .ph-account-auth-wrapper input[type="email"],
html.dark .ph-account-auth-wrapper input[type="password"] {
    background: var(--ph-charcoal) !important;
    border-color: var(--ph-zinc-800) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
html.dark .ph-account-auth-wrapper input::placeholder {
    color: var(--ph-zinc-500) !important;
    opacity: 1;
}
.ph-input:focus, .woocommerce-form-login input.input-text:focus, .woocommerce-form-register input.input-text:focus {
    border-color: var(--ph-primary);
    outline: none;
    box-shadow: 0 0 0 1px var(--ph-primary);
}

.ph-account-form__options { display: flex; align-items: center; justify-content: space-between; }
.ph-account-form__remember { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.75rem; color: var(--ph-zinc-600); margin: 0; }
html.dark .ph-account-form__remember { color: var(--ph-zinc-400); }
.ph-account-form__lost { margin: 0; }
.ph-account-form__lost a { font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.1em; transition: color 0.3s ease; text-decoration: none; }
.ph-account-form__lost a:hover { color: var(--ph-primary); }

.ph-account-form__submit-row { margin-top: 1rem; }
.ph-account-form__btn { width: 100%; display: block; text-align: center; }

/* Ensure native WooCommerce notices don't break layout */
.woocommerce-notices-wrapper {
    max-width: var(--ph-max-width, 1280px);
    margin: 0 auto 2rem auto;
}