﻿:root {
    --ra-green: #124734;
    --ra-green-soft: #1c5a42;
    --ra-olive: #A8AD00;
    --ra-blue: #007581;
    --ra-brown: #64513D;
    --ra-bg: #f4f6f3;
    --ra-surface: #ffffff;
    --ra-surface-soft: #f8faf8;
    --ra-border: #d9e4dc;
    --ra-text: #1f2a24;
    --ra-text-muted: #5f6f66;
    --ra-white: #ffffff;
    --ra-danger: #b42318;
    --ra-warning: #bf8400;
    --ra-shadow: 0 10px 30px rgba(18, 71, 52, 0.10);
    --ra-shadow-soft: 0 6px 18px rgba(18, 71, 52, 0.08);
    --ra-radius-lg: 18px;
    --ra-radius-md: 12px;
    --ra-radius-sm: 10px;
}

/* =========================
   BASE
========================= */
html, body {
    margin: 0;
    padding: 0;
    background-color: var(--ra-bg);
    color: var(--ra-text);
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

*, *::before, *::after {
    box-sizing: border-box;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
}

.page {
    min-height: 100vh;
}

/* =========================
   UTILIDADES
========================= */
.ra-page-title {
    font-size: clamp(2rem, 2.8vw, 2.9rem);
    line-height: 1.05;
    font-weight: 900;
    color: var(--ra-green);
    margin: 0;
    max-width: 12ch;
    text-wrap: balance;
}

.ra-page-subtitle {
    margin: 0;
    color: var(--ra-text-muted);
    font-size: 1rem;
    line-height: 1.6;
    max-width: 72ch;
}

.ra-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    margin: 0 0 .7rem;
    padding: .36rem .72rem;
    border: 1px solid rgba(18, 71, 52, 0.12);
    border-radius: 999px;
    background: rgba(18, 71, 52, 0.06);
    color: var(--ra-green);
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    width: fit-content;
}

.ra-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.25rem;
    align-items: end;
    padding: 1.4rem 1.45rem 1.35rem;
    margin-bottom: 1.5rem;
    border: 1px solid rgba(18, 71, 52, 0.1);
    border-radius: 24px;
    background:
        linear-gradient(135deg, rgba(255,255,255,0.98) 0%, rgba(248,250,248,0.98) 72%, rgba(0,117,129,0.05) 100%);
    box-shadow: 0 16px 36px rgba(18, 71, 52, 0.08);
    overflow: hidden;
}

.ra-hero::before,
.ra-page-header::before {
    content: "";
    position: absolute;
    left: 1.45rem;
    top: 0;
    width: 78px;
    height: 4px;
    border-radius: 999px;
    background: var(--ra-blue);
}

.ra-hero > div:first-child {
    min-width: 0;
}

.ra-hero h1 {
    margin: 0;
    font-size: clamp(2.15rem, 3.2vw, 3.35rem);
    line-height: 1.02;
    font-weight: 900;
    color: var(--ra-green);
    max-width: 14ch;
    text-wrap: balance;
}

.ra-hero-subtitle {
    margin: .8rem 0 0;
    color: var(--ra-text-muted);
    font-size: 1rem;
    line-height: 1.65;
    max-width: 74ch;
}

.ra-hero-actions {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: .8rem;
    min-width: min(100%, 420px);
}

.ra-card {
    background: var(--ra-surface);
    border: 1px solid var(--ra-border);
    border-radius: var(--ra-radius-lg);
    box-shadow: var(--ra-shadow-soft);
    padding: 1.25rem;
}

.ra-card-title {
    font-size: 1.06rem;
    font-weight: 800;
    color: var(--ra-green);
    margin-bottom: .85rem;
}

.ra-empty-state {
    background: #fff8e6;
    color: #7a5d00;
    border: 1px solid #f0dfa8;
    border-radius: var(--ra-radius-md);
    padding: 1rem 1.1rem;
}

.ra-page {
    width: 100%;
    max-width: 1320px;
    margin-inline: auto;
}

.ra-page > *,
.ra-hero > *,
.ra-page-header > *,
.ra-card > *,
.ra-detail-layout > *,
.ra-dashboard-grid > *,
.ra-card-grid > *,
.ra-filter-grid > *,
.ra-toolbar-grid > *,
.ra-form-grid > * {
    min-width: 0;
}

.ra-toolbar,
.ra-action-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
}

.ra-filter-grid,
.ra-card-grid,
.ra-dashboard-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.ra-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.ra-dashboard-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.ra-table-responsive,
.table-responsive {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    border-radius: 16px;
}

.ra-table-responsive > table,
.table-responsive > table {
    min-width: 100%;
}

.ra-card-list,
.ra-mobile-list {
    display: grid;
    gap: 1rem;
}

.ra-mobile-card {
    border: 1px solid var(--ra-border);
    border-radius: 16px;
    background: var(--ra-surface);
    box-shadow: var(--ra-shadow-soft);
    padding: 1rem;
}

.ra-card-actions,
.ra-mobile-actions,
.ra-row-actions,
.ra-table-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .6rem;
}

.ra-card-actions,
.ra-mobile-actions {
    margin-top: 1rem;
}

.ra-modal-body {
    max-height: min(72vh, 720px);
    overflow-y: auto;
    overflow-x: hidden;
}

