/* _content/justtrade.geomat.componentes/Layout/GeoLeftNav.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════
   GEOMAT GeoLeftNav — Design System v1.0
   Scoped CSS isolation (.razor.css)
   ═══════════════════════════════════════════════════════════════════ */

/* ── Etiqueta de sección ────────────────────────────────────────── */
.nav-section-label[b-b3u62py1et] {
    padding: 16px 20px 4px 20px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: #90a4ae !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.nav-section-label--child[b-b3u62py1et] {
    padding: 10px 20px 2px 44px !important;
}

/* ── Error en nav ───────────────────────────────────────────────── */
.nav-error[b-b3u62py1et] {
    margin: 12px 16px !important;
    padding: 8px 12px !important;
    background: #fff3f3 !important;
    border: 1px solid #ffcdd2 !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    color: #c62828 !important;
}

/* ── LeftNav ────────────────────────────────────────────────────── */
.geo-leftnav[b-b3u62py1et] {
    flex-shrink: 0 !important;
    overflow: hidden !important;
    background: #ffffff !important;
    border-right: 1px solid #e0e7ef !important;
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.04) !important;
    transition: width 300ms cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: flex !important;
    flex-direction: column !important;
}

.nav-open[b-b3u62py1et] {
    width: 240px !important;
}

.nav-closed[b-b3u62py1et] {
    width: 0 !important;
}

.nav-inner[b-b3u62py1et] {
    width: 240px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    height: 100% !important;
    padding: 12px 0 !important;
}

/* Scrollbar */
.nav-inner[b-b3u62py1et]::-webkit-scrollbar {
    width: 4px !important;
}

.nav-inner[b-b3u62py1et]::-webkit-scrollbar-track {
    background: transparent !important;
}

.nav-inner[b-b3u62py1et]::-webkit-scrollbar-thumb {
    background: #e0e7ef !important;
    border-radius: 4px !important;
}

/* Separator */
.nav-separator[b-b3u62py1et] {
    border: none !important;
    border-top: 1px solid #e0e7ef !important;
    margin: 8px 16px !important;
}

.nav-separator-child[b-b3u62py1et] {
    margin: 4px 12px !important;
}

/* Nav item (leaf) */
.nav-item[b-b3u62py1et] {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 9px 20px !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #1a2332 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    transition: background 150ms ease, color 150ms ease !important;
    border-left: 3px solid transparent !important;
    cursor: pointer !important;
}

.nav-item:hover[b-b3u62py1et] {
    background: #e8f5e9 !important;
    color: #0D3D26 !important;
    text-decoration: none !important;
}

.nav-item-active[b-b3u62py1et] {
    background: #0D3D26 !important;
    color: #ffffff !important;
    font-weight: 500 !important;
    border-left-color: #4AAD6B !important;
}

.nav-item-active:hover[b-b3u62py1et] {
    background: #082A19 !important;
    color: #ffffff !important;
}

/* Nav icon */
.nav-icon[b-b3u62py1et] {
    font-size: 15px !important;
    width: 18px !important;
    text-align: center !important;
    flex-shrink: 0 !important;
}

