:root {
  --gss-dark: #0F172A;
  --gss-amber: #F59E0B;
  --gss-primary: #004AAD;
  --gss-white: #FFFFFF;
  --gss-light: #F8FAFC;
  --gss-gray: #E2E8F0;
  --gss-text-muted: #64748B;
  --gss-radius: 12px;
  --gss-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.06);
  --gss-shadow-lg: 0 10px 25px -3px rgba(15, 23, 42, 0.1);
}

html {
  font-size: 15px;
  position: relative;
  min-height: 100%;
}

body {
  background-color: var(--gss-light);
  color: var(--gss-dark);
  font-family: 'Plus Jakarta Sans', sans-serif;
  margin: 0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.bg-gss-dark {
  background-color: var(--gss-dark) !important;
}

.text-gss-amber {
  color: var(--gss-amber) !important;
}

.text-gss-primary {
  color: var(--gss-primary) !important;
}

.bg-gss-amber {
    background-color: var(--gss-amber) !important;
}

.bg-gss-primary {
    background-color: var(--gss-primary) !important;
}

.btn-gss-action {
    background-color: #003785;
    border-color: #003785;
    color: var(--gss-white);
    /*border-radius: 8px;*/
    /*padding: 0.5rem 1.25rem;*/
    font-weight: 600;
    transition: all 0.2s ease;
}

    .btn-gss-action:hover {
        background-color: var(--gss-dark);
        border-color: var(--gss-dark);
        color: var(--gss-white);
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(0, 74, 173, 0.2);
    }

.btn-gss-primary {
  background-color: var(--gss-primary);
  border-color: var(--gss-primary);
  color: var(--gss-white);
  border-radius: 8px;
  padding: 0.5rem 1.25rem;
  font-weight: 600;
  transition: all 0.2s ease;
}

.btn-gss-primary:hover {
  background-color: #003785;
  border-color: #003785;
  color: var(--gss-white);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 74, 173, 0.2);
}

.btn-gss-amber {
  background-color: var(--gss-amber);
  border-color: var(--gss-amber);
  color: var(--gss-dark);
  font-weight: 600;
  border-radius: 8px;
  padding: 0.5rem 1.25rem;
  transition: all 0.2s ease;
}

.btn-gss-amber:hover {
  background-color: #d98806;
  border-color: #d98806;
  color: var(--gss-dark);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.25);
}

.card {
  background-color: var(--gss-white);
  border: 1px solid var(--gss-gray);
  border-radius: var(--gss-radius);
  box-shadow: var(--gss-shadow);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card:hover {
  box-shadow: var(--gss-shadow-lg);
}

.form-control, .form-select {
  border-radius: 8px;
  border-color: var(--gss-gray);
  padding: 0.65rem 1rem;
  font-size: 0.95rem;
}

.form-control:focus, .form-select:focus {
  border-color: var(--gss-primary);
  box-shadow: 0 0 0 3px rgba(0, 74, 173, 0.12);
}

.text-secondary-gss {
  color: var(--gss-text-muted) !important;
}

.table {
  vertical-align: middle;
}

.table > :not(caption) > * > * {
  padding: 1rem 0.75rem;
}

.h-banner {
    height: 500px !important;
    /* El degradado va de transparente (izquierda) a opaco (derecha) */
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 50%);
    mask-image: linear-gradient(to right, transparent 0%, black 50%);
}

.btn-flotante {
    /* Fondo transparente con desenfoque de cristal (Glassmorphism) */
    /*background: rgba(255, 255, 255, 0.15);*/
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    /* Bordes y texto claros para dar contraste */
    /*color: #ffffff;*/
    /*border: 1px solid rgba(255, 255, 255, 0.25);*/
    /*border-radius: 50px;*/ /* Bordes totalmente redondeados */
    /* Espaciado y tipografía */
    padding: 12px 30px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    /* Sombra inicial suave para simular que flota ligeramente */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    /* Transición fluida para las animaciones */
    transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
}

    /* Efecto al pasar el cursor (Hover) */
    .btn-flotante:hover {
        /* Eleva el botón simulando más flotabilidad */
        transform: translateY(-4px);
        /* Vuelve el fondo un poco más opaco */
        /*background: rgba(255, 255, 255, 0.25);*/
        /* Sombra más intensa y difusa debido a la altura */
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
    }

    /* Efecto al presionar (Active) */
    .btn-flotante:active {
        /* El botón desciende un poco al dar clic */
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
    }


.table-dark th {
    background-color: var(--gss-gray) !important;
    color: #000;
}

.dropdown-item.active, .dropdown-item:active {
    color: inherit !important;
    text-decoration: none;
    background-color: var(--gss-gray) !important;
}

.form-check-input:checked {
    background-color: var(--gss-primary) !important;
    border-color: var(--gss-primary) !important;
}

.btn-outline-amber {
    border-color: #965d02 !important;
    color: #965d02 !important;
    background-color: transparent;
}
    .btn-outline-amber.active {
        border-color: #965d02 !important;
        color: var(--gss-white) !important;
        background-color: #965d02;
    }

.btn-outline-secondary {
    color: var(--gss-dark) !important;
}

    .btn-outline-secondary.active, .btn-outline-secondary:hover {
        color: var(--gss-white) !important;
    }