:root{

--color-burgundy-soft:#E9DEE4;

--color-background:#F8F9FA;
--color-subtle:#F1F3F5;

--color-border:#E5E7EB;

--text-gray-800:#121111;
--text-gray-700:#1e1e1e;
--text-gray-600:#6c757d;
--text-gray-150: #adb5bd;

}

/* ========================= 
Espacio privado 
=========================*/
.espacio-layout{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background: var(--grey-bg);
}

.espacio-privado {
  display: block; 
  padding: 0;
}

.espacio-contenido {
  flex: 1;
  padding: 3rem 3rem 0 3rem;
  margin-left: 300px;
  width: calc(100% - 300px);
}

.espacio-contenido-inner {
  min-height: 100vh;
}

.espacio-menu {
  position: fixed;
  display: flex;
  flex-direction: column; 
  align-items: stretch;
  gap: 5em;
  left: 0;
  top: 0;
  width: 300px;
  height: 100vh;
  padding: 2em 3em;
  overflow-y: auto;
  background: white;
  border-right: .0625rem solid var(--color-border);
  border-left: .0625rem solid var(--color-border);
}

.espacio-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.espacio-menu ul li a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    color: var(--text-gray-600);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s;
    margin-bottom: 0.5em;
}

.espacio-menu ul li a:hover {
    color: var(--text-gray-800);
}

.espacio-menu ul li a:hover::after {
    display: none;
}

.espacio-menu ul li a.active {
    font-weight: bold;
    color: var(--text-gray-800);
}



/*  Header */
.espacio-header {
    position: sticky;
    top: 0;
    margin-left: 300px;
    width: calc(100% - 300px);
    z-index: 999;
    border-bottom: 1px solid var(--color-border);
    background: var(--grey-bg);
}

.espacio-header-inner {
    margin: 0 auto;
    padding: 0 4rem;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: end;
}

.logo-wrap {
    display:flex;
    align-items:center;
    gap:10px;
    text-decoration:none;
}

.logo-circle {
    width:42px;
    height:42px;
    border-radius:50%;
    background:var(--color-burgundy);
    display:flex;
    align-items:center;
    justify-content:center;
}

.logo-circle img {
    width:32px;
    height:auto;
}

.logo-text {
    font-weight:600;
    font-size:18px;
    color: var(--text-gray-700);
}

.espacio-actions {
    display: flex;
    align-items: center;
    gap: 30px;
}

.espacio-icons {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
}


.espacio-icons svg {
    display: block;
    fill: var(--text-gray-600);
    width: 25px;
    height: auto;

}

.espacio-icons svg:hover {
    fill: var(--color-burgundy-hover);
}

.icon-hover {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .2s ease;
}

.icon-switch:hover .icon-hover {
    opacity: 1;
}

.icon-switch:hover .icon-default {
    opacity: 0;
}
.espacio-user {
    display: flex;
    align-items: center;
    gap: 10px;
}

.espacio-user img {
    border-radius: 50%;
}

.espacio-username {
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-gray-700);
}

