/* Greecevest shared UX system: public pages, auth, and every account dashboard. */
:root {
    --gv-ink: #183958;
    --gv-muted: #5f6f7e;
    --gv-accent: #1e6aa3;
    --gv-success: #237a61;
    --gv-danger: #b42318;
    --gv-surface: #ffffff;
    --gv-canvas: #f6f8fa;
    --gv-border: #dbe4ea;
    --gv-focus: #2b78b8;
    --gv-radius: 16px;
    --gv-shadow: 0 10px 30px rgba(24, 56, 89, .08);
}

html { scroll-behavior: smooth; }
body { color: var(--gv-ink); text-rendering: optimizeLegibility; }
body.gv-mobile-menu-open { overflow: hidden; }
main { min-width: 0; }
img, svg, video { max-width: 100%; }

.gv-skip-link {
    position: fixed;
    z-index: 100000;
    top: .75rem;
    left: .75rem;
    padding: .7rem 1rem;
    border-radius: 10px;
    background: var(--gv-ink);
    color: #fff !important;
    font-weight: 700;
    transform: translateY(-180%);
    transition: transform .15s ease;
}
.gv-skip-link:focus { transform: translateY(0); }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--gv-focus) !important;
    outline-offset: 3px !important;
    box-shadow: none;
}

:where(button, .btn, [role="button"], input[type="submit"], input[type="button"]) {
    min-height: 44px;
}

:where(input, select, textarea).form-control,
:where(select).form-select {
    border-color: var(--gv-border);
}

label { font-weight: 600; }
.form-text { color: var(--gv-muted); }
.invalid-feedback, .error-span { color: var(--gv-danger) !important; }

.gv-page-container {
    width: min(100% - 2rem, 1200px);
    margin-inline: auto;
    padding-block: clamp(1.25rem, 3vw, 2.5rem);
}

.gv-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
}
.gv-page-header h1 { margin: 0; font-size: clamp(1.55rem, 3vw, 2.15rem); line-height: 1.2; }
.gv-page-header p { margin: .45rem 0 0; color: var(--gv-muted); max-width: 68ch; }

.gv-surface,
.card {
    border-color: var(--gv-border);
}

.gv-empty-state {
    display: grid;
    place-items: center;
    min-height: 220px;
    padding: clamp(1.5rem, 5vw, 3rem);
    border: 1px dashed #b9c9d3;
    border-radius: var(--gv-radius);
    background: var(--gv-surface);
    color: var(--gv-muted);
    text-align: center;
}
.gv-empty-state > * { max-width: 36rem; }

.table-responsive {
    max-width: 100%;
    overflow-x: auto;
    border: 1px solid var(--gv-border);
    border-radius: var(--gv-radius);
    background: var(--gv-surface);
    -webkit-overflow-scrolling: touch;
}
.table { margin-bottom: 0; }
.table th { white-space: nowrap; color: var(--gv-ink); }

.alert[role="alert"], .alert[role="status"] { border-radius: 12px; }

[data-gv-submitting="true"] :is(button[type="submit"], input[type="submit"]) {
    cursor: progress;
    opacity: .72;
    pointer-events: none;
}
[data-gv-submitting="true"] :is(button[type="submit"], input[type="submit"])::after {
    content: "";
    display: inline-block;
    width: .9em;
    height: .9em;
    margin-left: .55em;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: gv-spin .7s linear infinite;
}
@keyframes gv-spin { to { transform: rotate(360deg); } }

@media (max-width: 767.98px) {
    .gv-page-container { width: min(100% - 1.25rem, 1200px); }
    .gv-page-header { flex-direction: column; }
    .gv-page-header > .btn,
    .gv-page-header > div:last-child:has(.btn) { width: 100%; }
    .modal-dialog { margin: .65rem; }
    .card-body { padding: 1rem; }
    .table-responsive { font-size: .875rem; }
    .btn-group { flex-wrap: wrap; }
    .filters-card.position-sticky { position: static !important; top: auto !important; }
    .results-bar, .results-actions, .filter-row { align-items: stretch !important; }
    .results-actions { width: 100%; flex-wrap: wrap; }
    .results-actions > * { flex: 1 1 auto; }
    .filter-bar-sticky { position: relative !important; top: auto !important; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}
