/* Line 17170 (gp-public-pages-part-1-r1, ai.features.gp_public_1): part 1 of 3 of the NetShow new style, the Google path in
   light and dark, on the public pages / .. /dashboard/business-builder. Linked last, after css/ns-tokens.css, only while the
   key is on:
   - layouts.app pages through the line 16198 drop-ins config/google_path_layouts.d/gp-public-1*.php, under
     <body data-ns-gp-layout data-ns-gp-public-1>: css/pages/google-path-shared-layouts.css dresses the shell (ground, header,
     footer, focus); this sheet adds what the public pages carry inside #main-content (section A). Light and dark follow
     the app's own theme switch (data-bs-theme), as every layouts.app page does;
   - pages that print another document through App\Http\Middleware\GpPublic1Dress, under
     <body class="ns-gp ns-gp-public-1" data-ns-gp-public-1>: light, dark under prefers-color-scheme: dark (section B).
   Every value is a --ns-* token from css/ns-tokens.css. No raw colour.
   Rules R1-R13 (docs/design/POLISH-TOKENS.md): 4 px grid, the 12/14/16/20/24/32/48 type scale, colour from tokens only,
   44 px targets, three elevations readable in light and dark, one filled button per screen, reduced motion honoured. */

/* ---------- A. layouts.app public pages ---------- */

/* A1. The pages' own colour sets read the tokens, so no page brings a second look. */
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content {
    --ns-bg-primary: var(--ns-bg);
    --ns-bg-secondary: var(--ns-bg-deep);
    --ns-bg-surface: var(--ns-surface);
    --ns-bg-elevated: var(--ns-elevated);
    --ns-text-primary: var(--ns-text);
    --ns-text-secondary: var(--ns-text-2);
    --ns-text-muted: var(--ns-text-2);
    --ns-border-subtle: var(--ns-border);
    --ns-accent: var(--ns-gold);
    --bs-body-bg: var(--ns-bg);
    --bs-body-color: var(--ns-text);
    --bs-secondary-color: var(--ns-text-2);
    --bs-border-color: var(--ns-border-strong);
    --bs-heading-color: var(--ns-text);
    --bs-link-color: var(--ns-gold-light);
    --bs-link-color-rgb: var(--ns-gold-light);
    --bs-link-hover-color: var(--ns-text);
    background: var(--ns-bg);
    color: var(--ns-text);
}

body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.container, .container-fluid, .ns-gp-ag) { background: transparent; }

/* A2. One type scale (R2): 24 px page title, 20 px section, 16 px body; 32 px title from 768 px up. */
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(h1, .h1) { font-size: 24px; line-height: 32px; font-weight: 500; color: var(--ns-text); }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(h2, .h2) { font-size: 20px; line-height: 28px; font-weight: 500; color: var(--ns-text); }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(h3, .h3, h4, .h4) { font-size: 16px; line-height: 24px; font-weight: 600; color: var(--ns-text); }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(h5, .h5, h6, .h6) { font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ns-text); }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(p, li, label, td, th, dd, dt) { color: inherit; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.text-muted, .text-secondary, .text-white-50, .lead + p) { color: var(--ns-text-2) !important; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.text-white, .text-light) { color: var(--ns-text) !important; }
@media (min-width: 768px) {
    body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(h1, .h1) { font-size: 32px; line-height: 40px; }
}

/* A3. Surfaces on elevation 1 with a hairline, readable in both schemes (R6). */
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.card, .bg-dark, .bg-black, .ns-contact-card, .modal-content, .list-group-item, .accordion-item, .dropdown-menu) {
    background-color: var(--ns-card) !important;
    color: var(--ns-text);
    border: 1px solid var(--ns-border) !important;
    border-radius: var(--ns-radius);
    box-shadow: 0 1px 2px var(--ns-border);
}
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.bg-secondary, .bg-body-tertiary, .bg-light, .ns-contact-icon) {
    background-color: var(--ns-surface) !important;
    color: var(--ns-text);
}
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.border, .border-top, .border-bottom, hr) { border-color: var(--ns-border) !important; }

/* A4. Badges and chips: quiet surfaces with token ink (R3). */
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content .badge {
    background-color: var(--ns-surface) !important;
    color: var(--ns-text-2) !important;
    border: 1px solid var(--ns-border) !important;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    padding: 4px 8px;
}