.espacio-user-dropdown {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.espacio-submenu {
    position: absolute;
    top: 35px;
    right: 0;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    list-style: none;
    padding: 8px 0;
    min-width: 150px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(5px);
    transition: all 0.2s ease;
    z-index: 999;
}

.espacio-user-dropdown:hover .espacio-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.espacio-submenu li {
    margin: 0;
    padding: 0;
}

.espacio-submenu li a {
    display: block;
    padding: 10px 16px;
    font-size: 0.9rem;
    color: #333;
    text-decoration: none;
    transition: background 0.2s;
}

.espacio-submenu li a:hover {
    background: var(--color-subtle);
}
/* Footer */
.espacio-footer {
  font-size: 0.9rem;
  color: var(--text-gray-600);
}
.espacio-footer-inner {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

/* =========================
Avisos miembros
========================= */
.avisos-feed {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-width: 900px;
    width: 100%;
}

.aviso-item {
    background: #fff;
    padding: 1.25rem 1.5rem;
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-soft);
}

.aviso-header {
    position: relative;
    margin-bottom: 1.2rem;
    border-bottom: 1px solid var(--color-border);
    padding-bottom: 0.5rem;
}

.aviso-titulo {
    font-size: 1.6rem;
    margin-bottom: 0.3rem;
    font-weight: 600;
    line-height: 1.3;
}

.aviso-titulo a {
    color: #333;
    text-decoration: none;
    transition: color 0.2s;
}
.aviso-titulo a:hover {
    color: var(--color-burgundy);
}
.aviso-fecha {
    display: block;
    font-size: 0.85rem;
    color: var(--text-gray-600);
}

.aviso-contenido p:last-child {
    margin-bottom: 0;
}

.aviso-menu-wrapper {
    position: absolute;
    top: 0;
    right: 0;
}

.aviso-menu-toggle {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    padding: 4px 8px;
}

.aviso-menu-dropdown {
    position: absolute;
    padding: 8px 0;
    right: 0;
    top: 32px;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    box-shadow: var(--shadow-medium);
    min-width: 160px;
    z-index: 100;
    will-change: opacity, transform;
    opacity: 0;
    transform: translateY(-8px) scale(0.98);
    pointer-events: none;
    transition: 
        opacity 0.18s ease,
        transform 0.18s ease;
}

.aviso-menu-dropdown.active {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.aviso-menu-item {
    display: block;
    padding: 8px 15px;
    text-decoration: none;
    color: var(--text-gray-700);
    background: none;
    border: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    font: inherit;
    font-size: 0.95rem;
}

.aviso-menu-item:hover {
    background: var(--color-subtle);
    color: var(--text-gray-800);
}

.aviso-menu-item.eliminar {
    color: #c0392b;
}

/* =========================
Cuenta
========================= */

.um-account-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.um-account-header {
  margin-bottom: 4em;
  border-bottom: 1px solid var(--grey-border);
}

.um-account-subtitle {
  margin-bottom: 0;
  font-size: 12px;
}

.edit-profile i {
  color: var(--text-gray-600);
  font-size: 20px;
  transition: color 0.2s;
}

.edit-profile i:hover {
  color: var(--text-gray-800);
}

.um-name a {
    pointer-events: none;
    cursor: default;
}

.um-account-title {
  color: var(--text-gray-800);
  font-weight: 600;
}

.dashboard-menu-wrapper {
  background: white;
  border: 1px solid var(--color-border);
}

.um-account-side li {
  background: white !important;
}

.um-account-side li a {
    display: flex !important;
    padding: 1em 1.5em !important;
    margin-bottom: 0 !important;
    font-size: 15px !important;
    color: var(--text-gray-700) !important;
}

.dashboard-menu-item {
  border-bottom: solid 1px var(--color-border) !important;
}

.dashboard-menu-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    text-decoration: none;
    color: var(--text-gray-700);
    transition: all 0.2s ease;

}

.dashboard-menu-link:hover {
  background: var(--color-subtle) !important;
}

.dashboard-menu-link.current {
  background: var(--color-subtle);

}

.um-account-link .dashboard-menu-link .is-active {
    border-left: solid 1px var(--color-burgundy);
}

.um-account-main-wrapper {
  display: flex;
  gap: 2em;
}

.um-account-main {
  background: white;
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-soft);
  padding: 2em !important;
}

.um-account-heading {
  display: none !important;
}

.um .um-cover-add:hover,.um .um-field-checkbox.active:not(.um-field-radio-state-disabled) i,.um .um-field-radio.active:not(.um-field-radio-state-disabled) i,.um .um-item-meta a,.um .um-member-less a:hover,.um .um-member-more a:hover,.um .um-member-name a:hover,.um .um-members-pagi a:hover,.um .um-profile-subnav a.active,.um .um-tip:hover,.um-account-name a:hover,.um-account-nav a.current,.um-account-side li a.current span.um-account-icon,.um-account-side li a.current:hover span.um-account-icon,.um-dropdown li a:hover,i.um-active-color,span.um-active-color {
    color: var(--color-burgundy) !important;
}

.picker__box,.picker__nav--next:hover,.picker__nav--prev:hover,.um .um-field-group-head,.um .um-members-pagi span.current,.um .um-members-pagi span.current:hover,.um .um-profile-nav-item.active a,.um .um-profile-nav-item.active a:hover,.um-modal-btn,.um-modal-btn.disabled,.um-modal-btn.disabled:hover,.um-modal-header,.upload,div.uimob800 .um-account-side li a.current,div.uimob800 .um-account-side li a.current:hover {
    background: var(--color-burgundy) !important;
}

.picker--focused .picker__day--highlighted,.picker--focused .picker__list-item--highlighted,.picker--focused .picker__list-item--selected,.picker__day--highlighted:hover,.picker__day--infocus:hover,.picker__day--outfocus:hover,.picker__footer,.picker__header,.picker__list-item--highlighted:hover,.picker__list-item--selected,.picker__list-item--selected:hover,.picker__list-item:hover,.um .um-field-group-head:hover {
    background: var(--color-burgundy-hover) !important;
}

