/* GGurgenidze unified Feed UI v1
   Keeps every page in the same visual system as the authenticated feed. */

:root {
    --gg-feed-bg: #f4f7fb;
    --gg-feed-surface: #ffffff;
    --gg-feed-surface-soft: #f6f9fc;
    --gg-feed-border: #dbe4ef;
    --gg-feed-border-hover: #c8d9eb;
    --gg-feed-text: #101b2e;
    --gg-feed-copy: #1a2a40;
    --gg-feed-muted: #77869a;
    --gg-feed-blue: #006fe8;
    --gg-feed-blue-dark: #005ed6;
    --gg-feed-blue-soft: #eef6ff;
    --gg-feed-shadow: 0 10px 28px rgba(18, 42, 73, .07);
    --gg-feed-shadow-hover: 0 14px 34px rgba(18, 42, 73, .10);
    --gg-feed-radius: 16px;
}

html,
body {
    background: var(--gg-feed-bg);
    color: var(--gg-feed-text);
}

body.is-authenticated {
    background:
        radial-gradient(circle at 70% -18%, rgba(0, 111, 232, .07), transparent 28rem),
        var(--gg-feed-bg) !important;
}

body.is-guest {
    background:
        radial-gradient(circle at 85% 0%, rgba(0, 111, 232, .09), transparent 28rem),
        linear-gradient(180deg, #f8fbff 0%, var(--gg-feed-bg) 100%) !important;
}

body.is-authenticated .app-content {
    width: 100%;
    min-width: 0;
}

body.is-authenticated .app-content > :where(
    .notification-page,
    .phase6-page,
    .phase7-connections-page,
    .profile-settings-page,
    .ggp-page,
    .messages-page,
    .gg-shop-v19,
    .gg-jobs,
    .activity-history-page
) {
    width: 100%;
    max-width: 860px;
    margin-inline: auto;
}

body.is-authenticated .app-content > .admin-pro,
body.is-authenticated .app-content > .messages-page {
    width: 100%;
    max-width: 980px;
    margin-inline: auto;
}

body.is-guest .page > :where(
    .auth-grid,
    .privacy-policy-page,
    .child-safety-page,
    .account-deletion-page,
    .card
) {
    width: min(100%, 860px);
    margin-inline: auto;
}

/* Feed-style surfaces shared by every module. */
body :where(
    .app-content .card,
    .notification-item,
    .gg-job-card,
    .gg-job-detail,
    .gg-job-form,
    .gg-jobs-filter,
    .gg-services-category-card-v3,
    .shop19-card,
    .shop19-panel,
    .shop19-review-card,
    .shop19-toolbar,
    .shop19-empty,
    .phase7-person-card,
    .phase6-content-result,
    .phase6-comment-result,
    .phase6-user-result
) {
    border: 1px solid var(--gg-feed-border) !important;
    border-radius: var(--gg-feed-radius) !important;
    background: var(--gg-feed-surface) !important;
    box-shadow: var(--gg-feed-shadow) !important;
}

body :where(
    .notification-item,
    .gg-job-card,
    .gg-services-category-card-v3,
    .shop19-card,
    .shop19-review-card,
    .phase7-person-card,
    .phase6-content-result,
    .phase6-comment-result,
    .phase6-user-result
) {
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

body :where(
    .notification-item,
    .gg-job-card,
    .gg-services-category-card-v3,
    .shop19-card,
    .shop19-review-card,
    .phase7-person-card,
    .phase6-content-result,
    .phase6-comment-result,
    .phase6-user-result
):hover {
    border-color: var(--gg-feed-border-hover) !important;
    box-shadow: var(--gg-feed-shadow-hover) !important;
}

/* Every page starts with the same clean feed header surface. */
body.is-authenticated :where(
    .notification-page-header,
    .phase6-page-header,
    .phase7-connections-header,
    .profile-settings-hero,
    .ggp-hero,
    .gg-jobs-hero,
    .shop19-hero,
    .admin-pro-header
) {
    padding: 18px 20px !important;
    border: 1px solid var(--gg-feed-border) !important;
    border-radius: var(--gg-feed-radius) !important;
    background: var(--gg-feed-surface) !important;
    box-shadow: var(--gg-feed-shadow) !important;
}

body.is-authenticated :where(
    .notification-page-header,
    .phase6-page-header,
    .phase7-connections-header,
    .profile-settings-hero,
    .ggp-hero,
    .gg-jobs-hero,
    .shop19-hero,
    .admin-pro-header
) h1 {
    color: var(--gg-feed-text) !important;
    font-size: clamp(1.45rem, 3vw, 2rem) !important;
    line-height: 1.18 !important;
    letter-spacing: -.025em;
}

body.is-authenticated :where(
    .notification-page-header,
    .phase6-page-header,
    .phase7-connections-header,
    .profile-settings-hero,
    .ggp-hero,
    .gg-jobs-hero,
    .shop19-hero,
    .admin-pro-header
) p {
    color: var(--gg-feed-muted) !important;
    line-height: 1.55;
}

body :where(.eyebrow, .gg-jobs-kicker, .shop19-kicker) {
    color: var(--gg-feed-blue) !important;
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

/* Forms match the feed composer and comment field treatment. */
body :where(.app-content, .page) input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body :where(.app-content, .page) textarea,
body :where(.app-content, .page) select {
    min-height: 44px;
    border: 1px solid #d4e0ec !important;
    border-radius: 10px !important;
    background: #f9fbfd !important;
    color: var(--gg-feed-copy) !important;
    box-shadow: none !important;
}

body :where(.app-content, .page) textarea {
    min-height: 110px;
}

body :where(.app-content, .page) input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
body :where(.app-content, .page) textarea:focus,
body :where(.app-content, .page) select:focus {
    border-color: #74a9df !important;
    outline: 3px solid rgba(0, 111, 232, .11) !important;
    background: #fff !important;
}

body :where(.button, .btn-primary, .primary-button, .shop19-btn) {
    border: 0 !important;
    border-radius: 10px !important;
    background: linear-gradient(135deg, #0b74e8, var(--gg-feed-blue-dark)) !important;
    color: #fff !important;
    box-shadow: 0 8px 18px rgba(0, 94, 214, .16) !important;
    font-weight: 800;
}

body :where(.button, .btn-primary, .primary-button, .shop19-btn):hover {
    filter: brightness(.96);
}

body :where(.button.secondary, .shop19-btn-secondary) {
    border: 1px solid #d6e4f3 !important;
    background: var(--gg-feed-blue-soft) !important;
    color: #145ea8 !important;
    box-shadow: none !important;
}

body :where(.button.danger, .shop19-btn-danger) {
    background: #cc3d4e !important;
    color: #fff !important;
}

body :where(.shop19-btn-success) {
    background: #15945b !important;
    color: #fff !important;
}

body :where(.muted, small, time) {
    color: var(--gg-feed-muted);
}

body.is-authenticated :where(
    .notification-page,
    .phase6-page,
    .phase7-connections-page,
    .profile-settings-page,
    .ggp-page,
    .gg-shop-v19,
    .gg-jobs,
    .admin-pro
) {
    gap: 16px;
}

@media (max-width: 900px) {
    body.is-authenticated .app-content > :where(
        .notification-page,
        .phase6-page,
        .phase7-connections-page,
        .profile-settings-page,
        .ggp-page,
        .messages-page,
        .gg-shop-v19,
        .gg-jobs,
        .admin-pro,
        .activity-history-page
    ) {
        max-width: none;
    }
}

@media (max-width: 650px) {
    body.is-authenticated .app-content {
        width: 100%;
    }

    body :where(
        .app-content .card,
        .notification-item,
        .gg-job-card,
        .gg-job-detail,
        .gg-job-form,
        .gg-jobs-filter,
        .gg-services-category-card-v3,
        .shop19-card,
        .shop19-panel,
        .shop19-review-card,
        .shop19-toolbar,
        .shop19-empty
    ) {
        border-radius: 15px !important;
    }

    body.is-authenticated :where(
        .notification-page-header,
        .phase6-page-header,
        .phase7-connections-header,
        .profile-settings-hero,
        .ggp-hero,
        .gg-jobs-hero,
        .shop19-hero,
        .admin-pro-header
    ) {
        padding: 16px !important;
        border-radius: 15px !important;
    }

    body :where(.button, .shop19-btn) {
        min-height: 42px;
    }
}


/* GG_UNIFIED_FEED_UI_V2_ENFORCEMENT
   This layer is intentionally specific because several legacy views load
   their own styles after the main document head. */
html body.is-authenticated .app-content > :where(
    .notification-page,
    .phase6-page,
    .phase7-connections-page,
    .profile-settings-page,
    .ggp-page,
    .gg-shop-v19,
    .gg-jobs,
    .activity-history-page
),
html body.is-guest .page > :where(
    .gg-shop-v19,
    .gg-jobs,
    .privacy-policy-page,
    .child-safety-page,
    .account-deletion-page
) {
    width: 100% !important;
    max-width: 860px !important;
    margin-inline: auto !important;
}

html body .app-content .card,
html body .page .card,
html body .notification-page .notification-item,
html body .gg-jobs .gg-job-card,
html body .gg-jobs .gg-job-detail,
html body .gg-jobs .gg-job-form,
html body .gg-jobs .gg-jobs-filter,
html body .gg-jobs .gg-services-category-card-v3,
html body .gg-shop-v19 .shop19-card,
html body .gg-shop-v19 .shop19-panel,
html body .gg-shop-v19 .shop19-review-card,
html body .gg-shop-v19 .shop19-toolbar,
html body .gg-shop-v19 .shop19-empty {
    border: 1px solid var(--gg-feed-border) !important;
    border-radius: var(--gg-feed-radius) !important;
    background: var(--gg-feed-surface) !important;
    box-shadow: var(--gg-feed-shadow) !important;
}

html body .notification-page .notification-page-header,
html body .phase6-page .phase6-page-header,
html body .phase7-connections-page .phase7-connections-header,
html body .profile-settings-page .profile-settings-hero,
html body .ggp-page .ggp-hero,
html body .gg-jobs .gg-jobs-hero,
html body .gg-shop-v19 .shop19-hero,
html body .admin-pro .admin-pro-header {
    padding: 18px 20px !important;
    border: 1px solid var(--gg-feed-border) !important;
    border-radius: var(--gg-feed-radius) !important;
    background: var(--gg-feed-surface) !important;
    background-image: none !important;
    box-shadow: var(--gg-feed-shadow) !important;
}

html body.is-guest .page .auth-grid .auth-mail-card {
    border: 1px solid var(--gg-feed-border) !important;
    border-radius: var(--gg-feed-radius) !important;
    background: var(--gg-feed-surface) !important;
    box-shadow: var(--gg-feed-shadow) !important;
}

html body :where(.app-content, .page) .button,
html body .gg-shop-v19 .shop19-btn {
    border-radius: 10px !important;
    background: linear-gradient(135deg, #0b74e8, var(--gg-feed-blue-dark)) !important;
    color: #fff !important;
}

html body :where(.app-content, .page) .button.secondary,
html body .gg-shop-v19 .shop19-btn-secondary {
    border: 1px solid #d6e4f3 !important;
    background: var(--gg-feed-blue-soft) !important;
    color: #145ea8 !important;
    box-shadow: none !important;
}

html body :where(.app-content, .page) input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
html body :where(.app-content, .page) textarea,
html body :where(.app-content, .page) select {
    border: 1px solid #d4e0ec !important;
    border-radius: 10px !important;
    background: #f9fbfd !important;
}

@media (max-width: 650px) {
    html body .app-content .card,
    html body .page .card,
    html body .gg-jobs .gg-job-card,
    html body .gg-shop-v19 .shop19-card,
    html body.is-guest .page .auth-grid .auth-mail-card {
        border-radius: 15px !important;
    }
}