.ra-mobile-stack {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ra-calendar-wrapper,
.ra-kanban-wrapper {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    padding-bottom: .2rem;
}

/* =========================
   FORMULARIOS
========================= */
.ra-form-label {
    font-weight: 700;
    color: var(--ra-text);
    margin-bottom: .45rem;
    font-size: .92rem;
    display: inline-block;
}

.ra-input {
    width: 100%;
    min-height: 46px;
    border-radius: var(--ra-radius-sm);
    border: 1px solid var(--ra-border);
    padding: .72rem .9rem;
    background: var(--ra-white);
    color: var(--ra-text);
    outline: none;
    transition: border-color .18s ease, box-shadow .18s ease;
}

    .ra-input:focus {
        border-color: var(--ra-blue);
        box-shadow: 0 0 0 0.18rem rgba(0, 117, 129, 0.16);
    }

/* =========================
   BOTONES
========================= */
.btn,
button {
    font-family: inherit;
}

.ra-btn-primary,
.ra-solicitud-btn-primary,
.ra-header-action-btn {
    background: var(--ra-green);
    border: 1px solid var(--ra-green);
    color: var(--ra-white);
    border-radius: var(--ra-radius-sm);
    min-height: 44px;
    padding: .72rem 1rem;
    font-weight: 700;
    transition: all .18s ease;
}

    .ra-btn-primary:hover,
    .ra-solicitud-btn-primary:hover,
    .ra-header-action-btn:hover {
        background: var(--ra-green-soft);
        border-color: var(--ra-green-soft);
        color: var(--ra-white);
    }

.ra-btn-success {
    background: var(--ra-green);
    border: 1px solid var(--ra-green);
    color: var(--ra-white);
    border-radius: var(--ra-radius-sm);
    min-height: 44px;
    padding: .72rem 1rem;
    font-weight: 700;
    transition: all .18s ease;
}

    .ra-btn-success:hover {
        background: var(--ra-green-soft);
        border-color: var(--ra-green-soft);
        color: var(--ra-white);
    }

.ra-btn-secondary,
.ra-solicitud-btn-secondary {
    background: #eef3f1;
    border: 1px solid rgba(18, 71, 52, 0.14);
    color: var(--ra-text);
    border-radius: var(--ra-radius-sm);
    min-height: 44px;
    padding: .72rem 1rem;
    font-weight: 700;
    transition: all .18s ease;
}

    .ra-btn-secondary:hover,
    .ra-solicitud-btn-secondary:hover {
        background: #e5eeea;
        color: var(--ra-text);
    }

.ra-btn-back {
    background: #fd7e14;
    border: 1px solid #fd7e14;
    color: #fff;
    border-radius: var(--ra-radius-sm);
    min-height: 44px;
    padding: .72rem 1rem;
    font-weight: 700;
    transition: all .18s ease;
}

.ra-btn-back:hover {
        background: #e56e0d;
        border-color: #e56e0d;
        color: #fff;
    }

.ra-btn-danger {
    background: #c94a4a;
    border: 1px solid #c94a4a;
    color: #fff;
    border-radius: 12px;
    min-height: 44px;
    padding: .72rem 1rem;
    font-weight: 700;
    transition: all .18s ease;
}

    .ra-btn-danger:hover {
        background: #b13d3d;
        border-color: #b13d3d;
        color: #fff;
    }

    .ra-btn-danger:active {
        transform: scale(0.98);
    }

.ra-solicitud-btn-task {
    background: #e8f1ff;
    color: #2459a6;
    border: 1px solid rgba(36, 89, 166, 0.18);
}

    .ra-solicitud-btn-task:hover {
        background: #dce9ff;
        color: #1f4f95;
    }

.ra-page-actions {
    align-items: stretch;
    display: grid;
    gap: .75rem;
    width: 100%;
}

.ra-page-actions-primary,
.ra-page-actions-secondary {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
}

.ra-page-actions-primary .ra-btn,
.ra-page-actions-secondary .ra-btn {
    min-height: 44px;
}

.ra-page-actions-primary .ra-btn-primary,
.ra-page-actions-primary .ra-btn-success {
    box-shadow: var(--ra-shadow-soft);
}

.ra-page-actions-secondary {
    padding-top: .1rem;
}

/* =========================
   LOGIN
========================= */
.ra-auth-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    background: radial-gradient(circle at top left, rgba(168, 173, 0, 0.08), transparent 28%), radial-gradient(circle at bottom right, rgba(0, 117, 129, 0.10), transparent 28%), var(--ra-bg);
}

.ra-auth-card {
    width: 100%;
    max-width: 460px;
    background: var(--ra-surface);
    border: 1px solid var(--ra-border);
    border-radius: 22px;
    box-shadow: var(--ra-shadow);
    padding: 2rem;
}

.ra-auth-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 1.4rem;
}

.ra-auth-logo {
    display: block;
    width: auto;
    max-width: 280px;
    max-height: 140px;
    object-fit: contain;
    object-position: center;
    margin: 0 auto 1.15rem auto;
}

.ra-auth-title {
    font-size: 1.7rem;
    font-weight: 800;
    color: var(--ra-green);
    margin-bottom: .35rem;
}

.ra-auth-subtitle {
    color: var(--ra-text-muted);
    font-size: .96rem;
    margin: 0;
}

.ra-auth-footer {
    text-align: center;
    margin-top: 1rem;
    color: var(--ra-text-muted);
    font-size: .9rem;
}

.ra-alert-soft {
    border-radius: var(--ra-radius-md);
}

.ra-action-feedback {
    margin: 0;
    width: 100%;
}

.ra-action-feedback-title {
    font-weight: 700;
    margin-bottom: .25rem;
}

.ra-action-feedback-list {
    margin: .25rem 0 0;
    padding-left: 1.15rem;
}

/* =========================
   LAYOUT GENERAL
========================= */
.ra-layout-shell {
    min-height: 100vh;
    background: var(--ra-bg);
}

.ra-layout-topbar {
    background: linear-gradient(90deg, var(--ra-green) 0%, var(--ra-green-soft) 100%);
    color: var(--ra-white);
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 8px 22px rgba(18, 71, 52, 0.18);
}

.ra-layout-topbar-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: .9rem 1.1rem;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 1rem;
}

.ra-layout-left {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.ra-home-card-actions {
    display: flex;
    gap: .65rem;
    flex-wrap: wrap;
}

.ra-calendar-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.75fr) minmax(280px, 380px);
    gap: 1.35rem;
    align-items: start;
}

.ra-calendar-page {
    max-width: 1260px;
}

.ra-calendar-main,
.ra-calendar-side,
.ra-calendar-main-card,
.ra-calendar-responsive-surface,
.ra-calendar-filters {
    min-width: 0;
}

.ra-calendar-toolbar {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1rem;
}

.ra-calendar-toolbar-copy {
    text-align: center;
    min-width: 0;
    padding-inline: .35rem;
}

.ra-view-toggle {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    flex-wrap: wrap;
}

.ra-view-toggle-btn {
    min-height: 42px;
    padding: .7rem .95rem;
    border-radius: 12px;
    border: 1px solid rgba(18, 71, 52, 0.16);
    background: #eef3f1;
    color: var(--ra-text);
    font-weight: 700;
    transition: all .18s ease;
}

.ra-view-toggle-btn:hover {
    background: #e5eeea;
}

.ra-view-toggle-btn.active {
    background: var(--ra-green);
    border-color: var(--ra-green);
    color: var(--ra-white);
}