.um {
    margin-left: auto!important;
    margin-right: auto!important
}

.um input[type=submit]:disabled:hover {
    background: var(--color-burgundy) !important;
}

.um a.um-button,.um a.um-button.um-disabled:active,.um a.um-button.um-disabled:focus,.um a.um-button.um-disabled:hover,.um input[type=submit].um-button,.um input[type=submit].um-button:focus {
    background: var(--color-burgundy) !important;
}

.um a.um-link {
    color: var(--color-burgundy) !important;
}

.um a.um-button:hover,.um input[type=submit].um-button:hover {
    background-color: var(--color-burgundy-hover) !important;
}

.um a.um-link-hvr:hover,.um a.um-link:hover {
    color: var(--color-burgundy-hover) !important;
}

.um-profile.um .um-profile-edit-a.active,.um-profile.um .um-profile-headericon a:hover {
    color: var(--color-burgundy) !important;
}

.um-request-button {
    background-color: var(--color-burgundy) !important;
}

.um-request-button:hover {
    background-color: var(--color-burgundy-hover) !important;
}

.profile-inner {
  background: white;
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-soft);
  padding: 2em;
}


/* =========================
   Directorio
   ========================= */
.um-members-wrapper {
  padding-right: 2em;
}

.um-search-filter .select2-selection__arrow:before{
    display:none !important;
}

.select2-selection__arrow::after{
    content: "\e136" !important;
    font-family: "Phosphor" !important;
    font-size: 16px !important;
}

.um-members.um-members-list .um-member {
  border: 1px solid var(--color-border) !important;
  box-shadow: var(--shadow-soft) !important;
  padding: 1em !important;
}

.um-members.um-members-list .um-member .um-member-card-container {
  margin: 0 !important;
  align-items: stretch !important;
}

.um-member-card-container .um-member-card {
    margin: 0.3em 0 0 1em !important;
    display:flex;
    flex-direction:column;
    flex:1;
    height:100% !important;
}

.um-member-card-header .um-member-name {
    font-size: 16px;;
    color: var(--text-gray-700) !important;
    font-weight: 700;
}

.um-member-more a i {
    font-size: 20px !important;
}

.um-member-tagline {
    font-size: 14px !important;
}

.um-directory .um-members-wrapper .um-members img {
  border-radius: 50% !important;
}

.um-directory .um-members-wrapper .um-members.um-members-list .um-member .um-member-card-container .um-member-photo {
  width: 60px !important;
  flex-shrink:0;
}

.um-directory .um-members-wrapper 
.um-members.um-members-list 
.um-member 
.um-member-card-footer 
.um-member-card-footer-buttons {
  width: auto !important;
  margin: 0 10px 0 auto !important;
  align-items: center !important;
  gap: 10px;  
  font-size: 20px;
}

.um-member-meta {
    margin: 10px 0 10px 0 !important;
}

