@import url('https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap');

/* Paleta UCABA (misma que ucaba.org.ar). Cargar siempre despues de bulma.min.css */
:root {
    --uc-verde: #00923F;
    --uc-verde-osc: #007A35;
    --uc-verde-claro: #e6f5ed;
    --uc-azul: #0093DD;
    --uc-azul-osc: #007BBF;
    --uc-rojo: #DA251D;
    --uc-amarillo: #FFF500;
    --uc-negro: #1F1A17;
    --uc-fondo: #f6f8f7;
    --uc-sombra: 0 4px 18px rgba(31, 26, 23, .08);
    --uc-sombra-fuerte: 0 10px 28px rgba(31, 26, 23, .14);
}

/* is-primary -> Verde */
.button.is-primary { background-color: #00923F !important; border-color: transparent !important; color: #fff !important; }
.button.is-primary:hover, .button.is-primary:focus { background-color: #007A35 !important; }
.button.is-primary.is-light { background-color: #e6f5ed !important; color: #00923F !important; }
.button.is-primary.is-outlined { border-color: #00923F !important; color: #00923F !important; background: transparent !important; }
.button.is-primary.is-outlined:hover { background-color: #00923F !important; color: #fff !important; }
.hero.is-primary { background-color: #00923F !important; color: #fff !important; }
.hero.is-primary .title, .hero.is-primary .subtitle { color: #fff !important; }
.tag.is-primary { background-color: #00923F !important; color: #fff !important; }
.tag.is-primary.is-light { background-color: #e6f5ed !important; color: #00923F !important; }
.input.is-primary, .select.is-primary select, .textarea.is-primary { border-color: #00923F !important; }
.select.is-primary::after { border-color: #00923F !important; }
.message.is-primary { background-color: #e6f5ed !important; }
.message.is-primary .message-header { background-color: #00923F !important; color: #fff !important; }
.message.is-primary .message-body { border-color: #00923F !important; color: #006830 !important; }
.notification.is-primary { background-color: #00923F !important; color: #fff !important; }
.pagination-link.is-current { background-color: #00923F !important; border-color: #00923F !important; }
.progress.is-primary::-webkit-progress-value { background-color: #00923F !important; }
.progress.is-primary::-moz-progress-bar { background-color: #00923F !important; }

/* is-info -> Azul */
.button.is-info { background-color: #0093DD !important; border-color: transparent !important; color: #fff !important; }
.button.is-info:hover, .button.is-info:focus { background-color: #007BBF !important; }
.button.is-info.is-light { background-color: #e6f4fc !important; color: #0093DD !important; }
.button.is-info.is-outlined { border-color: #0093DD !important; color: #0093DD !important; background: transparent !important; }
.button.is-info.is-outlined:hover { background-color: #0093DD !important; color: #fff !important; }
.hero.is-info { background-color: #0093DD !important; color: #fff !important; }
.hero.is-info .title, .hero.is-info .subtitle { color: #fff !important; }
.tag.is-info { background-color: #0093DD !important; color: #fff !important; }
.tag.is-info.is-light { background-color: #e6f4fc !important; color: #0093DD !important; }
.message.is-info { background-color: #e6f4fc !important; }
.message.is-info .message-header { background-color: #0093DD !important; color: #fff !important; }
.message.is-info .message-body { border-color: #0093DD !important; color: #005f8a !important; }
.notification.is-info { background-color: #0093DD !important; color: #fff !important; }
.input.is-info, .select.is-info select, .textarea.is-info { border-color: #0093DD !important; }
.progress.is-info::-webkit-progress-value { background-color: #0093DD !important; }
.progress.is-info::-moz-progress-bar { background-color: #0093DD !important; }

/* is-danger -> Rojo */
.button.is-danger { background-color: #DA251D !important; border-color: transparent !important; color: #fff !important; }
.button.is-danger:hover, .button.is-danger:focus { background-color: #B81E17 !important; }
.button.is-danger.is-light { background-color: #fce8e7 !important; color: #DA251D !important; }
.button.is-danger.is-outlined { border-color: #DA251D !important; color: #DA251D !important; background: transparent !important; }
.button.is-danger.is-outlined:hover { background-color: #DA251D !important; color: #fff !important; }
.hero.is-danger { background-color: #DA251D !important; color: #fff !important; }
.hero.is-danger .title, .hero.is-danger .subtitle { color: #fff !important; }
.tag.is-danger { background-color: #DA251D !important; color: #fff !important; }
.tag.is-danger.is-light { background-color: #fce8e7 !important; color: #DA251D !important; }
.message.is-danger { background-color: #fce8e7 !important; }
.message.is-danger .message-header { background-color: #DA251D !important; color: #fff !important; }
.message.is-danger .message-body { border-color: #DA251D !important; color: #8f1811 !important; }
.notification.is-danger { background-color: #DA251D !important; color: #fff !important; }
.input.is-danger, .select.is-danger select, .textarea.is-danger { border-color: #DA251D !important; }
.progress.is-danger::-webkit-progress-value { background-color: #DA251D !important; }
.progress.is-danger::-moz-progress-bar { background-color: #DA251D !important; }

/* is-warning -> Amarillo */
.button.is-warning { background-color: #FFF500 !important; border-color: transparent !important; color: #1F1A17 !important; }
.button.is-warning:hover, .button.is-warning:focus { background-color: #E6DC00 !important; }
.button.is-warning.is-light { background-color: #fffde0 !important; color: #7a7300 !important; }
.hero.is-warning { background-color: #FFF500 !important; color: #1F1A17 !important; }
.hero.is-warning .title, .hero.is-warning .subtitle { color: #1F1A17 !important; }
.tag.is-warning { background-color: #FFF500 !important; color: #1F1A17 !important; }
.notification.is-warning { background-color: #FFF500 !important; color: #1F1A17 !important; }
.progress.is-warning::-webkit-progress-value { background-color: #FFF500 !important; }
.progress.is-warning::-moz-progress-bar { background-color: #FFF500 !important; }

/* is-dark -> Negro */
.button.is-dark { background-color: #1F1A17 !important; border-color: transparent !important; color: #fff !important; }
.button.is-dark:hover, .button.is-dark:focus { background-color: #3a322d !important; }
.hero.is-dark { background-color: #1F1A17 !important; color: #fff !important; }
.hero.is-dark .title, .hero.is-dark .subtitle { color: #fff !important; }
.tag.is-dark { background-color: #1F1A17 !important; color: #fff !important; }
.notification.is-dark { background-color: #1F1A17 !important; color: #fff !important; }

/* Tema general */
html { scroll-behavior: smooth; }
body { font-family: 'Roboto', 'Segoe UI', Arial, sans-serif; background: var(--uc-fondo); color: #2b2724; }
::selection { background: var(--uc-amarillo); color: var(--uc-negro); }

/* Encabezados (hero): siempre verde UCABA, con franja tricolor inferior. is-danger e is-dark se mantienen. */
.hero.is-primary, .hero.is-success, .hero.is-info, .hero.is-warning { position: relative; color: #fff !important; }
.hero.is-primary, .hero.is-success, .hero.is-info, .hero.is-warning {
    background: linear-gradient(120deg, var(--uc-verde-osc) 0%, var(--uc-verde) 60%, #1aa65a 100%) !important;
}
.hero.is-primary .title, .hero.is-primary .subtitle,
.hero.is-success .title, .hero.is-success .subtitle,
.hero.is-info .title, .hero.is-info .subtitle,
.hero.is-warning .title, .hero.is-warning .subtitle { color: #fff !important; }
.hero.is-primary::after, .hero.is-success::after, .hero.is-info::after, .hero.is-warning::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 8px;
    background: linear-gradient(90deg, var(--uc-amarillo) 0 25%, var(--uc-verde) 25% 50%, var(--uc-azul) 50% 75%, var(--uc-rojo) 75% 100%);
}
.hero.is-primary .hero-body, .hero.is-success .hero-body, .hero.is-info .hero-body, .hero.is-warning .hero-body { padding-top: 2rem; padding-bottom: 2.25rem; }
.hero.is-primary .title, .hero.is-success .title, .hero.is-info .title, .hero.is-warning .title { font-weight: 700; letter-spacing: .02em; }

/* Tarjetas y cajas */
.card, .box { border-radius: 14px; box-shadow: var(--uc-sombra); }
.card { border-top: 4px solid var(--uc-verde); background: #fff; }
.card .card-content .title { color: var(--uc-negro); }
.card .card-content .subtitle { color: #5a524c; }
.box { background: #fff; }

/* Botones dentro del contenido */
.section .button, .hero .button, .card .button {
    border-radius: 8px;
    font-weight: 700;
    transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.section .button:hover, .card .button:hover { transform: translateY(-1px); box-shadow: 0 6px 14px rgba(31, 26, 23, .18); }

/* Enlaces dentro de textos */
.content a:not(.button), .card-content a:not(.button) { color: var(--uc-azul); }
.content a:not(.button):hover, .card-content a:not(.button):hover { color: var(--uc-azul-osc); }

/* Formularios */
.input, .textarea, .select select { border-radius: 8px; }
.input:focus, .textarea:focus, .select select:focus,
.input.is-focused, .textarea.is-focused {
    border-color: var(--uc-verde) !important;
    box-shadow: 0 0 0 .125em rgba(0, 146, 63, .2) !important;
}
.label { color: var(--uc-negro); }

/* Tablas */
.table thead th { background: var(--uc-verde-claro); color: var(--uc-negro); border-bottom: 2px solid var(--uc-verde); }
.table.is-hoverable tbody tr:hover { background: var(--uc-verde-claro); }

/* Etiquetas */
.tag { border-radius: 6px; font-weight: 700; }

/* Portada: tarjetas de color */
.portada { padding: 4rem 1.5rem 5rem; }
.portada__cabecera { text-align: center; margin-bottom: 3rem; }
.portada__titulo { margin: 0 0 .75rem; color: var(--uc-negro); font-size: clamp(2rem, 5vw, 3rem); font-weight: 700; line-height: 1.1; letter-spacing: -.02em; }
.portada__titulo span {
    background: linear-gradient(90deg, var(--uc-verde), var(--uc-azul));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
.portada__subtitulo { margin: 0 auto; max-width: 560px; color: #5a524c; font-size: 1.1rem; }

.access-card {
    --acento: var(--uc-verde);
    --acento-osc: var(--uc-verde-osc);
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 2rem 1.75rem 1.75rem;
    overflow: hidden;
    isolation: isolate;
    border-radius: 22px;
    background: linear-gradient(145deg, var(--acento), var(--acento-osc));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--acento) 35%, transparent);
    color: #fff;
    opacity: 0;
    animation: portada-entra .7s cubic-bezier(.2, .7, .2, 1) forwards;
    transition: transform .35s ease, box-shadow .35s ease;
}
.portada .columns > .column:nth-child(2) .access-card { animation-delay: .12s; }
.portada .columns > .column:nth-child(3) .access-card { animation-delay: .24s; }
.access-card::before {
    content: "";
    position: absolute;
    right: -70px;
    top: -70px;
    z-index: -1;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .14);
    transition: transform .5s ease;
}
.access-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 24px 48px color-mix(in srgb, var(--acento) 55%, transparent);
    color: #fff;
}
.access-card:hover::before { transform: scale(1.35); }
.access-card--azul { --acento: var(--uc-azul); --acento-osc: var(--uc-azul-osc); }
.access-card--rojo { --acento: var(--uc-rojo); --acento-osc: #b81e17; }
.access-card__icono {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    margin-bottom: 1.5rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, .2);
    color: #fff;
    font-size: 1.5rem;
    transition: transform .35s ease;
}
.access-card:hover .access-card__icono { transform: rotate(-8deg) scale(1.12); }
.access-card__titulo { margin: 0 0 .5rem; color: #fff; font-size: 1.3rem; font-weight: 700; }
.access-card__texto { flex: 1; margin: 0 0 1.75rem; color: rgba(255, 255, 255, .88); font-size: .95rem; line-height: 1.55; }
.access-card__accion {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem 1.1rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .2);
    font-size: .9rem;
    font-weight: 700;
    transition: background .3s ease, color .3s ease, padding .3s ease;
}
.access-card:hover .access-card__accion { background: #fff; color: var(--acento-osc); padding-right: 1.4rem; }
.access-card__accion i { transition: transform .3s ease; }
.access-card:hover .access-card__accion i { transform: translateX(5px); }

@keyframes portada-entra { from { opacity: 0; transform: translateY(32px); } to { opacity: 1; transform: translateY(0); } }

@media (prefers-reduced-motion: reduce) {
    .access-card { animation: none; opacity: 1; }
}

/* Login */
.login-section { display: flex; justify-content: center; padding: 2rem 1rem 3rem; }
.login-card {
    width: 100%;
    max-width: 460px;
    background: #fff;
    border-radius: 16px;
    border-top: 5px solid var(--uc-verde);
    box-shadow: var(--uc-sombra-fuerte);
    padding: 2rem 2rem 1.75rem;
}
.login-card__cabecera { text-align: center; margin-bottom: 1.5rem; }
.login-card__icono {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin-bottom: .75rem;
    border-radius: 50%;
    background: var(--uc-verde-claro);
    color: var(--uc-verde);
    font-size: 1.6rem;
}
.login-card__titulo { margin: 0; font-size: 1.5rem; font-weight: 700; color: var(--uc-negro); }
.login-card__sub { margin: .25rem 0 0; color: #5a524c; font-size: .95rem; }
.login-card .field { text-align: left; }
.login-card .input { height: 2.75em; }
.login-card .control.has-icons-left .icon { color: var(--uc-verde); }
.login-card .control.has-icons-right .input { padding-right: 2.5em; }
.login-card .control.has-icons-right .icon.is-right { pointer-events: auto; }
.login-card .password-toggle { color: #6b625c; cursor: pointer; }
.login-card .password-toggle:hover { color: var(--uc-azul); }
.login-card .button.is-fullwidth + .button.is-fullwidth,
.login-card .control + .control { margin-top: .75rem; }
.login-card .notification { text-align: left; margin-bottom: 1.25rem; }
.login-card .notification a { color: inherit; text-decoration: underline; }
.login-card__extra { margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid #e8ecea; text-align: left; font-size: .9rem; color: #5a524c; }
.login-card__extra .buttons { margin-top: .75rem; }

@media screen and (max-width: 768px) {
    .login-card { padding: 1.5rem 1.25rem; }
}

/* Encabezado (include/menu_logo.php y copias por modulo) */
header.bg-dark {
    position: sticky;
    top: 0;
    z-index: 30;
    background: rgba(255, 255, 255, .92);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-top: 5px solid var(--uc-verde);
    box-shadow: var(--uc-sombra);
}
header.bg-dark .boxed-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    max-width: 1200px;
    margin: 0 auto;
    padding: .65rem 1.5rem;
}
.header-logo { display: inline-flex; align-items: center; }
.header-logo img { display: block; max-height: 46px; width: auto; transition: transform .2s ease; }
.header-logo:hover img { transform: scale(1.04); }
.header-acciones { display: flex; align-items: center; gap: 1rem; }
.header-enlace {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .45rem 1rem;
    border-radius: 999px;
    background: var(--uc-verde-claro);
    color: var(--uc-verde-osc);
    font-size: .88rem;
    font-weight: 700;
    transition: background .25s ease, color .25s ease, transform .25s ease;
}
.header-enlace i { font-size: .75rem; }
.header-enlace:hover { background: var(--uc-verde); color: #fff; transform: translateY(-1px); }
@media screen and (max-width: 480px) {
    .header-enlace span { display: none; }
    .header-enlace { padding: .55rem .7rem; }
}

/* Heros: circulo decorativo */
.hero.is-primary, .hero.is-success, .hero.is-info, .hero.is-warning { overflow: hidden; }
.hero.is-primary::before, .hero.is-success::before, .hero.is-info::before, .hero.is-warning::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -80px;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    pointer-events: none;
}
.hero.is-primary .hero-body, .hero.is-success .hero-body, .hero.is-info .hero-body, .hero.is-warning .hero-body { position: relative; z-index: 1; }

/* Pie de pagina (include/foother.php) */
#foother {
    position: relative;
    margin-top: 3rem;
    padding: 4rem 1.5rem 1.5rem;
    background: linear-gradient(120deg, var(--uc-verde-osc) 0%, var(--uc-verde) 60%, #1aa65a 100%);
    color: rgba(255, 255, 255, .88);
}
#foother::before {
    content: "";
    position: absolute;
    left: 0; right: 0; top: 0;
    height: 5px;
    background: linear-gradient(90deg, var(--uc-amarillo) 0 25%, var(--uc-verde) 25% 50%, var(--uc-azul) 50% 75%, var(--uc-rojo) 75% 100%);
}
.footer-grid { display: grid; grid-template-columns: 1.3fr 1.2fr 1fr 1fr; gap: 2.5rem; }
.footer-logo { display: inline-block; padding: .75rem 1rem; margin-bottom: 1.25rem; border-radius: 12px; background: #fff; }
.footer-logo img { display: block; max-width: 150px; height: auto; }
.footer-descripcion { max-width: 280px; font-size: .9rem; line-height: 1.6; }
.footer-section-title {
    margin-bottom: 1.25rem;
    color: #fff;
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.footer-section-title::after { content: ""; display: block; width: 32px; height: 3px; margin-top: .6rem; border-radius: 2px; background: var(--uc-amarillo); }
.contact-item { display: flex; align-items: center; gap: .85rem; margin-bottom: .85rem; font-size: .92rem; }
.contact-item__icono {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .16);
    color: #fff;
    transition: background .25s ease, color .25s ease;
}
.contact-item:hover .contact-item__icono { background: #fff; color: var(--uc-verde); }
.footer-horario {
    padding: 1.1rem 1.25rem;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 14px;
    background: rgba(255, 255, 255, .12);
}
.footer-horario__dias { margin: 0 0 .35rem; font-size: .9rem; }
.footer-horario__dias i { margin-right: .4rem; color: var(--uc-amarillo); }
.footer-horario__horas { margin: 0; color: #fff; font-size: 1.5rem; font-weight: 700; }
.social-links { display: flex; gap: .75rem; }
.social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .16);
    color: #fff;
    transition: transform .25s ease, background .25s ease, color .25s ease;
}
.social-icon:hover { transform: translateY(-4px); background: #fff; color: var(--uc-verde); }
.footer-adherido {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 2rem;
    margin-top: 3rem;
    padding: 1rem 1.75rem;
    border-radius: 16px;
    background: #fff;
}
.footer-adherido__titulo { margin: 0; color: var(--uc-verde-osc); font-size: .85rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.partner-logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2rem; }
.partner-logos img { height: 48px; width: auto; object-fit: contain; filter: grayscale(1); opacity: .75; transition: filter .3s ease, opacity .3s ease, transform .3s ease; }
.partner-logos img:hover { filter: none; opacity: 1; transform: scale(1.08); }
.footer-base {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 2.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, .25);
    font-size: .88rem;
}
.footer-copy { margin: 0; }
.footer-copy strong { color: #fff; }
.footer-credito { display: inline-flex; align-items: center; gap: .6rem; padding: .35rem .8rem; border-radius: 999px; background: #fff; color: #5a524c; text-decoration: none; }
.footer-credito img { max-width: 70px; height: auto; }

@media screen and (max-width: 1023px) {
    .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media screen and (max-width: 600px) {
    .footer-grid { grid-template-columns: 1fr; gap: 2rem; }
    .footer-adherido { justify-content: center; text-align: center; }
    .footer-base { justify-content: center; text-align: center; }
}