.ra-calendar-month {
    display: grid;
    gap: .8rem;
    min-width: 0;
}

.ra-calendar-month-mobile {
    display: none;
}

.ra-calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .6rem;
}

.ra-calendar-weekday {
    text-align: center;
    font-size: .82rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--ra-text-muted);
    padding: .35rem 0;
}

.ra-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .6rem;
}

.ra-calendar-day {
    min-height: 150px;
    border-radius: 16px;
    border: 1px solid var(--ra-border);
    background: linear-gradient(180deg, #ffffff 0%, #f7fbf8 100%);
    box-shadow: var(--ra-shadow-soft);
    padding: .8rem;
    display: flex;
    flex-direction: column;
    gap: .7rem;
    text-align: left;
    min-width: 0;
    overflow: hidden;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
    cursor: pointer;
}

.ra-calendar-day:hover {
    transform: translateY(-1px);
    border-color: rgba(0, 117, 129, 0.28);
    box-shadow: 0 10px 24px rgba(18, 71, 52, 0.10);
}

.ra-calendar-day.is-muted {
    opacity: .55;
    background: #f4f6f3;
}

.ra-calendar-day.is-today {
    border-color: rgba(18, 71, 52, 0.34);
}

.ra-calendar-day.is-selected {
    border-color: var(--ra-blue);
    box-shadow: 0 0 0 0.18rem rgba(0, 117, 129, 0.14);
}

.ra-calendar-day.has-reservas {
    background: linear-gradient(180deg, rgba(0, 117, 129, 0.06) 0%, #ffffff 100%);
}

.ra-calendar-day-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

.ra-calendar-day-indicator {
    display: none;
}

.ra-calendar-day-number {
    font-size: 1rem;
    font-weight: 800;
    color: var(--ra-green);
}

.ra-calendar-day-count {
    min-width: 26px;
    height: 26px;
    padding: 0 .45rem;
    border-radius: 999px;
    background: rgba(18, 71, 52, 0.10);
    color: var(--ra-green);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .76rem;
    font-weight: 800;
}

.ra-calendar-day-items {
    display: grid;
    gap: .45rem;
    min-width: 0;
}

.ra-calendar-mobile-weekdays,
.ra-calendar-mobile-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.ra-calendar-mobile-weekdays {
    gap: .25rem;
    margin-bottom: .35rem;
}

.ra-calendar-mobile-weekday {
    text-align: center;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .01em;
    color: var(--ra-text-muted);
    padding: .18rem 0;
}

.ra-calendar-mobile-grid {
    gap: .25rem;
}

.ra-calendar-mobile-day {
    position: relative;
    min-width: 0;
    min-height: 60px;
    width: 100%;
    padding: .35rem .15rem .28rem;
    border: 1px solid rgba(18, 71, 52, 0.08);
    border-radius: 12px;
    background: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: .22rem;
    text-align: center;
    overflow: hidden;
}

.ra-calendar-mobile-day.is-muted {
    background: #eef2ee;
    color: var(--ra-text-muted);
}

.ra-calendar-mobile-day.is-today {
    border-color: rgba(18, 71, 52, 0.34);
}

.ra-calendar-mobile-day.is-selected {
    border-color: var(--ra-blue);
    box-shadow: 0 0 0 0.14rem rgba(0, 117, 129, 0.10);
}

.ra-calendar-mobile-day.has-reservas {
    background: linear-gradient(180deg, rgba(0, 117, 129, 0.05) 0%, #ffffff 100%);
}

.ra-calendar-mobile-number {
    font-size: .9rem;
    font-weight: 800;
    color: var(--ra-green);
    line-height: 1;
}

.ra-calendar-mobile-dot {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: var(--ra-blue);
    display: inline-flex;
}

.ra-calendar-mobile-count {
    position: absolute;
    top: .22rem;
    right: .15rem;
    min-width: 18px;
    height: 18px;
    border-radius: 999px;
    padding: 0 .18rem;
    background: rgba(18, 71, 52, 0.10);
    color: var(--ra-green);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .62rem;
    font-weight: 800;
}

.ra-calendar-pill {
    display: grid;
    gap: .12rem;
    padding: .45rem .55rem;
    border-radius: 12px;
    font-size: .76rem;
    border: 1px solid transparent;
    background: #f4f7f5;
    color: var(--ra-text);
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.ra-calendar-pill strong {
    font-size: .76rem;
    line-height: 1.2;
}

.ra-calendar-pill span {
    color: var(--ra-text-muted);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.ra-calendar-pill.is-confirmed {
    background: rgba(18, 71, 52, 0.10);
    border-color: rgba(18, 71, 52, 0.18);
}

.ra-calendar-pill.is-blocked {
    background: rgba(191, 132, 0, 0.10);
    border-color: rgba(191, 132, 0, 0.18);
}

.ra-calendar-pill.is-progress {
    background: rgba(0, 117, 129, 0.10);
    border-color: rgba(0, 117, 129, 0.18);
}

.ra-calendar-pill.is-quote,
.ra-calendar-pill.is-draft {
    background: rgba(100, 81, 61, 0.10);
    border-color: rgba(100, 81, 61, 0.18);
}

.ra-calendar-pill.is-cancelled,
.ra-calendar-pill.is-done {
    background: rgba(95, 111, 102, 0.10);
    border-color: rgba(95, 111, 102, 0.18);
}

.ra-calendar-more {
    font-size: .78rem;
    font-weight: 700;
    color: var(--ra-blue);
    padding-left: .15rem;
}

.ra-calendar-panel {
    position: sticky;
    top: 124px;
    max-height: calc(100vh - 148px);
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
}

.ra-calendar-list {
    display: grid;
    gap: .8rem;
}

.ra-calendar-list-view {
    display: grid;
    gap: .9rem;
}

.ra-calendar-list-card {
    width: 100%;
    border: 1px solid var(--ra-border);
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f8faf8 100%);
    padding: .9rem 1rem;
    text-align: left;
    display: grid;
    gap: .7rem;
    min-width: 0;
    box-shadow: var(--ra-shadow-soft);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.ra-calendar-list-card:hover {
    transform: translateY(-1px);
    border-color: rgba(0, 117, 129, 0.30);
}

.ra-calendar-list-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .85rem;
}

.ra-calendar-list-head-copy {
    min-width: 0;
}

.ra-calendar-list-head-copy strong,
.ra-calendar-list-body,
.ra-calendar-list-grid strong {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.ra-calendar-list-badges {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    justify-content: flex-end;
    align-items: center;
    min-width: 0;
    flex-shrink: 0;
}

.ra-calendar-list-body {
    display: grid;
    gap: .32rem;
    color: var(--ra-text);
    font-size: .9rem;
}

.ra-calendar-list-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

.ra-calendar-list-grid strong {
    display: block;
    margin-top: .15rem;
}

.ra-calendar-toolbar-year {
    grid-template-columns: auto 1fr auto;
}

.ra-calendar-toolbar-actions {
    display: flex;
    gap: .75rem;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.ra-calendar-year-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    min-width: 0;
}

.ra-calendar-year-month {
    display: grid;
    gap: .85rem;
    padding: 1rem;
}

.ra-calendar-year-month-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.ra-calendar-month-action {
    flex-shrink: 0;
    white-space: nowrap;
}

.ra-calendar-mini-weekdays,
.ra-calendar-mini-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .3rem;
}

.ra-calendar-filter-grid {
    align-items: end;
}

.ra-calendar-filter-actions {
    gap: .75rem;
}

.ra-calendar-mini-weekday {
    text-align: center;
    font-size: .72rem;
    font-weight: 800;
    color: var(--ra-text-muted);
    text-transform: uppercase;
}

.ra-calendar-mini-day {
    position: relative;
    min-height: 44px;
    border: 1px solid rgba(18, 71, 52, 0.08);
    border-radius: 12px;
    background: #fff;
    color: var(--ra-text);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: .25rem;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.ra-calendar-mini-day:hover {
    transform: translateY(-1px);
    border-color: rgba(0, 117, 129, 0.28);
    box-shadow: 0 8px 18px rgba(18, 71, 52, 0.08);
}

.ra-calendar-mini-day.is-muted {
    opacity: .38;
    background: #f5f6f4;
}

.ra-calendar-mini-day.is-today {
    border-color: rgba(18, 71, 52, 0.34);
}

.ra-calendar-mini-day.is-selected {
    border-color: var(--ra-blue);
    box-shadow: 0 0 0 0.16rem rgba(0, 117, 129, 0.12);
}

.ra-calendar-mini-day.has-reservas {
    background: linear-gradient(180deg, rgba(0, 117, 129, 0.08) 0%, #ffffff 100%);
}

.ra-calendar-mini-number {
    font-size: .84rem;
    font-weight: 800;
    color: var(--ra-green);
}

.ra-calendar-mini-count {
    position: absolute;
    right: 4px;
    top: 4px;
    min-width: 18px;
    height: 18px;
    padding: 0 .2rem;
    border-radius: 999px;
    background: rgba(18, 71, 52, 0.12);
    color: var(--ra-green);
    font-size: .66rem;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.ra-validation-link {
    width: 100%;
    text-align: left;
    background: #fff8e6;
    color: #7a5d00;
    border: 1px solid #f0dfa8;
    border-radius: 12px;
    padding: .75rem .85rem;
    font-weight: 600;
}

.ra-validation-link:hover {
    background: #fff2c5;
}

@media (max-width: 1100px) {
    .ra-calendar-shell {
        grid-template-columns: 1fr;
    }

    .ra-calendar-panel {
        position: static;
        max-height: none;
        overflow: visible;
    }

    .ra-calendar-year-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .ra-calendar-toolbar {
        grid-template-columns: 1fr;
        text-align: left;
    }

    .ra-calendar-toolbar-actions {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .ra-calendar-toolbar-copy {
        text-align: left;
        padding-inline: 0;
    }

    .ra-view-toggle {
        width: 100%;
        justify-content: center;
    }

    .ra-calendar-grid,
    .ra-calendar-weekdays {
        gap: .45rem;
    }

    .ra-calendar-day {
        min-height: 112px;
        padding: .6rem;
    }

    .ra-calendar-pill {
        padding: .38rem .45rem;
    }

    .ra-calendar-pill span {
        display: none;
    }

    .ra-calendar-list-grid {
        grid-template-columns: 1fr;
    }

    .ra-calendar-list-head {
        flex-direction: column;
        align-items: stretch;
    }

    .ra-calendar-list-badges {
        justify-content: flex-start;
    }

    .ra-calendar-year-grid {
        grid-template-columns: 1fr;
    }

    .ra-calendar-year-month-head {
        flex-direction: column;
        align-items: stretch;
    }

}

@media (max-width: 767.98px) {
    .ra-calendar-page,
    .ra-calendar-wrapper,
    .ra-calendar-responsive-surface,
    .ra-calendar-main,
    .ra-calendar-main-card {
        width: 100%;
        max-width: 100%;
        min-width: 0 !important;
        overflow-x: hidden;
    }

    .ra-calendar-month-desktop {
        display: none;
    }

    .ra-calendar-month-mobile {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }
}

@media (max-width: 576px) {
    .ra-home-card-actions {
        width: 100%;
        flex-direction: column;
    }

    .ra-calendar-year-month {
        padding: .85rem;
    }

    .ra-calendar-mini-day {
        min-height: 38px;
        border-radius: 10px;
    }

    .ra-calendar-mini-number {
        font-size: .78rem;
    }

    .ra-view-toggle {
        flex-direction: column;
        align-items: stretch;
    }

    .ra-calendar-filter-actions {
        align-items: stretch;
    }

    .ra-calendar-filter-actions .btn,
    .ra-calendar-toolbar-actions .btn {
        width: 100%;
    }
}

.ra-layout-brand {
    display: inline-flex;
    align-items: center;
    padding: .15rem 0;
    cursor: pointer;
    color: inherit;
}

.ra-layout-logo {
    height: 60px;
    width: auto;
    max-width: 290px;
    object-fit: contain;
}

.ra-menu-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.28);
    background: transparent;
    color: var(--ra-white);
    border-radius: 10px;
    padding: .55rem .8rem;
    font-size: 1.1rem;
    cursor: pointer;
}

    .ra-menu-toggle:hover {
        background: rgba(255, 255, 255, 0.10);
    }

.ra-layout-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    flex-wrap: wrap;
}

.ra-layout-nav-link {
    color: rgba(255, 255, 255, 0.92);
    text-decoration: none;
    padding: .72rem .95rem;
    border-radius: 10px;
    font-weight: 700;
    transition: all .18s ease;
}

    .ra-layout-nav-link:hover {
        color: var(--ra-white);
        background: rgba(255, 255, 255, 0.11);
    }

    .ra-layout-nav-link.active {
        background: var(--ra-white);
        color: var(--ra-green);
    }

.ra-layout-user {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
}

.ra-layout-nav-submenu a,
.ra-layout-nav-submenu a:link,
.ra-layout-nav-submenu a:visited {
    color: var(--ra-text) !important;
    text-decoration: none;
}

.ra-layout-nav-submenu a:hover,
.ra-layout-nav-submenu a.active {
    color: var(--ra-green) !important;
}

.ra-layout-user-info {
    display: flex;
    flex-direction: column;
    text-align: right;
    line-height: 1.15;
}

    .ra-layout-user-info strong {
        color: var(--ra-white);
        font-size: .96rem;
    }

    .ra-layout-user-info span {
        color: rgba(255, 255, 255, 0.84);
        font-size: .84rem;
    }

.ra-layout-logout-btn {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.34);
    color: var(--ra-white);
    border-radius: 10px;
    padding: .62rem .9rem;
    font-weight: 700;
    min-height: 42px;
}

.ra-layout-logout-btn:hover {
        background: rgba(255, 255, 255, 0.10);
        color: var(--ra-white);
    }

.ra-layout-logout-btn-danger {
    border-color: rgba(233, 120, 120, 0.68);
    background: rgba(167, 53, 53, 0.18);
    color: #fff3f3;
}

.ra-layout-logout-btn-danger:hover {
    background: rgba(182, 61, 61, 0.28);
    border-color: rgba(244, 149, 149, 0.82);
    color: #ffffff;
}

.ra-layout-modulebar {
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(6, 34, 24, 0.14);
    backdrop-filter: blur(8px);
}

.ra-layout-modulebar-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: .7rem 1.1rem .85rem;
    display: flex;
    align-items: center;
    gap: .65rem;
    overflow-x: auto;
    scrollbar-width: thin;
}

.ra-layout-module-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    padding: .62rem .92rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.94);
    font-size: .9rem;
    font-weight: 700;
    transition: all .18s ease;
}

    .ra-layout-module-link:hover {
        background: rgba(255, 255, 255, 0.16);
        color: var(--ra-white);
    }

    .ra-layout-module-link.active {
        background: var(--ra-white);
        color: var(--ra-green);
        border-color: var(--ra-white);
    }

.ra-layout-main {
    width: min(100%, 1320px);
    max-width: 1320px;
    margin: 0 auto;
    padding: 1.5rem 1.1rem 2rem;
}

.ra-layout-main-auth {
    max-width: none;
    margin: 0;
    padding: 0;
}

/* =========================
   HOME / DASHBOARD
========================= */
.ra-home {
    width: 100%;
}

.ra-user-data p,
.ra-user-data-compact p {
    margin: 0 0 .7rem;
    color: var(--ra-text);
    line-height: 1.45;
}

.ra-badge-role,
.ra-badge-area {
    display: inline-flex;
    align-items: center;
    padding: .38rem .72rem;
    border-radius: 999px;
    font-size: .85rem;
    font-weight: 700;
    margin-right: .35rem;
    margin-bottom: .35rem;
}

.ra-badge-role {
    background: rgba(0, 117, 129, 0.12);
    color: var(--ra-blue);
}

.ra-badge-area {
    background: rgba(168, 173, 0, 0.17);
    color: #6a6d00;
}

.ra-module-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 1rem;
}