.um-new-dropdown {
  padding: 8px 0;
  right: 0;
  border: 1px solid var(--color-border) !important;
  border-radius: 8px;
  box-shadow: var(--shadow-medium) !important;
  min-width: 230px;
  z-index: 100;
  will-change: opacity, transform;
  opacity: 0;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.um-new-dropdown[style*="display: block"] {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.um-new-dropdown ul li a {
  padding: 10px 16px !important;
  text-decoration: none;
  color: var(--text-gray-700) !important;
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  font-size: 0.9rem;
  transition: background 0.2s ease;
}

.um-new-dropdown ul li a:hover {
    background: var(--color-subtle);
}



/* CONTENEDOR SUPERIOR */
.um-directory .um-member-directory-search-row {
    display: grid !important;
    grid-template-columns: 1fr auto auto !important;
    align-items: center !important;
}

/* BARRA DE BÚSQUEDA */
.um-directory .um-member-directory-search-line {
    width: 100% !important;
    justify-content: space-between !important;
}

.um-directory .um-member-directory-search-line input {
    height: 42px !important;
    padding: 0 14px !important;
}

.um-do-search {
    height: 42px !important;
    min-width: 5% !important;
    border: none !important;
    background: var(--color-burgundy) !important;
    color: white !important;
    transition: background 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s ease;
    cursor: pointer;
    padding: 0;
}

.um-do-search:hover {
    background: var(--color-burgundy-hover) !important;
}

.um-do-search .label {
    display: none; /* opcional si solo quieres mostrar el icono */
}

/* CONTENEDOR FILTROS */
.um-directory .um-member-directory-filters-bar {
    margin-top: 15px;
}

/* GRID DE FILTROS */
.um-directory .um-search {
    grid-template-columns: repeat(auto-fit,minmax(180px,1fr)) !important;
}

.um-member-directory-search-line label {
    max-width: 100% !important;
}

/* ESTILO DE SELECTS */
.um-search-filter select,
.um-search-filter input {
    height: 40px;
    padding: 0 10px;
}

/* contenedor de filtros activos */
.um-filtered-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1em !important;
}

/* cada etiqueta de filtro */
.um-members-filter-tag {
    display: inline-flex;
    align-items: center;
    width: auto !important;

    background: var(--color-border);
    border-radius: 20px;
    padding: 6px 12px;
    font-size: 13px;
}

/* botón de eliminar */
.um-members-filter-remove {
    margin-left: 6px;
    cursor: pointer;
}

.um-clear-filters-a {
    font-size: 13px;
}

.um-clear-filters-a:hover {
    color: var(--color-burgundy-hover)
}
/* =========================
   Formularios
   ========================= */

.dlp-grid-controls {
    display: none;
}

.dlp-grid-card-content {
  border: none !important;
  text-align: center;
}

.dlp-grid-card-title {
    font-weight: 500 !important;
}

.dlp-grid-card-title a {
    color: var(--text-gray-700) !important;
    text-decoration: none !important;
}   

.dlp-icon.pdf svg {
  display: none;
}

.dlp-icon.pdf {
  background-image: url("https://actie.es/wp-content/uploads/2026/02/pdf.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.dlp-file-icon {
    height: 60px !important;
    width: 60px !important;
}

.dlp-grid-card {
  padding: 2em 0;
  border-radius: 0 !important;
  box-shadow: var(--shadow-soft);
  background: white;
  transition: all 0.3s ease;
}

.dlp-grid-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-medium);
}

.dlp-grid-card::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: #cc4b4c;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
}

.dlp-grid-card:hover::after {
  transform: scaleX(1);
}

@media (max-width: 992px) {
.espacio-header {
        position: sticky;
        top: 0;
        margin-left: 0;
        width: 100%;
        z-index: 1000;
    }

    .espacio-header-inner{
        padding: 0 1.5rem;
    }

    .espacio-privado {
        display: block;
        padding: 0;
    }

    .espacio-contenido {
        width: 100%;
        margin-left: 0;
        padding: 1.5rem;
        padding-bottom: 80px; 
    }

    .espacio-menu {
        position: fixed;
        bottom: 0;
        left: 0;
        top: auto;
        width: 100%;
        height: 65px;
        padding: 0;
        background: white;
        display: flex;
        justify-content: space-around;
        border: none;
        border-top: 1px solid var(--color-border);
        overflow: visible;
        z-index: 1000;
    }

    .espacio-menu ul {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        width: 100%;
        height: 100%;
    }

    .espacio-menu li {
        flex: 1;
        text-align: center;
    }

    .espacio-menu li a {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 4px;
        padding: 6px 4px;
        font-size: 11px;
    }

    .espacio-menu li a svg {
        width: 20px;
        height: 20px;
    }

    .espacio-menu li a .label {
        display: none;
    }

    .espacio-menu li a.active svg {
        color: #000;
    }

    .espacio-icon,
    .espacio-username,
    .espacio-logo {
        display: none;
    }

    .espacio-header-inner {
        justify-content: space-between;
    }

    .espacio-logo-movil {
        display: block;
    }

    .logo-circle {
        width: 36px;
        height: 36px;
    }

    .logo-circle img {
        width: 29px;
        height: auto;
    }

    .logo-text {
        font-size: 16px;
    }

    .um-directory .um-member-directory-header {
        flex-direction: column;
        align-items: baseline !important;
        margin-top: 30px;
    }

    .um-member-directory-search-row {
        width: 100% !important;
    }

    .um-do-search {
        min-width: 15% !important;
    }

    .um-member-directory-filters-bar {
        width: 100%;
        margin-bottom: 15px;
    }

    .um-member-directory-filters-bar .um-search { 
        grid-template-columns: 1fr 1fr !important;
    }

    .um-search{
        display:flex;
        flex-wrap:wrap;
        gap:10px;
}


    /* filtros lengua pequeños */
    .um-search-filter:has(#lengua_a),
    .um-search-filter:has(#lengua_b),
    .um-search-filter:has(#lengua_c){
        flex:0 0 120px !important;
    }
}

@media (min-width: 992px) {

    .espacio-logo-movil {
        display: none;
    }
}