/* A5. One filled step (R9): the primary button is gold on the tokens; every other button is an outline on the page. */
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.btn, button, [type="submit"], .form-control, .form-select) { min-height: 44px; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 22px; font-weight: 500; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.btn-primary, .btn-warning) {
    background: var(--ns-gold) !important;
    border-color: var(--ns-gold) !important;
    color: var(--ns-on-accent) !important;
}
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.btn-primary, .btn-warning):hover { background: var(--ns-gold-deep) !important; border-color: var(--ns-gold-deep) !important; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.btn-secondary, .btn-dark, .btn-light, [class*="btn-outline-"]) {
    background: transparent !important;
    border: 1px solid var(--ns-border-strong) !important;
    color: var(--ns-text) !important;
}
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.btn-secondary, .btn-dark, .btn-light, [class*="btn-outline-"]):hover { background: var(--ns-surface) !important; }

/* A6. Forms on the tokens. */
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.form-control, .form-select, input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]), textarea, select) {
    background-color: var(--ns-bg) !important;
    color: var(--ns-text) !important;
    border: 1px solid var(--ns-border-strong) !important;
    border-radius: 8px;
}
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.form-control, textarea)::placeholder { color: var(--ns-text-2); opacity: 1; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.form-label, label) { color: var(--ns-text); font-size: 14px; font-weight: 500; }

/* A7. Links: token gold that reads in both schemes, underlined in running text. */
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content a:not([class*="btn"]):not([class*="cta"]):not(.accordion-button) { color: var(--ns-gold-light) !important; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(p, li, td) a:not(.btn) { text-decoration: underline; text-underline-offset: 2px; }
/* A page sheet that paints every link white (css/pages/aisolutions.css: a { color: white !important }) reaches the footer too. */
body[data-ns-gp-public-1][data-ns-gp-layout] .netshow-footer a:not(.footer-help-option) { color: var(--ns-text-2) !important; }
body[data-ns-gp-public-1][data-ns-gp-layout] .netshow-footer a:not(.footer-help-option):hover { color: var(--ns-text) !important; }

/* A8. The header's guest brand word reads the ink (it was drawn white for the dark-only bar). */
body[data-ns-gp-public-1] .ns-skip-link { color: var(--ns-on-accent) !important; }
body[data-ns-gp-public-1][data-ns-gp-layout] #navbar .ns-guest-brand-word { color: var(--ns-text); }

/* A9. /aisolutions (css/pages/aisolutions.css draws white ink and #2b3035 panels for a dark-only page). */
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.heading, .subheading, .description, .pricing-box h3, .pricing-box p, .features li, .features b, li, .elementor-widget-container) { color: var(--ns-text) !important; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.color-gray, .description) { color: var(--ns-text-2) !important; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.agent_section, .in-progress, .accordion-button, .accordion-body, .pricing-box, .bg-image_gradient) {
    background: var(--ns-card) !important;
    color: var(--ns-text) !important;
    border: 1px solid var(--ns-border) !important;
}
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content .video-container { background: var(--ns-surface) !important; color: var(--ns-text); border-radius: var(--ns-radius); }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content .video-container :is(p, button) { color: var(--ns-text) !important; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content .accordion-button:not(.collapsed) { background: var(--ns-surface) !important; box-shadow: none; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content .btn-custom {
    min-height: 44px;
    border-radius: 22px;
    background: transparent !important;
    border: 1px solid var(--ns-border-strong) !important;
    color: var(--ns-text) !important;
}
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content .btn-custom:hover { background: var(--ns-surface) !important; }

/* A10. /agent-jobs: the three counters keep their meaning in token-safe ink (the info and warning hues read only on black). */
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.fs-1, .fs-2, .fs-3).fw-bold { color: var(--ns-text) !important; }
body[data-ns-gp-public-1][data-ns-gp-layout] #main-content :is(.text-info, .text-warning, .text-success, .text-primary) { color: var(--ns-gold-light) !important; }

/* ---------- B. other documents (GpPublic1Dress) ---------- */

body.ns-gp-public-1:not([data-ns-gp-layout]) {
    background-color: var(--ns-bg);
    color: var(--ns-text);
    font-family: var(--ns-font);
}
body.ns-gp-public-1:not([data-ns-gp-layout]) :is(h1, h2, h3, h4, h5, h6) { font-family: var(--ns-font); letter-spacing: 0; }
body.ns-gp-public-1:not([data-ns-gp-layout]) :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 2px solid var(--ns-gold);
    outline-offset: 2px;
}

/* ---------- Both ---------- */

body[data-ns-gp-public-1] :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 2px solid var(--ns-gold); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
    body[data-ns-gp-public-1] *,
    body[data-ns-gp-public-1] *::before,
    body[data-ns-gp-public-1] *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}