.ra-module-card {
    border-radius: 20px;
    color: var(--ra-white);
    padding: 1.25rem;
    min-height: 185px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: var(--ra-shadow);
}

    .ra-module-card h5 {
        font-size: 1.08rem;
        font-weight: 800;
        margin-bottom: .55rem;
    }

    .ra-module-card p {
        margin: 0;
        opacity: .96;
        font-size: .94rem;
        line-height: 1.5;
    }

.ra-module-green {
    background: linear-gradient(180deg, #16523d 0%, #124734 100%);
}

.ra-module-blue {
    background: linear-gradient(180deg, #0a8794 0%, #007581 100%);
}

.ra-module-olive {
    background: linear-gradient(180deg, #bcc117 0%, #a8ad00 100%);
    color: #283100;
}

.ra-module-brown {
    background: linear-gradient(180deg, #75614c 0%, #64513D 100%);
}

.ra-module-btn {
    margin-top: 1rem;
    border-radius: 10px;
    min-height: 42px;
    padding: .7rem 1rem;
    font-weight: 700;
    width: fit-content;
}

.ra-module-btn-light {
    background: rgba(255, 255, 255, 0.18);
    color: var(--ra-white);
    border: 1px solid rgba(255, 255, 255, 0.28);
}

    .ra-module-btn-light:hover {
        background: rgba(255, 255, 255, 0.28);
        color: var(--ra-white);
    }

.ra-module-olive .ra-module-btn-light {
    background: rgba(255, 255, 255, 0.65);
    border-color: rgba(255, 255, 255, 0.7);
    color: #233000;
}

    .ra-module-olive .ra-module-btn-light:hover {
        background: rgba(255, 255, 255, 0.82);
        color: #233000;
    }

/* =========================
   SOLICITUDES
========================= */
.ra-solicitudes-page {
    width: 100%;
}

.ra-solicitudes-header {
    margin-bottom: 1.25rem;
}

.ra-page-header {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.15rem;
    flex-wrap: wrap;
    padding: 1.25rem 1.35rem 1.15rem;
    margin-bottom: 1.35rem;
    border: 1px solid rgba(18, 71, 52, 0.1);
    border-radius: 22px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(248,250,248,0.96) 100%);
    box-shadow: 0 12px 28px rgba(18, 71, 52, 0.06);
    overflow: hidden;
}

.ra-page-header-copy {
    flex: 1 1 320px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .72rem;
}

.ra-page-header-actions {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
    width: min(100%, max-content);
}

.ra-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
    flex-wrap: wrap;
    width: min(100%, max-content);
}

.ra-header-action-btn {
    min-width: 190px;
}

.ra-solicitudes-toolbar {
    margin-bottom: 1.25rem;
}

.ra-toolbar-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.ra-toolbar-field {
    display: flex;
    flex-direction: column;
    gap: .45rem;
}

.ra-solicitudes-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.ra-solicitud-card {
    position: relative;
    background: #ffffff;
    border: 1px solid rgba(18, 71, 52, 0.08);
    border-radius: 20px;
    padding: 1rem;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow: hidden;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

    .ra-solicitud-card::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 0;
        width: 6px;
        border-radius: 20px 0 0 20px;
        background: #d7d7d7;
    }

    .ra-solicitud-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 28px rgba(0, 0, 0, 0.08);
    }

    .ra-solicitud-card.card-new {
        background: linear-gradient(180deg, #f7fcf8 0%, #ffffff 100%);
        border-color: rgba(47, 125, 87, 0.18);
    }

        .ra-solicitud-card.card-new::before {
            background: #2f7d57;
        }

    .ra-solicitud-card.card-review {
        background: linear-gradient(180deg, #fffaf1 0%, #ffffff 100%);
        border-color: rgba(191, 132, 0, 0.18);
    }

        .ra-solicitud-card.card-review::before {
            background: #bf8400;
        }

    .ra-solicitud-card.card-assigned {
        background: linear-gradient(180deg, #f2f7ff 0%, #ffffff 100%);
        border-color: rgba(36, 89, 166, 0.18);
    }

        .ra-solicitud-card.card-assigned::before {
            background: #2459a6;
        }

    .ra-solicitud-card.card-progress {
        background: linear-gradient(180deg, #f7f4ff 0%, #ffffff 100%);
        border-color: rgba(95, 61, 196, 0.18);
    }

        .ra-solicitud-card.card-progress::before {
            background: #5f3dc4;
        }

    .ra-solicitud-card.card-wait {
        background: linear-gradient(180deg, #fff5f5 0%, #ffffff 100%);
        border-color: rgba(163, 48, 48, 0.18);
    }

        .ra-solicitud-card.card-wait::before {
            background: #a33030;
        }

    .ra-solicitud-card.card-done {
        background: linear-gradient(180deg, #f2fbf7 0%, #ffffff 100%);
        border-color: rgba(28, 122, 87, 0.18);
    }

        .ra-solicitud-card.card-done::before {
            background: #1c7a57;
        }

.ra-solicitud-card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: .9rem;
    flex-wrap: wrap;
}

.ra-solicitud-card-heading {
    flex: 1 1 280px;
}

.ra-solicitud-topline {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: .55rem;
}

.ra-solicitud-id,
.ra-solicitud-origin {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: .32rem .65rem;
    font-size: .78rem;
    font-weight: 800;
    background: rgba(36, 50, 54, 0.06);
    color: #243236;
}

.ra-solicitud-type {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: .32rem .65rem;
    font-size: .78rem;
    font-weight: 800;
    border: 1px solid transparent;
}

    .ra-solicitud-type.is-operativo {
        background: rgba(255, 184, 0, 0.14);
        border-color: rgba(191, 132, 0, 0.18);
        color: #8a5a00;
    }

    .ra-solicitud-type.is-proyecto {
        background: rgba(36, 89, 166, 0.12);
        border-color: rgba(36, 89, 166, 0.18);
        color: #2459a6;
    }

    .ra-solicitud-type.is-close-duplicate {
        background: rgba(127, 86, 217, 0.12);
        border-color: rgba(127, 86, 217, 0.18);
        color: #6941c6;
    }

    .ra-solicitud-type.is-close-invalid {
        background: rgba(201, 72, 72, 0.12);
        border-color: rgba(201, 72, 72, 0.18);
        color: #b42318;
    }

    .ra-solicitud-type.is-close-attended {
        background: rgba(17, 92, 70, 0.12);
        border-color: rgba(17, 92, 70, 0.18);
        color: #115c46;
    }

    .ra-solicitud-type.is-close-plan {
        background: rgba(36, 89, 166, 0.12);
        border-color: rgba(36, 89, 166, 0.18);
        color: #2459a6;
    }

    .ra-solicitud-type.is-close-scope {
        background: rgba(99, 102, 241, 0.12);
        border-color: rgba(99, 102, 241, 0.18);
        color: #4338ca;
    }

    .ra-solicitud-type.is-close-other {
        background: rgba(82, 82, 91, 0.12);
        border-color: rgba(82, 82, 91, 0.18);
        color: #3f3f46;
    }

.ra-solicitud-card.card-operativo {
    border-color: rgba(191, 132, 0, 0.24);
    box-shadow: 0 0 0 2px rgba(255, 184, 0, 0.12);
}

    .ra-solicitud-card.card-operativo::before {
        background: #bf8400;
    }

.ra-solicitud-card.card-proyecto-operativo {
    border-color: rgba(36, 89, 166, 0.24);
    box-shadow: 0 0 0 2px rgba(36, 89, 166, 0.1);
}

    .ra-solicitud-card.card-proyecto-operativo::before {
        background: #2459a6;
    }

.ra-solicitud-title {
    margin: 0 0 .45rem;
    font-size: 1.05rem;
    font-weight: 800;
    color: #243236;
    line-height: 1.35;
}

.ra-solicitud-desc {
    margin: 0;
    color: #5f6b6d;
    line-height: 1.55;
    font-size: .95rem;
}

.ra-solicitud-meta {
    display: grid;
    grid-template-columns: 1fr;
    gap: .75rem;
}

.ra-meta-item {
    background: rgba(247, 248, 247, 0.92);
    border: 1px solid rgba(0, 0, 0, 0.04);
    border-radius: 14px;
    padding: .8rem .9rem;
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.ra-meta-label {
    font-size: .78rem;
    color: #687577;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.ra-meta-value {
    font-size: .96rem;
    color: #243236;
    font-weight: 700;
    line-height: 1.35;
}

.ra-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .45rem .8rem;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 800;
    white-space: nowrap;
    border: 1px solid transparent;
}

    .ra-status-badge.is-new {
        background: #e8f1ff;
        color: #2459a6;
    }

    .ra-status-badge.is-review {
        background: #fff4df;
        color: #9a6a00;
    }

    .ra-status-badge.is-assigned {
        background: #e8f7ec;
        color: #237a42;
    }

    .ra-status-badge.is-progress {
        background: #ede9ff;
        color: #5f3dc4;
    }

    .ra-status-badge.is-wait {
        background: #fceaea;
        color: #a33030;
    }

    .ra-status-badge.is-done {
        background: #e6f7f0;
        color: #1c7a57;
    }

.ra-solicitud-actions {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    margin-top: .15rem;
}

.ra-solicitud-btn {
    width: 100%;
    border-radius: 14px;
    padding: .8rem 1rem;
    font-weight: 800;
    font-size: .95rem;
    min-height: 44px;
    transition: transform .15s ease, opacity .15s ease, box-shadow .15s ease, background .15s ease;
}

    .ra-solicitud-btn:hover {
        transform: translateY(-1px);
    }

/* =========================
   DETALLE / FORMULARIOS DE SOLICITUDES
========================= */
.ra-form-card {
    padding-top: 1.1rem;
}

.ra-form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.ra-form-field {
    display: flex;
    flex-direction: column;
    gap: .45rem;
}

.ra-field-span-2 {
    grid-column: span 1;
}

.ra-textarea {
    min-height: 140px;
    resize: vertical;
}

.ra-form-actions {
    display: flex;
    flex-direction: column-reverse;
    gap: .75rem;
    margin-top: 1rem;
    align-items: stretch;
}

.ra-click-card {
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.ra-click-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(31, 43, 45, 0.08);
}

.ra-click-card.is-selected {
    border-color: rgba(0, 127, 140, 0.38);
    box-shadow: 0 18px 32px rgba(0, 127, 140, 0.12);
}

.ra-detail-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.ra-detail-head {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1rem;
}

.ra-detail-title {
    margin: 0 0 .5rem;
    color: #243236;
    font-size: 1.15rem;
    font-weight: 800;
}

.ra-detail-description {
    margin: 0;
    color: #5f6b6d;
    line-height: 1.6;
}

.ra-detail-meta-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: .75rem;
}

.ra-detail-meta-card {
    background: #f7f8f7;
    border-radius: 14px;
    padding: .85rem .95rem;
    border: 1px solid rgba(0,0,0,.04);
}

.ra-timeline {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ra-timeline-item {
    display: flex;
    gap: .85rem;
    align-items: flex-start;
}

.ra-timeline-dot {
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: #2f7d57;
    margin-top: .45rem;
    flex-shrink: 0;
}

.ra-timeline-content strong {
    display: block;
    margin-bottom: .25rem;
    color: #243236;
}

.ra-timeline-content p {
    margin: 0 0 .25rem;
    color: #5f6b6d;
}

.ra-timeline-content span {
    font-size: .85rem;
    color: #7a8789;
}

.ra-side-actions,
.ra-side-summary {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.ra-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    padding-bottom: .65rem;
    border-bottom: 1px solid rgba(0,0,0,.07);
}

    .ra-summary-row:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }

.ra-reservas-layout {
    display: grid;
    gap: 1rem;
}

.ra-reservas-main {
    min-width: 0;
}

.ra-section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.ra-section-subtitle {
    margin: 0;
    color: var(--ra-text-muted);
    font-size: .92rem;
    line-height: 1.45;
}

.ra-cabana-groups {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ra-cabana-group {
    display: flex;
    flex-direction: column;
    gap: .8rem;
}

.ra-cabana-group-title {
    font-weight: 800;
    color: var(--ra-green);
}

.ra-cabana-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: .8rem;
}

.ra-select-card {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    padding: .95rem;
    border: 1px solid var(--ra-border);
    border-radius: var(--ra-radius-md);
    background: var(--ra-surface-soft);
    cursor: pointer;
    transition: all .18s ease;
}

    .ra-select-card:hover {
        border-color: rgba(0, 117, 129, 0.32);
        box-shadow: 0 8px 20px rgba(0, 117, 129, 0.08);
    }

.ra-select-card.selected {
        border-color: rgba(18, 71, 52, 0.36);
        background: #edf7f2;
    }

    .ra-select-card input {
        margin-top: .2rem;
        flex-shrink: 0;
    }

.ra-dynamic-stack {
    display: flex;
    flex-direction: column;
    gap: .9rem;
}

.ra-dynamic-card {
    border: 1px solid var(--ra-border);
    border-radius: var(--ra-radius-md);
    padding: 1rem;
    background: var(--ra-surface-soft);
}

.ra-dynamic-card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    margin-bottom: .9rem;
    flex-wrap: wrap;
}

.ra-toggle-line {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
}

.ra-checkbox-line {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    font-weight: 600;
    color: var(--ra-text);
}

    .ra-checkbox-line input {
        flex-shrink: 0;
    }

.ra-inline-field {
    min-width: 220px;
    display: flex;
    flex-direction: column;
    gap: .45rem;
}

.ra-inline-panel {
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    padding-top: 1rem;
}

.ra-autorizacion-prompt {
    border-left: 4px solid var(--ra-accent);
    scroll-margin-top: 6rem;
}

.ra-inline-action-btn {
    min-height: 40px;
    position: relative;
    z-index: 2;
    pointer-events: auto;
}

.ra-client-action-row {
    display: flex;
    justify-content: flex-start;
    position: relative;
    z-index: 3;
    isolation: isolate;
}

.ra-client-quick-create {
    margin-top: .2rem;
}

.ra-client-create-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 220px;
    box-shadow: 0 4px 14px rgba(18, 71, 52, 0.08);
}

.ra-client-create-panel {
    background: linear-gradient(180deg, #f9fcfa 0%, #ffffff 100%);
    border: 1px solid rgba(18, 71, 52, 0.08);
    border-radius: var(--ra-radius-md);
    padding: 1rem;
}

.ra-field-error {
    margin-top: .4rem;
    color: var(--ra-danger);
    font-size: .86rem;
    font-weight: 600;
}

.ra-field-help {
    margin-top: .45rem;
    color: var(--ra-text-muted);
    font-size: .86rem;
    line-height: 1.45;
}

.ra-field-error-block {
    margin-top: .8rem;
}

.ra-input.is-invalid,
.form-select.ra-input.is-invalid,
.form-control.ra-input.is-invalid {
    border-color: #d9534f;
    box-shadow: 0 0 0 0.18rem rgba(217, 83, 79, 0.14);
}

.ra-reserva-feedback {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(0,0,0,.08);
}

.ra-feedback-title,
.ra-feedback-block-title {
    font-weight: 800;
    color: var(--ra-green);
    margin-bottom: .6rem;
}

.ra-feedback-block {
    margin-top: .9rem;
    padding: .85rem .95rem;
    border-radius: var(--ra-radius-md);
}

    .ra-feedback-block ul {
        margin: 0;
        padding-left: 1.1rem;
    }

.ra-feedback-block.is-error {
    background: #fff0ee;
    border: 1px solid #f3c5bf;
    color: #8c2d23;
}

.ra-feedback-block.is-warning {
    background: #fff8e8;
    border: 1px solid #f1ddab;
    color: #7a5d00;
}

.ra-error-links {
    margin: 0;
    padding-left: 1rem;
}

.ra-link-button {
    padding: 0;
    background: transparent;
    border: none;
    color: inherit;
    text-align: left;
    font: inherit;
    cursor: pointer;
}

    .ra-link-button:hover {
        text-decoration: underline;
    }

/* =========================
   TABLET
========================= */
@media (min-width: 768px) {
    .ra-toolbar-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ra-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ra-solicitudes-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ra-solicitud-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ra-solicitud-actions {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .ra-solicitud-btn {
        width: auto;
        min-width: 150px;
    }

    .ra-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ra-field-span-2 {
        grid-column: span 2;
    }

    .ra-form-actions {
        flex-direction: row;
        justify-content: flex-end;
    }

    .ra-detail-meta-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ra-reservas-layout {
        grid-template-columns: minmax(0, 2.1fr) minmax(320px, .9fr);
        align-items: start;
    }

    .ra-card-actions,
    .ra-mobile-actions,
    .ra-row-actions,
    .ra-table-actions {
        justify-content: flex-start;
    }
}

/* =========================
   DESKTOP
========================= */
@media (min-width: 1024px) {
    .ra-toolbar-grid {
        grid-template-columns: 2fr 1fr 1fr 1fr;
    }

    .ra-filter-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ra-solicitudes-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .ra-solicitud-card {
        padding: 1.1rem;
    }

    .ra-solicitud-title {
        font-size: 1.08rem;
    }

    .ra-solicitud-btn {
        min-width: 160px;
    }

    .ra-detail-layout {
        grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
        align-items: start;
    }

    .ra-detail-head {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }

    .ra-detail-meta-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1200px) {
    .ra-card-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* =========================
   MOBILE
========================= */
@media (max-width: 900px) {
    .ra-layout-topbar-inner {
        grid-template-columns: 1fr;
        gap: .85rem;
    }

    .ra-layout-left {
        justify-content: space-between;
        width: 100%;
    }

    .ra-menu-toggle {
        display: inline-flex;
    }

    .ra-layout-nav,
    .ra-layout-user {
        display: none;
        width: 100%;
        margin-top: 0;
    }

        .ra-layout-nav.open,
        .ra-layout-user.open {
            display: flex;
        }

    .ra-layout-nav {
        flex-direction: column;
        align-items: stretch;
        gap: .5rem;
    }

    .ra-layout-nav-link {
        width: 100%;
        text-align: center;
        background: rgba(255, 255, 255, 0.08);
    }

    .ra-layout-nav-submenu a,
    .ra-layout-nav-submenu a:link,
    .ra-layout-nav-submenu a:visited {
        color: rgba(255, 255, 255, 0.92) !important;
    }

    .ra-layout-nav-submenu a:hover,
    .ra-layout-nav-submenu a.active {
        color: var(--ra-white) !important;
    }

    .ra-layout-user {
        flex-direction: column;
        align-items: stretch;
        gap: .7rem;
    }

    .ra-layout-user-info {
        text-align: center;
    }

    .ra-layout-logout-btn {
        width: 100%;
    }

    .ra-layout-user {
        display: none;
    }

    .ra-layout-user.open {
        display: grid;
    }

    .ra-layout-modulebar-inner {
        padding: .65rem .8rem .8rem;
    }
}

@media (max-width: 576px) {
    .ra-auth-page {
        padding: 1.1rem .8rem;
    }

    .ra-auth-card {
        padding: 1.35rem 1rem;
        border-radius: 18px;
    }

    .ra-auth-logo {
        max-width: 220px;
        max-height: 112px;
    }

    .ra-auth-title {
        font-size: 1.45rem;
    }

    .ra-layout-topbar-inner {
        padding: .8rem;
    }

    .ra-layout-logo {
        height: 46px;
        max-width: 230px;
    }

    .ra-layout-main {
        padding: 1rem .8rem 1.4rem;
    }

    .ra-layout-modulebar-inner {
        gap: .5rem;
    }

    .ra-layout-module-link {
        padding: .58rem .82rem;
        font-size: .85rem;
    }

    .ra-hero,
    .ra-page-header {
        grid-template-columns: 1fr;
        padding: 1.1rem 1rem 1rem;
        margin-bottom: 1.15rem;
        border-radius: 18px;
    }

    .ra-hero h1,
    .ra-page-title {
        max-width: none;
        font-size: clamp(1.8rem, 8vw, 2.35rem);
    }

    .ra-hero-subtitle,
    .ra-page-subtitle {
        font-size: .96rem;
    }

    .ra-eyebrow {
        margin-bottom: .55rem;
        font-size: .7rem;
        padding: .32rem .62rem;
    }

    .ra-card {
        padding: 1rem;
    }

    .ra-module-grid {
        grid-template-columns: 1fr;
    }

    .ra-module-card {
        min-height: auto;
    }

    .ra-module-btn,
    .ra-header-action-btn,
    .ra-btn-primary,
    .ra-btn-success,
    .ra-btn-secondary,
    .ra-btn-back {
        width: 100%;
    }

    .ra-page-header-actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .ra-header-actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .ra-hero-actions {
        width: 100%;
        min-width: 0;
        gap: .7rem;
        justify-content: stretch;
    }

    .ra-page-header {
        flex-direction: column;
        align-items: stretch;
    }

    .ra-page-actions {
        gap: .65rem;
    }

    .ra-page-actions-primary,
    .ra-page-actions-secondary {
        display: grid;
        grid-template-columns: 1fr;
        gap: .55rem;
    }

    .ra-page-actions-primary .ra-btn,
    .ra-page-actions-secondary .ra-btn {
        justify-content: center;
    }

    .ra-card-actions,
    .ra-mobile-actions,
    .ra-row-actions,
    .ra-table-actions,
    .ra-action-row {
        flex-direction: column;
        align-items: stretch;
    }

    .ra-card-actions .ra-btn,
    .ra-mobile-actions .ra-btn,
    .ra-row-actions .ra-btn,
    .ra-table-actions .ra-btn,
    .ra-action-row .ra-btn {
        width: 100%;
    }

    .ra-mobile-card {
        padding: .95rem;
    }

    .ra-dashboard-grid,
    .ra-card-grid,
    .ra-filter-grid {
        grid-template-columns: 1fr;
    }
}