/* Nav label */
.nav-label[b-b3u62py1et] {
    flex: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* Nav group (with children) */
.nav-group[b-b3u62py1et] {
    display: flex !important;
    flex-direction: column !important;
}

.nav-group-header[b-b3u62py1et] {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 9px 20px !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #546e7a !important;
    background: transparent !important;
    border: none !important;
    border-left: 3px solid transparent !important;
    text-align: left !important;
    width: 100% !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    transition: background 150ms ease, color 150ms ease !important;
}

.nav-group-header:hover[b-b3u62py1et] {
    background: #e8f5e9 !important;
    color: #0D3D26 !important;
}

.nav-group-header.expanded[b-b3u62py1et] {
    color: #0D3D26 !important;
    font-weight: 600 !important;
}

/* Chevron */
.chevron[b-b3u62py1et] {
    margin-left: auto !important;
    flex-shrink: 0 !important;
    transition: transform 250ms ease !important;
    color: #546e7a !important;
}

.nav-group-header.expanded .chevron[b-b3u62py1et] {
    transform: rotate(180deg) !important;
}

/* Children container */
.nav-children[b-b3u62py1et] {
    overflow: hidden !important;
    max-height: 0 !important;
    transition: max-height 280ms cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.nav-children.children-open[b-b3u62py1et] {
    max-height: 600px !important;
}

.nav-children .nav-item[b-b3u62py1et] {
    padding-left: 44px !important;
    font-size: 12.5px !important;
}

/* Loading dots */
.nav-loading[b-b3u62py1et] {
    display: flex !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 24px 20px !important;
}

.loading-dot[b-b3u62py1et] {
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #4AAD6B !important;
    animation: dot-bounce-b-b3u62py1et 1.4s ease-in-out infinite !important;
}

.loading-dot:nth-child(1)[b-b3u62py1et] { animation-delay: 0s !important; }
.loading-dot:nth-child(2)[b-b3u62py1et] { animation-delay: 0.2s !important; }
.loading-dot:nth-child(3)[b-b3u62py1et] { animation-delay: 0.4s !important; }

@keyframes dot-bounce-b-b3u62py1et {
    0%, 80%, 100% { transform: scale(0.7); opacity: 0.5; }
    40%            { transform: scale(1.0); opacity: 1.0; }
}

@media (max-width: 767px) {
    .geo-leftnav[b-b3u62py1et] {
        position: fixed !important;
        top: 56px !important;
        left: 0 !important;
        bottom: 0 !important;
        z-index: 200 !important;
    }
}
/* _content/justtrade.geomat.componentes/Layout/GeoMenuItems.razor.rz.scp.css */
/* ── Search ─────────────────────────────────────────────────────── */
.gmi-search[b-l7ejd07e9j] {
    padding: 10px 12px !important;
    flex-shrink: 0 !important;
}

.gmi-search-box[b-l7ejd07e9j] {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
}

.gmi-search-icon[b-l7ejd07e9j] {
    position: absolute !important;
    left: 10px !important;
    color: #90a4ae !important;
    pointer-events: none !important;
    flex-shrink: 0 !important;
}

.gmi-search-input[b-l7ejd07e9j] {
    width: 100% !important;
    height: 34px !important;
    padding: 0 32px 0 32px !important;
    background: #f1f5f2 !important;
    border: 1px solid #dde8e0 !important;
    border-radius: 8px !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 12px !important;
    color: #1a2332 !important;
    outline: none !important;
    transition: border-color 150ms ease, box-shadow 150ms ease !important;
    box-sizing: border-box !important;
}

.gmi-search-input[b-l7ejd07e9j]::placeholder {
    color: #90a4ae !important;
}

.gmi-search-input:focus[b-l7ejd07e9j] {
    border-color: #4AAD6B !important;
    box-shadow: 0 0 0 3px rgba(74,173,107,0.15) !important;
    background: #ffffff !important;
}

.gmi-search-clear[b-l7ejd07e9j] {
    position: absolute !important;
    right: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 20px !important;
    height: 20px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 50% !important;
    color: #90a4ae !important;
    cursor: pointer !important;
    padding: 0 !important;
    transition: background 150ms ease, color 150ms ease !important;
}

.gmi-search-clear:hover[b-l7ejd07e9j] {
    background: #dde8e0 !important;
    color: #0D3D26 !important;
}

/* ── Search results ─────────────────────────────────────────────── */
.gmi-search-group-label[b-l7ejd07e9j] {
    padding: 10px 20px 3px 20px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 0.07em !important;
    text-transform: uppercase !important;
    color: #4AAD6B !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    user-select: none !important;
}

.gmi-search-result[b-l7ejd07e9j] {
    padding-left: 20px !important;
}

.gmi-no-results[b-l7ejd07e9j] {
    padding: 20px !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 12px !important;
    color: #90a4ae !important;
    text-align: center !important;
}

/* ── Section label ──────────────────────────────────────────────── */
.gmi-section-label[b-l7ejd07e9j] {
    padding: 16px 20px 4px 20px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: #90a4ae !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    user-select: none !important;
}

/* ── Nav item (leaf) ────────────────────────────────────────────── */
.gmi-item[b-l7ejd07e9j] {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 9px 20px !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #1a2332 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    border-left: 3px solid transparent !important;
    cursor: pointer !important;
    transition: background 150ms ease, color 150ms ease !important;
}

.gmi-item:hover[b-l7ejd07e9j] {
    background: #e8f5e9 !important;
    color: #0D3D26 !important;
    text-decoration: none !important;
}

.gmi-item.is-active[b-l7ejd07e9j] {
    background: #0D3D26 !important;
    color: #ffffff !important;
    font-weight: 500 !important;
    border-left-color: #4AAD6B !important;
}

.gmi-item.is-active:hover[b-l7ejd07e9j] {
    background: #082A19 !important;
    color: #ffffff !important;
}

/* ── Icon + label ───────────────────────────────────────────────── */
.gmi-icon[b-l7ejd07e9j] {
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0 !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
    fill: none !important;
    display: inline-block !important;
}

.gmi-label[b-l7ejd07e9j] {
    flex: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* ── Group (accordion) ──────────────────────────────────────────── */
.gmi-group[b-l7ejd07e9j] {
    display: flex !important;
    flex-direction: column !important;
}

.gmi-group-btn[b-l7ejd07e9j] {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 9px 20px !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #546e7a !important;
    background: transparent !important;
    border: none !important;
    border-left: 3px solid transparent !important;
    text-align: left !important;
    width: 100% !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    transition: background 150ms ease, color 150ms ease !important;
}

.gmi-group-btn:hover[b-l7ejd07e9j] {
    background: #e8f5e9 !important;
    color: #0D3D26 !important;
}

.gmi-group-btn.is-expanded[b-l7ejd07e9j] {
    color: #0D3D26 !important;
    font-weight: 600 !important;
}

.gmi-chevron[b-l7ejd07e9j] {
    margin-left: auto !important;
    flex-shrink: 0 !important;
    transition: transform 250ms ease !important;
    color: #546e7a !important;
}

.gmi-group-btn.is-expanded .gmi-chevron[b-l7ejd07e9j] {
    transform: rotate(180deg) !important;
}

/* ── Children ───────────────────────────────────────────────────── */
.gmi-children[b-l7ejd07e9j] {
    overflow: hidden !important;
    max-height: 0 !important;
    transition: max-height 280ms cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.gmi-children.is-open[b-l7ejd07e9j] {
    max-height: 600px !important;
}

.gmi-children .gmi-item[b-l7ejd07e9j] {
    padding-left: 44px !important;
    font-size: 12.5px !important;
}

/* ── Loading dots ───────────────────────────────────────────────── */
.gmi-loading[b-l7ejd07e9j] {
    display: flex !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 24px 20px !important;
}

.gmi-dot[b-l7ejd07e9j] {
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #4AAD6B !important;
    animation: gmi-bounce-b-l7ejd07e9j 1.4s ease-in-out infinite !important;
}

.gmi-dot:nth-child(1)[b-l7ejd07e9j] { animation-delay: 0s !important; }
.gmi-dot:nth-child(2)[b-l7ejd07e9j] { animation-delay: 0.2s !important; }
.gmi-dot:nth-child(3)[b-l7ejd07e9j] { animation-delay: 0.4s !important; }

@keyframes gmi-bounce-b-l7ejd07e9j {
    0%, 80%, 100% { transform: scale(0.7); opacity: 0.5; }
    40%            { transform: scale(1.0); opacity: 1.0; }
}

/* ── Error ──────────────────────────────────────────────────────── */
.gmi-error[b-l7ejd07e9j] {
    margin: 12px 16px !important;
    padding: 8px 12px !important;
    background: #fff3f3 !important;
    border: 1px solid #ffcdd2 !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    color: #c62828 !important;
}
/* _content/justtrade.geomat.componentes/Layout/GeoTopNav.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════
   GEOMAT GeoTopNav — Design System v1.0
   ═══════════════════════════════════════════════════════════════════ */

/* ── TopNav ─────────────────────────────────────────────────────── */
.geo-topnav[b-f2efegv7z3] {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    height: 56px !important;
    min-height: 56px !important;
    padding: 0 20px !important;
    background: #0D3D26 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18) !important;
    z-index: 100 !important;
    flex-shrink: 0 !important;
}

.topnav-left[b-f2efegv7z3] {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
}

.topnav-right[b-f2efegv7z3] {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
}

/* Hamburger */
.hamburger[b-f2efegv7z3] {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 5px !important;
    width: 36px !important;
    height: 36px !important;
    padding: 8px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    transition: background 150ms ease !important;
}

.hamburger:hover[b-f2efegv7z3] {
    background: rgba(74, 173, 107, 0.15) !important;
}

.hamburger-bar[b-f2efegv7z3] {
    display: block !important;
    width: 18px !important;
    height: 2px !important;
    background: #ffffff !important;
    border-radius: 2px !important;
}

/* Brand */
.brand[b-f2efegv7z3] {
    font-size: 18px !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    user-select: none !important;
}

.brand-geo[b-f2efegv7z3] { color: #ffffff !important; }
.brand-mat[b-f2efegv7z3] { color: #4AAD6B !important; }

/* Logo de empresa */
.brand-logo[b-f2efegv7z3] {
    height: 36px !important;
    max-width: 140px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

/* ── User chip (botón en el topnav) ─────────────────────────────── */
.user-chip[b-f2efegv7z3] {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 4px 10px 4px 4px !important;
    background: rgba(255,255,255,0.08) !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    border-radius: 20px !important;
    cursor: pointer !important;
    transition: background 150ms ease !important;
    color: rgba(255,255,255,0.9) !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
}

.user-chip:hover[b-f2efegv7z3] {
    background: rgba(255,255,255,0.14) !important;
    border-color: rgba(255,255,255,0.28) !important;
}

.user-avatar[b-f2efegv7z3] {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background: #2D6A4F !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
}

.user-avatar__img[b-f2efegv7z3] {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.user-avatar__initials[b-f2efegv7z3] {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #fff !important;
    letter-spacing: 0.02em !important;
}

.user-chip__name[b-f2efegv7z3] {
    font-size: 13px !important;
    font-weight: 500 !important;
    max-width: 140px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* ── CA-51: módulo Plan Maestro / Comercial — acento púrpura distintivo ──── */
.user-chip--comercial[b-f2efegv7z3] {
    background: rgba(124, 58, 237, 0.18) !important;
    border-color: rgba(124, 58, 237, 0.45) !important;
}
.user-avatar--comercial[b-f2efegv7z3] { background: #7C3AED !important; }
.user-chip__badge[b-f2efegv7z3] {
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    color: #fff !important;
    background: #7C3AED !important;
    padding: 2px 6px !important;
    border-radius: 8px !important;
}

/* ── Overlay ─────────────────────────────────────────────────────── */
.profile-overlay[b-f2efegv7z3] {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,0.35) !important;
    z-index: 200 !important;
}

/* ── Profile Drawer ──────────────────────────────────────────────── */
.profile-drawer[b-f2efegv7z3] {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 300px !important;
    background: #fff !important;
    z-index: 201 !important;
    display: flex !important;
    flex-direction: column !important;
    box-shadow: -4px 0 24px rgba(0,0,0,0.18) !important;
}

/* Cabecera del drawer */
.pd-header[b-f2efegv7z3] {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    padding: 20px 16px 20px !important;
    background: #0D3D26 !important;
    position: relative !important;
}

.pd-avatar[b-f2efegv7z3] {
    width: 56px !important;
    height: 56px !important;
    border-radius: 50% !important;
    background: #2D6A4F !important;
    border: 2px solid rgba(255,255,255,0.3) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
}

.pd-avatar__img[b-f2efegv7z3] {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.pd-avatar__initials[b-f2efegv7z3] {
    font-size: 20px !important;
    font-weight: 600 !important;
    color: #fff !important;
}

.pd-user-info[b-f2efegv7z3] {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    flex: 1 !important;
    min-width: 0 !important;
    padding-right: 28px !important;
}

.pd-username[b-f2efegv7z3] {
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.07em !important;
    color: rgba(255,255,255,0.6) !important;
}

.pd-nombre[b-f2efegv7z3] {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #fff !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.pd-email[b-f2efegv7z3] {
    font-size: 12px !important;
    color: rgba(255,255,255,0.65) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.pd-close[b-f2efegv7z3] {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255,255,255,0.1) !important;
    border: none !important;
    border-radius: 6px !important;
    color: rgba(255,255,255,0.8) !important;
    cursor: pointer !important;
    transition: background 150ms !important;
}

.pd-close:hover[b-f2efegv7z3] {
    background: rgba(255,255,255,0.2) !important;
    color: #fff !important;
}

/* Cuerpo del drawer */
.pd-body[b-f2efegv7z3] {
    flex: 1 !important;
    padding: 20px 16px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

/* ── Selector de empresa ─────────────────────────────────────────── */
.pd-section[b-f2efegv7z3] {
    margin-bottom: 12px !important;
}

.pd-section-title[b-f2efegv7z3] {
    display: block !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.07em !important;
    color: #9CA8A3 !important;
    margin-bottom: 6px !important;
}

/* ── Calendario de referencia (semana ISO) ──────────────────────────── */
[b-f2efegv7z3] .pd-calendar {
    width: 100% !important;
    border: 1px solid var(--geo-border, #E0E5E2) !important;
    border-radius: 8px !important;
}

.pd-empresa-list[b-f2efegv7z3] {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.pd-empresa-item[b-f2efegv7z3] {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    padding: 9px 12px !important;
    background: #F8FAF8 !important;
    border: 1px solid #E5E9E5 !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    text-align: left !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    transition: background 150ms, border-color 150ms !important;
}

.pd-empresa-item:hover:not(:disabled)[b-f2efegv7z3] {
    background: #EDF5F0 !important;
    border-color: #B7D6C7 !important;
}

.pd-empresa-item--active[b-f2efegv7z3] {
    background: #EDF5F0 !important;
    border-color: #2D6A4F !important;
    cursor: default !important;
}

.pd-empresa-code[b-f2efegv7z3] {
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em !important;
    color: #fff !important;
    background: #2D6A4F !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    flex-shrink: 0 !important;
}

.pd-empresa-item--active .pd-empresa-code[b-f2efegv7z3] {
    background: #0D3D26 !important;
}

.pd-empresa-name[b-f2efegv7z3] {
    flex: 1 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #1A2E1F !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.pd-empresa-check[b-f2efegv7z3] {
    color: #2D6A4F !important;
    flex-shrink: 0 !important;
}

.pd-btn-logout[b-f2efegv7z3] {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 11px 14px !important;
    background: #FEF2F2 !important;
    border: 1px solid #FECACA !important;
    border-radius: 8px !important;
    color: #B91C1C !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: background 150ms !important;
    text-align: left !important;
}

.pd-btn-logout:hover[b-f2efegv7z3] {
    background: #FEE2E2 !important;
    border-color: #FCA5A5 !important;
}
/* _content/justtrade.geomat.componentes/Layout/MainLayout.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════
   GEOMAT MainLayout — Design System v1.0
   Scoped CSS isolation (.razor.css)
   ═══════════════════════════════════════════════════════════════════ */

/* ── Shell ──────────────────────────────────────────────────────── */
.geo-shell[b-drjhbsu593] {
    display: flex !important;
    flex-direction: column !important;
    height: 100vh !important;
    overflow: hidden !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    background: #f5f7fa !important;
}

/* ── Main row (LeftNav + Body) ──────────────────────────────────── */
.geo-main[b-drjhbsu593] {
    display: flex !important;
    flex: 1 !important;
    overflow: hidden !important;
}

/* ── Body ───────────────────────────────────────────────────────── */
.geo-body[b-drjhbsu593] {
    flex: 1 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    background: #f5f7fa !important;
    padding: 0 !important;
}

/* Scrollbar */
.geo-body[b-drjhbsu593]::-webkit-scrollbar {
    width: 6px !important;
}

.geo-body[b-drjhbsu593]::-webkit-scrollbar-track {
    background: transparent !important;
}

.geo-body[b-drjhbsu593]::-webkit-scrollbar-thumb {
    background: #d0d7e0 !important;
    border-radius: 4px !important;
}

/* ── Backdrop mobile ─────────────────────────────────────────────── */
.nav-mobile-backdrop[b-drjhbsu593] {
    display: none !important;
}

@media (max-width: 767px) {
    .nav-mobile-backdrop[b-drjhbsu593] {
        display: block !important;
        position: fixed !important;
        inset: 56px 0 0 0 !important;
        background: rgba(0, 0, 0, 0.45) !important;
        z-index: 199 !important;
    }
}
/* _content/justtrade.geomat.componentes/Pages/Login.razor.rz.scp.css */
/* ============================================================
   GEOMAT — Login Screen
   Design System GEOMAT v1.0 · Geofrut SpA
   ============================================================ */

/* ============================================================
   ANIMACIONES
   ============================================================ */

@keyframes fadeInLeft-b-hcexzjji4d {
    from {
        opacity: 0;
        transform: translateX(-40px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeInUp-b-hcexzjji4d {
    from {
        opacity: 0;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes float-b-hcexzjji4d {
    0%, 100% { transform: translateY(0px); }
    50%       { transform: translateY(-14px); }
}

@keyframes shake-b-hcexzjji4d {
    0%, 100% { transform: translateX(0); }
    15%       { transform: translateX(-6px); }
    30%       { transform: translateX(6px); }
    45%       { transform: translateX(-5px); }
    60%       { transform: translateX(5px); }
    75%       { transform: translateX(-3px); }
    90%       { transform: translateX(3px); }
}

@keyframes spin-b-hcexzjji4d {
    to { transform: rotate(360deg); }
}

/* ============================================================
   LAYOUT RAÍZ
   ============================================================ */

.login-root[b-hcexzjji4d] {
    display: flex;
    height: 100vh;
    overflow: hidden;
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
}

/* ============================================================
   PANEL IZQUIERDO — verde
   ============================================================ */

.panel-left[b-hcexzjji4d] {
    width: 40%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;

    background-image:
        radial-gradient(circle, rgba(255,255,255,0.07) 1px, transparent 1px),
        linear-gradient(160deg, #1a3d1a 0%, #2d6a2d 60%, #3d8b3d 100%);
    background-size: 24px 24px, 100% 100%;

    animation: fadeInLeft-b-hcexzjji4d 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.panel-left-inner[b-hcexzjji4d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    z-index: 1;
    text-align: center;
    padding: 0 32px;
}

.leaf-wrapper[b-hcexzjji4d] {
    animation: float-b-hcexzjji4d 3s ease-in-out infinite;
    margin-bottom: 20px;
}

.leaf-icon[b-hcexzjji4d] {
    width: 120px;
    height: 120px;
    display: block;
    filter: drop-shadow(0 0 24px rgba(255,255,255,0.15));
}

.panel-left-divider[b-hcexzjji4d] {
    width: 48px;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.2);
    margin-bottom: 16px;
}

.panel-left-brand[b-hcexzjji4d] {
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 16px;
}

.panel-left-tagline[b-hcexzjji4d] {
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.55);
    line-height: 1.6;
    max-width: 240px;
    margin: 0;
}

/* ============================================================
   PANEL DERECHO — claro
   ============================================================ */

.panel-right[b-hcexzjji4d] {
    flex: 1;
    background-color: #f8faf5;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 40px;
    position: relative;
}

.panel-right-inner[b-hcexzjji4d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 380px;
}

/* ============================================================
   CARD DE LOGIN
   ============================================================ */

.login-card[b-hcexzjji4d] {
    background-color: #ffffff;
    border-radius: 16px;
    padding: 40px;
    width: 100%;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);

    animation: fadeInUp-b-hcexzjji4d 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.login-card.shake[b-hcexzjji4d] {
    animation: shake-b-hcexzjji4d 0.4s ease both;
}

/* ============================================================
   TIPOGRAFÍA CARD
   ============================================================ */

.login-title[b-hcexzjji4d] {
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 28px;
    font-weight: 700;
    color: #1a2e1a;
    margin: 0 0 8px 0;
    line-height: 1.2;
}

.login-subtitle[b-hcexzjji4d] {
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #6b8f6b;
    margin: 0 0 28px 0;
    line-height: 1.5;
}

/* ============================================================
   FORMULARIO
   ============================================================ */

.form-group[b-hcexzjji4d] {
    margin-bottom: 20px;
}

.form-label[b-hcexzjji4d] {
    display: block;
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 12px;
    font-weight: 600;
    color: #3a5a3a;
    margin-bottom: 6px;
    letter-spacing: 0.01em;
}

.form-input[b-hcexzjji4d] {
    display: block;
    width: 100%;
    box-sizing: border-box;
    background-color: #ffffff !important;
    border: 1px solid #c8e6c9;
    border-radius: 8px;
    padding: 12px 16px;
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 14px;
    color: #1a2e1a;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
}

.form-input[b-hcexzjji4d]::placeholder {
    color: #a8c5a8;
}

.form-input:focus[b-hcexzjji4d] {
    border-color: #2d6a2d;
    box-shadow: 0 0 0 3px rgba(45, 106, 45, 0.12);
    outline: none;
}

.form-input:disabled[b-hcexzjji4d] {
    opacity: 0.6;
    cursor: not-allowed;
    background-color: #f4f8f4 !important;
}

/* ============================================================
   MENSAJE DE ERROR
   ============================================================ */

.error-box[b-hcexzjji4d] {
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 20px;
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 13px;
    color: #dc2626;
    line-height: 1.5;
}

/* ============================================================
   BOTÓN INGRESAR
   ============================================================ */

.btn-login[b-hcexzjji4d] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    background-color: #2d6a2d !important;
    color: #ffffff !important;
    border: none;
    border-radius: 8px;
    padding: 14px 24px;
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
    margin-top: 8px;
    letter-spacing: 0.01em;
}

.btn-login:hover:not(:disabled)[b-hcexzjji4d] {
    background-color: #1a3d1a !important;
    box-shadow: 0 6px 20px -4px rgba(29, 61, 29, 0.38);
    transform: translateY(-1px);
}

.btn-login:active:not(:disabled)[b-hcexzjji4d] {
    transform: translateY(0);
    box-shadow: none;
}

.btn-login:disabled[b-hcexzjji4d] {
    opacity: 0.7;
    cursor: not-allowed;
    background-color: #4a8a4a !important;
    transform: none;
}

/* Spinner CSS puro */
.btn-spinner[b-hcexzjji4d] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin-b-hcexzjji4d 0.7s linear infinite;
    flex-shrink: 0;
}

/* ============================================================
   FOOTER DE CARD
   ============================================================ */

.login-footer[b-hcexzjji4d] {
    margin-top: 24px;
    text-align: center;
}

.link-back[b-hcexzjji4d] {
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #6b8f6b;
    text-decoration: none;
    transition: color 0.2s ease;
}

.link-back:hover[b-hcexzjji4d] {
    color: #2d6a2d;
    text-decoration: none;
}

/* ============================================================
   RESPONSIVE — mobile (columna única)
   ============================================================ */

@media (max-width: 768px) {
    .login-root[b-hcexzjji4d] {
        flex-direction: column;
        height: auto;
        min-height: 100vh;
        overflow: auto;
    }

    .panel-left[b-hcexzjji4d] {
        width: 100%;
        height: 30vh;
        min-height: 200px;
        animation: none;
        opacity: 1;
    }

    .leaf-icon[b-hcexzjji4d] {
        width: 70px;
        height: 70px;
    }

    .panel-left-tagline[b-hcexzjji4d] {
        display: none;
    }

    .panel-right[b-hcexzjji4d] {
        flex: 1;
        padding: 32px 20px;
    }

    .login-card[b-hcexzjji4d] {
        padding: 28px 24px;
        border-radius: 12px;
    }

    .login-title[b-hcexzjji4d] {
        font-size: 24px;
    }
}
/* _content/justtrade.geomat.componentes/Pages/Setup.razor.rz.scp.css */
/* ============================================================
   GEOMAT — Setup Screen (Configuración inicial)
   Design System GEOMAT v1.0 · Geofrut SpA
   Misma paleta y estructura que Login.razor.css
   ============================================================ */

/* ============================================================
   ANIMACIONES
   ============================================================ */

@keyframes fadeInLeft-b-9bwpci7x7s {
    from {
        opacity: 0;
        transform: translateX(-40px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeInUp-b-9bwpci7x7s {
    from {
        opacity: 0;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes float-b-9bwpci7x7s {
    0%, 100% { transform: translateY(0px); }
    50%       { transform: translateY(-14px); }
}

@keyframes shake-b-9bwpci7x7s {
    0%, 100% { transform: translateX(0); }
    15%       { transform: translateX(-6px); }
    30%       { transform: translateX(6px); }
    45%       { transform: translateX(-5px); }
    60%       { transform: translateX(5px); }
    75%       { transform: translateX(-3px); }
    90%       { transform: translateX(3px); }
}

@keyframes spin-b-9bwpci7x7s {
    to { transform: rotate(360deg); }
}

/* ============================================================
   LAYOUT RAÍZ
   ============================================================ */

.setup-root[b-9bwpci7x7s] {
    display: flex;
    height: 100vh;
    overflow: hidden;
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
}

/* ============================================================
   PANEL IZQUIERDO — verde (idéntico a Login)
   ============================================================ */

.panel-left[b-9bwpci7x7s] {
    width: 40%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;

    background-image:
        radial-gradient(circle, rgba(255,255,255,0.07) 1px, transparent 1px),
        linear-gradient(160deg, #1a3d1a 0%, #2d6a2d 60%, #3d8b3d 100%);
    background-size: 24px 24px, 100% 100%;

    animation: fadeInLeft-b-9bwpci7x7s 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.panel-left-inner[b-9bwpci7x7s] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    z-index: 1;
    text-align: center;
    padding: 0 32px;
}

.leaf-wrapper[b-9bwpci7x7s] {
    animation: float-b-9bwpci7x7s 3s ease-in-out infinite;
    margin-bottom: 20px;
}

.leaf-icon[b-9bwpci7x7s] {
    width: 120px;
    height: 120px;
    display: block;
    filter: drop-shadow(0 0 24px rgba(255,255,255,0.15));
}

.panel-left-divider[b-9bwpci7x7s] {
    width: 48px;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.2);
    margin-bottom: 16px;
}

.panel-left-brand[b-9bwpci7x7s] {
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 16px;
}

.panel-left-tagline[b-9bwpci7x7s] {
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
    font-size: 13px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.55);
    line-height: 1.6;
    max-width: 240px;
    margin: 0;
}

/* ============================================================
   PANEL DERECHO — claro
   ============================================================ */

.panel-right[b-9bwpci7x7s] {
    flex: 1;
    background-color: #f8faf5;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 40px;
    position: relative;
    overflow-y: auto;
}

.panel-right-inner[b-9bwpci7x7s] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 420px;
}

/* ============================================================
   CARD DE SETUP
   ============================================================ */

.setup-card[b-9bwpci7x7s] {
    background-color: #ffffff;
    border-radius: 16px;
    padding: 40px;
    width: 100%;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);

    animation: fadeInUp-b-9bwpci7x7s 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.setup-card.shake[b-9bwpci7x7s] {
    animation: shake-b-9bwpci7x7s 0.4s ease both;
}

/* ============================================================
   BADGE — naranja suave (configuración inicial)
   ============================================================ */

.setup-badge[b-9bwpci7x7s] {
    display: inline-block;
    background: #fff7ed;
    color: #c2410c;
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 99px;
    margin-bottom: 16px;
}

/* ============================================================
   TIPOGRAFÍA CARD
   ============================================================ */

.setup-title[b-9bwpci7x7s] {
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
    font-size: 24px;
    font-weight: 700;
    color: #1a2e1a;
    margin: 0 0 8px 0;
    line-height: 1.2;
}

.setup-subtitle[b-9bwpci7x7s] {
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
    font-size: 13px;
    font-weight: 400;
    color: #6b8f6b;
    margin: 0 0 20px 0;
    line-height: 1.5;
}

.setup-divider[b-9bwpci7x7s] {
    width: 100%;
    height: 1px;
    background-color: #2d6a2d;
    opacity: 0.18;
    margin-bottom: 24px;
}

/* ============================================================
   FORMULARIO
   ============================================================ */

.form-group[b-9bwpci7x7s] {
    margin-bottom: 20px;
}

.form-label[b-9bwpci7x7s] {
    display: block;
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
    font-size: 12px;
    font-weight: 600;
    color: #3a5a3a;
    margin-bottom: 6px;
    letter-spacing: 0.01em;
}

.form-input[b-9bwpci7x7s] {
    display: block;
    width: 100%;
    box-sizing: border-box;
    background-color: #ffffff !important;
    border: 1px solid #c8e6c9;
    border-radius: 8px;
    padding: 12px 16px;
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
    font-size: 14px;
    color: #1a2e1a;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
}

.form-input[b-9bwpci7x7s]::placeholder {
    color: #a8c5a8;
}

.form-input:focus[b-9bwpci7x7s] {
    border-color: #2d6a2d;
    box-shadow: 0 0 0 3px rgba(45, 106, 45, 0.12);
    outline: none;
}

.form-input:disabled[b-9bwpci7x7s] {
    opacity: 0.6;
    cursor: not-allowed;
    background-color: #f4f8f4 !important;
}

/* ============================================================
   MENSAJES DE ESTADO
   ============================================================ */

.error-box[b-9bwpci7x7s] {
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 20px;
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
    font-size: 13px;
    color: #dc2626;
    line-height: 1.5;
}

.success-box[b-9bwpci7x7s] {
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 20px;
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
    font-size: 13px;
    color: #166534;
    line-height: 1.5;
    font-weight: 500;
}

/* ============================================================
   BOTÓN CREAR ADMINISTRADOR
   ============================================================ */

.btn-setup[b-9bwpci7x7s] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    background-color: #2d6a2d !important;
    color: #ffffff !important;
    border: none;
    border-radius: 8px;
    padding: 14px 24px;
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
    margin-top: 8px;
    letter-spacing: 0.01em;
}

.btn-setup:hover:not(:disabled)[b-9bwpci7x7s] {
    background-color: #1a3d1a !important;
    box-shadow: 0 6px 20px -4px rgba(29, 61, 29, 0.38);
    transform: translateY(-1px);
}

.btn-setup:active:not(:disabled)[b-9bwpci7x7s] {
    transform: translateY(0);
    box-shadow: none;
}

.btn-setup:disabled[b-9bwpci7x7s] {
    opacity: 0.7;
    cursor: not-allowed;
    background-color: #4a8a4a !important;
    transform: none;
}

/* Spinner CSS puro */
.btn-spinner[b-9bwpci7x7s] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin-b-9bwpci7x7s 0.7s linear infinite;
    flex-shrink: 0;
}

/* ============================================================
   FOOTER DE CARD
   ============================================================ */

.setup-footer[b-9bwpci7x7s] {
    margin-top: 24px;
    text-align: center;
}

.link-back[b-9bwpci7x7s] {
    font-family: var(--font-ui, 'Geist', -apple-system, sans-serif);
    font-size: 13px;
    font-weight: 400;
    color: #6b8f6b;
    text-decoration: none;
    transition: color 0.2s ease;
}

.link-back:hover[b-9bwpci7x7s] {
    color: #2d6a2d;
    text-decoration: none;
}

/* ============================================================
   RESPONSIVE — mobile (columna única)
   ============================================================ */

@media (max-width: 768px) {
    .setup-root[b-9bwpci7x7s] {
        flex-direction: column;
        height: auto;
        min-height: 100vh;
        overflow: auto;
    }

    .panel-left[b-9bwpci7x7s] {
        width: 100%;
        height: 30vh;
        min-height: 200px;
        animation: none;
        opacity: 1;
    }

    .leaf-icon[b-9bwpci7x7s] {
        width: 70px;
        height: 70px;
    }

    .panel-left-tagline[b-9bwpci7x7s] {
        display: none;
    }

    .panel-right[b-9bwpci7x7s] {
        flex: 1;
        padding: 32px 20px;
        overflow-y: visible;
    }

    .setup-card[b-9bwpci7x7s] {
        padding: 28px 24px;
        border-radius: 12px;
    }

    .setup-title[b-9bwpci7x7s] {
        font-size: 20px;
    }
}
/* _content/justtrade.geomat.componentes/Pages/Welcome.razor.rz.scp.css */
/* ============================================================
   GEOMAT — Welcome Screen (redesign 2025)
   Design System GEOMAT v1.0 · Geofrut SpA
   ============================================================ */

/* --- Tokens locales --- */
:root[b-m449pznzdc] {
    --w-green-deep:   #1a3d1a;
    --w-green-mid:    #2d6a2d;
    --w-green-light:  #3d8b3d;
    --w-bg:           #f8faf5;
    --w-text:         #1a2e1a;
    --w-muted:        #6b8f6b;
    --w-desc:         #4a6b4a;
    --w-badge-bg:     #e8f5e9;
    --w-badge-color:  #2d6a2d;
    --w-footer:       #a0baa0;
    --font-ui:        'Segoe UI', system-ui, -apple-system, sans-serif;
    --font-display:   'Segoe UI', system-ui, -apple-system, sans-serif;
}

/* ============================================================
   ANIMACIONES
   ============================================================ */

@keyframes fadeInLeft-b-m449pznzdc {
    from {
        opacity: 0;
        transform: translateX(-40px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeInRight-b-m449pznzdc {
    from {
        opacity: 0;
        transform: translateX(40px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes float-b-m449pznzdc {
    0%, 100% { transform: translateY(0px); }
    50%       { transform: translateY(-14px); }
}

@keyframes subtitleReveal-b-m449pznzdc {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes ctaSlide-b-m449pznzdc {
    from {
        opacity: 0;
        transform: translateY(14px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ============================================================
   LAYOUT RAÍZ
   ============================================================ */

.welcome-root[b-m449pznzdc] {
    display: flex;
    height: 100vh;
    overflow: hidden;
    font-family: var(--font-ui);
}

/* ============================================================
   PANEL IZQUIERDO — verde
   ============================================================ */

.panel-left[b-m449pznzdc] {
    width: 40%;
    flex-shrink: 0;
    background: linear-gradient(160deg, #1a3d1a 0%, #2d6a2d 60%, #3d8b3d 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;

    /* Patrón de puntos sutil */
    background-image:
        radial-gradient(circle, rgba(255,255,255,0.07) 1px, transparent 1px),
        linear-gradient(160deg, #1a3d1a 0%, #2d6a2d 60%, #3d8b3d 100%);
    background-size: 24px 24px, 100% 100%;

    animation: fadeInLeft-b-m449pznzdc 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.panel-left-inner[b-m449pznzdc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    z-index: 1;
}

.leaf-wrapper[b-m449pznzdc] {
    animation: float-b-m449pznzdc 3s ease-in-out infinite;
    margin-bottom: 20px;
}

.leaf-icon[b-m449pznzdc] {
    width: 120px;
    height: 120px;
    display: block;
    filter: drop-shadow(0 0 24px rgba(255,255,255,0.15));
}

.panel-left-divider[b-m449pznzdc] {
    width: 48px;
    height: 1px;
    background: rgba(255, 255, 255, 0.2);
    margin-bottom: 16px;
}

.panel-left-brand[b-m449pznzdc] {
    font-family: var(--font-ui);
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
}

/* ============================================================
   PANEL DERECHO — claro
   ============================================================ */

.panel-right[b-m449pznzdc] {
    flex: 1;
    background: var(--w-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 40px;
    position: relative;

    animation: fadeInRight-b-m449pznzdc 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.panel-right-inner[b-m449pznzdc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 100%;
    max-width: 420px;
}

/* ============================================================
   BADGE
   ============================================================ */

.version-badge[b-m449pznzdc] {
    display: inline-block;
    background: var(--w-badge-bg);
    color: var(--w-badge-color);
    font-family: var(--font-ui);
    font-size: 11px;
    font-weight: 500;
    padding: 4px 12px;
    border-radius: 99px;
    letter-spacing: 0.04em;
    margin-bottom: 24px;
}

/* ============================================================
   TIPOGRAFÍA
   ============================================================ */

.hero-title[b-m449pznzdc] {
    font-family: var(--font-display);
    font-size: clamp(52px, 8vw, 80px);
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--w-text);
    margin: 0 0 12px 0;
    line-height: 1;
}

.hero-subtitle[b-m449pznzdc] {
    font-family: var(--font-ui);
    font-size: 13px;
    font-weight: 400;
    color: var(--w-muted);
    margin: 0;
    letter-spacing: 0.02em;

    animation: subtitleReveal-b-m449pznzdc 0.6s ease both;
    animation-delay: 0.5s;
    opacity: 0;
    animation-fill-mode: forwards;
}

.divider[b-m449pznzdc] {
    width: 40px;
    height: 2px;
    background: var(--w-green-mid);
    margin: 24px auto;
    border-radius: 2px;
    flex-shrink: 0;
}

.hero-description[b-m449pznzdc] {
    font-family: var(--font-ui);
    font-size: 14px;
    font-weight: 400;
    color: var(--w-desc);
    line-height: 1.7;
    max-width: 340px;
    margin: 0 0 32px 0;
}

/* ============================================================
   BOTÓN CTA
   ============================================================ */

.btn-cta[b-m449pznzdc] {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    background-color: #2d6a2d !important;
    color: #ffffff !important;
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 14px;
    font-weight: 600;
    padding: 14px 32px;
    border-radius: 10px;
    text-decoration: none !important;
    border: 2px solid #2d6a2d !important;
    cursor: pointer;
    transition:
        background-color 0.25s ease,
        transform        0.25s ease,
        box-shadow       0.25s ease;

    animation: ctaSlide-b-m449pznzdc 0.5s ease both;
    animation-delay: 0.8s;
    opacity: 0;
    animation-fill-mode: forwards;
}

.btn-cta:hover[b-m449pznzdc],
.btn-cta:focus-visible[b-m449pznzdc] {
    background-color: #1a3d1a !important;
    border-color: #1a3d1a !important;
    color: #ffffff !important;
    transform: scale(1.02);
    box-shadow: 0 8px 24px -6px rgba(29, 61, 29, 0.40);
    outline: none;
    text-decoration: none !important;
}

.btn-cta:active[b-m449pznzdc] {
    transform: scale(0.99);
}

/* ============================================================
   FOOTER
   ============================================================ */

.welcome-footer[b-m449pznzdc] {
    margin-top: 40px;
    font-family: var(--font-ui);
    font-size: 11px;
    font-weight: 400;
    color: var(--w-footer);
    letter-spacing: 0.02em;
}

/* ============================================================
   RESPONSIVE — mobile (columna única)
   ============================================================ */

@media (max-width: 768px) {
    .welcome-root[b-m449pznzdc] {
        flex-direction: column;
        height: auto;
        min-height: 100vh;
        overflow: auto;
    }

    .panel-left[b-m449pznzdc] {
        width: 100%;
        height: 30vh;
        min-height: 200px;
        animation: none;
        opacity: 1;
    }

    .leaf-icon[b-m449pznzdc] {
        width: 80px;
        height: 80px;
    }

    .panel-right[b-m449pznzdc] {
        flex: 1;
        padding: 40px 24px;
        animation: none;
        opacity: 1;
    }

    .hero-title[b-m449pznzdc] {
        font-size: 52px;
    }

    .btn-cta[b-m449pznzdc] {
        width: 100%;
        text-align: center;
    }
}
/* _content/justtrade.geomat.componentes/Parametros/GestionMenu.razor.rz.scp.css */
/* ── Page header ──────────────────────────────────────────────────────────── */
.gm-page-header[b-4ezhs44dz3] {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    padding: 28px 32px 20px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #e0e7ef !important;
}

.gm-page-header__info[b-4ezhs44dz3] {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.gm-page-title[b-4ezhs44dz3] {
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 21px !important;
    font-weight: 600 !important;
    color: #1a2332 !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

.gm-page-subtitle[b-4ezhs44dz3] {
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    color: #546e7a !important;
    margin: 0 !important;
}

/* ── Buttons ──────────────────────────────────────────────────────────────── */
.gm-btn-primary[b-4ezhs44dz3] {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #0D3D26 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 9px 16px !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: background 0.15s !important;
}

.gm-btn-primary:hover:not(:disabled)[b-4ezhs44dz3] {
    background: #082A19 !important;
}

.gm-btn-primary:disabled[b-4ezhs44dz3] {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

.gm-btn-secondary[b-4ezhs44dz3] {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #ffffff !important;
    color: #1a2332 !important;
    border: 1px solid #e0e7ef !important;
    border-radius: 6px !important;
    padding: 9px 16px !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: background 0.15s !important;
}

.gm-btn-secondary:hover:not(:disabled)[b-4ezhs44dz3] {
    background: #f5f7fa !important;
}

.gm-btn-secondary:disabled[b-4ezhs44dz3] {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

.gm-btn-danger[b-4ezhs44dz3] {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #A82A2A !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 9px 16px !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: background 0.15s !important;
}

.gm-btn-danger:hover[b-4ezhs44dz3] {
    background: #8b2222 !important;
}

.gm-btn-icon[b-4ezhs44dz3] {
    font-size: 16px !important;
    line-height: 1 !important;
}

/* ── Spinner ─────────────────────────────────────────────────────────────── */
.gm-spinner-wrap[b-4ezhs44dz3] {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 60px 0 !important;
    gap: 14px !important;
}

.gm-spinner[b-4ezhs44dz3] {
    width: 36px !important;
    height: 36px !important;
    border: 3px solid #e0e7ef !important;
    border-top-color: #4AAD6B !important;
    border-radius: 50% !important;
    animation: gm-spin-b-4ezhs44dz3 0.75s linear infinite !important;
}

@keyframes gm-spin-b-4ezhs44dz3 {
    to { transform: rotate(360deg); }
}

.gm-spinner-label[b-4ezhs44dz3] {
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    color: #546e7a !important;
}

/* ── Error banner ─────────────────────────────────────────────────────────── */
.gm-error-banner[b-4ezhs44dz3] {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 16px 32px !important;
    padding: 12px 16px !important;
    background: #FBE9E9 !important;
    border: 1px solid #f0b8b8 !important;
    border-radius: 6px !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    color: #A82A2A !important;
}

.gm-error-icon[b-4ezhs44dz3] {
    font-size: 16px !important;
}

/* ── Grid wrapper ─────────────────────────────────────────────────────────── */
.gm-grid-wrap[b-4ezhs44dz3] {
    padding: 20px 32px !important;
}

/* Syncfusion grid overrides */
.gm-grid-wrap[b-4ezhs44dz3]  .e-grid .e-headercell {
    background: #FAFBFA !important;
    color: #546e7a !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    border-bottom: 1px solid #e0e7ef !important;
}

.gm-grid-wrap[b-4ezhs44dz3]  .e-grid .e-rowcell {
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    color: #1a2332 !important;
    border-bottom: 1px solid #e0e7ef !important;
    padding: 9px 10px !important;
}

.gm-grid-wrap[b-4ezhs44dz3]  .e-grid .e-row:hover .e-rowcell {
    background: #FAFBFA !important;
}

.gm-grid-wrap[b-4ezhs44dz3]  .e-grid {
    border: 1px solid #e0e7ef !important;
    border-radius: 6px !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
}

.gm-grid-wrap[b-4ezhs44dz3]  .e-grid .e-toolbar {
    background: #ffffff !important;
    border-bottom: 1px solid #e0e7ef !important;
}

.gm-grid-wrap[b-4ezhs44dz3]  .e-pager {
    background: #ffffff !important;
    border-top: 1px solid #e0e7ef !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 12px !important;
}

.gm-grid-wrap[b-4ezhs44dz3]  .e-pager .e-currentitem {
    background: #0D3D26 !important;
    color: #ffffff !important;
    border-color: #0D3D26 !important;
}

/* ── Row action buttons ───────────────────────────────────────────────────── */
.gm-row-actions[b-4ezhs44dz3] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
}

.gm-action-btn[b-4ezhs44dz3] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    font-size: 14px !important;
    transition: background 0.15s !important;
}

.gm-action-btn--edit[b-4ezhs44dz3] {
    background: #E4EEF5 !important;
    color: #1F5A82 !important;
}

.gm-action-btn--edit:hover[b-4ezhs44dz3] {
    background: #c8ddef !important;
}

.gm-action-btn--delete[b-4ezhs44dz3] {
    background: #FBE9E9 !important;
    color: #A82A2A !important;
}

.gm-action-btn--delete:hover[b-4ezhs44dz3] {
    background: #f5d0d0 !important;
}

/* ── Dialog overrides ─────────────────────────────────────────────────────── */
[b-4ezhs44dz3] .gm-dialog .e-dlg-header-content {
    background: #0D3D26 !important;
    border-radius: 8px 8px 0 0 !important;
    padding: 16px 20px !important;
}

[b-4ezhs44dz3] .gm-dialog .e-dlg-header-content .e-dlg-header,
[b-4ezhs44dz3] .gm-dialog .e-dlg-header-content .e-icon-dlg-close {
    color: #ffffff !important;
}

[b-4ezhs44dz3] .gm-dialog .e-dlg-content {
    padding: 20px !important;
    background: #ffffff !important;
}

[b-4ezhs44dz3] .gm-dialog .e-footer-content {
    padding: 14px 20px !important;
    background: #f5f7fa !important;
    border-top: 1px solid #e0e7ef !important;
    border-radius: 0 0 8px 8px !important;
}

[b-4ezhs44dz3] .gm-dialog .e-dialog {
    border-radius: 8px !important;
    border: 1px solid #e0e7ef !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.14) !important;
}

.gm-dialog-title[b-4ezhs44dz3] {
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
}

.gm-dialog-title--danger[b-4ezhs44dz3] {
    color: #ffffff !important;
}

/* ── Form grid ────────────────────────────────────────────────────────────── */
.gm-form-grid[b-4ezhs44dz3] {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 16px 20px !important;
}

.gm-form-field[b-4ezhs44dz3] {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
}

.gm-form-field--full[b-4ezhs44dz3] {
    grid-column: 1 / -1 !important;
}

.gm-form-field--check[b-4ezhs44dz3] {
    justify-content: flex-end !important;
    padding-bottom: 6px !important;
}

.gm-label[b-4ezhs44dz3] {
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    color: #546e7a !important;
}

.gm-required[b-4ezhs44dz3] {
    color: #A82A2A !important;
}

/* Syncfusion input overrides dentro del dialog */
[b-4ezhs44dz3] .gm-input.e-input-group,
[b-4ezhs44dz3] .gm-input.e-numerictextbox {
    border: 1px solid #e0e7ef !important;
    border-radius: 6px !important;
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    background: #ffffff !important;
}

[b-4ezhs44dz3] .gm-input.e-input-group:focus-within {
    border-color: #4AAD6B !important;
    box-shadow: 0 0 0 3px rgba(74,173,107,0.15) !important;
}

[b-4ezhs44dz3] .gm-textarea .e-multi-line-input {
    min-height: 72px !important;
}

[b-4ezhs44dz3] .gm-checkbox .e-checkbox-wrapper .e-frame.e-check {
    background: #4AAD6B !important;
    border-color: #4AAD6B !important;
}

/* ── Dialog footer ────────────────────────────────────────────────────────── */
.gm-dialog-footer[b-4ezhs44dz3] {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
}

/* ── Confirm dialog ───────────────────────────────────────────────────────── */
[b-4ezhs44dz3] .gm-dialog--confirm .e-dlg-header-content {
    background: #A82A2A !important;
}

.gm-confirm-msg[b-4ezhs44dz3] {
    font-family: 'Geist', -apple-system, sans-serif !important;
    font-size: 13px !important;
    color: #1a2332 !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}

/* ── Button spinner ───────────────────────────────────────────────────────── */
.gm-btn-spinner[b-4ezhs44dz3] {
    display: inline-block !important;
    width: 13px !important;
    height: 13px !important;
    border: 2px solid rgba(255,255,255,0.4) !important;
    border-top-color: #ffffff !important;
    border-radius: 50% !important;
    animation: gm-spin-b-4ezhs44dz3 0.75s linear infinite !important;
    margin-right: 4px !important;
}
/* _content/justtrade.geomat.componentes/Shared/GeoToast.razor.rz.scp.css */
/* ── Error toast — template interno ───────────────────────────────────────── */

/* Contenedor del toast de error: ancho fijo, alto máximo 90vh */
[b-2tldfxuoi3] .geo-toast-error.e-toast-container .e-toast {
    width: min(460px, 90vw) !important;
    max-width: 90vw !important;
    max-height: 90vh !important;
    display: flex !important;
    flex-direction: column !important;
}

/* El área de contenido del toast debe crecer y tener scroll */
[b-2tldfxuoi3] .geo-toast-error.e-toast-container .e-toast .e-toast-message {
    flex: 1 1 auto !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
}

[b-2tldfxuoi3] .geo-toast-error.e-toast-container .e-toast .e-toast-content {
    flex: 1 1 auto !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
}

/* Cuerpo del template: texto scrollable + botón copiar */
[b-2tldfxuoi3] .geo-toast-error .geo-toast-error-body {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    height: 100% !important;
    min-height: 0 !important;
}

/* Texto del error — ocupa el espacio disponible, con scroll */
[b-2tldfxuoi3] .geo-toast-error .geo-toast-error-text {
    margin: 0 !important;
    flex: 1 1 auto !important;
    min-height: 80px !important;
    max-height: calc(90vh - 140px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    white-space: normal !important;
    word-break: break-word !important;
    font-family: 'Cascadia Code', 'Consolas', monospace !important;
    font-size: 11.5px !important;
    line-height: 1.6 !important;
    color: inherit !important;
    background: rgba(0, 0, 0, 0.12) !important;
    border-radius: 6px !important;
    padding: 10px 12px !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(255,255,255,0.3) transparent !important;
}

/* Scrollbar webkit */
[b-2tldfxuoi3] .geo-toast-error .geo-toast-error-text::-webkit-scrollbar {
    width: 5px !important;
}
[b-2tldfxuoi3] .geo-toast-error .geo-toast-error-text::-webkit-scrollbar-track {
    background: transparent !important;
}
[b-2tldfxuoi3] .geo-toast-error .geo-toast-error-text::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.3) !important;
    border-radius: 3px !important;
}

/* ── Botón copiar — rediseñado ─────────────────────────────────────────────── */
[b-2tldfxuoi3] .geo-toast-error .geo-toast-copy-btn {
    flex-shrink: 0 !important;
    align-self: flex-end !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 6px 14px !important;
    background: rgba(255, 255, 255, 0.18) !important;
    border: 1.5px solid rgba(255, 255, 255, 0.35) !important;
    border-radius: 6px !important;
    color: inherit !important;
    font-family: -apple-system, 'Segoe UI', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
    cursor: pointer !important;
    transition: background 0.15s, border-color 0.15s, transform 0.1s !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
}

[b-2tldfxuoi3] .geo-toast-error .geo-toast-copy-btn:hover {
    background: rgba(255, 255, 255, 0.28) !important;
    border-color: rgba(255, 255, 255, 0.55) !important;
}

[b-2tldfxuoi3] .geo-toast-error .geo-toast-copy-btn:active {
    transform: scale(0.96) !important;
}
