﻿/* ============================================
   CSS: actions.css — Olemurcia
   Componente: Acciones grid + Vacio + Pie
   ============================================ */

    .acciones{

        display:grid;

        gap:14px;

        grid-template-columns:repeat(auto-fit, minmax(80px, 1fr));

    }

    .accion{

        display:flex;

        flex-direction:column;

        align-items:center;

        text-align:center;

        text-decoration:none;

        color:var(--texto);

        background:var(--superficie);

        border:1px solid var(--borde);

        border-radius:var(--radio);

        padding:14px 8px 10px;

        min-width:0;

        overflow:hidden;

        transition:.2s;

        backdrop-filter:blur(12px);

        -webkit-backdrop-filter:blur(12px);

    }

    .accion:hover{

        border-color:rgba(125,217,255,.35);

        background:rgba(125,217,255,.06);

        transform:translateY(-2px);

    }

    .accion h3{

        display:flex;

        flex-direction:column;

        align-items:center;

        gap:6px;

        font-size:11px;

        font-weight:500;

        margin:0;

        overflow:hidden;

        line-height:1.3;

    }

    .accion h3 .accion-nombre{

        overflow:hidden;

        text-overflow:ellipsis;

        white-space:nowrap;

        min-width:0;

        max-width:80px;

    }

    .accion-icono{

        flex:none;

        width:44px;

        height:44px;

        border-radius:12px;

        background:rgba(255,255,255,.08);

        display:inline-flex;

        align-items:center;

        justify-content:center;

        font-size:24px;

        overflow:hidden;

    }

    .accion-icono img{

        width:100%;

        height:100%;

        object-fit:cover;

    }

    .vacio{

        text-align:center;

        color:var(--difuso);

        padding:30px;

        background:var(--superficie);

        border:1px dashed var(--borde);

        border-radius:var(--radio);

        font-size:13px;

    }

    .pie{

        text-align:center;

        color:var(--difuso);

        font-size:12px;

        margin-top:40px;

        padding-top:20px;

        border-top:1px solid var(--borde);

    }
