/* eComply — inicio (dashboard) y login de Gitea.
   Usa las variables de tema de Gitea (--color-*) para seguir claro/oscuro. */
:root{
  --ec-cyan:#71c8dc; --ec-blue:#3b91cf; --ec-deep:#2f5fa8;
  --ec-disp:"Outfit",var(--fonts-regular,-apple-system,"Segoe UI",system-ui,Roboto,sans-serif);
}

/* ===== logo sobre placa (legible en ambos temas) ===== */
.ecomply-logo{display:inline-block;line-height:0;background:#fff;border:1px solid var(--color-secondary);border-radius:10px;padding:8px 12px}
.ecomply-logo img{height:44px;width:auto;display:block}

/* ===== bloque de inicio ===== */
.ecomply-home.ui.container{position:relative;overflow:hidden;background:var(--color-box-body);color:var(--color-text);border:1px solid var(--color-secondary);border-radius:12px;padding:24px 28px 22px;margin-bottom:16px}
.ecomply-home::before{content:"";position:absolute;right:-6%;top:-70%;width:46%;height:240%;background:linear-gradient(160deg,var(--ec-cyan) 0%,var(--ec-blue) 55%,var(--ec-deep) 100%);opacity:.14;transform:rotate(22deg);border-radius:60px;pointer-events:none}
.ecomply-home::after{content:"";position:absolute;right:26%;top:-40%;width:8%;height:180%;background:linear-gradient(160deg,var(--ec-cyan),var(--ec-deep));opacity:.10;transform:rotate(22deg);border-radius:40px;pointer-events:none}
.ecomply-home > *{position:relative}
.ecomply-home-top{display:flex;flex-wrap:wrap;align-items:center;gap:20px 30px}
.ecomply-greet h2{font:700 24px/1.15 var(--ec-disp);margin:0;letter-spacing:-.01em;color:var(--color-text)}
.ecomply-greet h2 span{background:linear-gradient(90deg,var(--ec-blue),var(--ec-deep));-webkit-background-clip:text;background-clip:text;color:transparent}
.ecomply-greet p{margin:4px 0 0;color:var(--color-text-light-2);max-width:60ch}
.ecomply-stat{margin-left:auto;display:flex;gap:22px}
.ecomply-stat div{display:grid;gap:2px}
.ecomply-stat b{font:700 22px/1 var(--ec-disp);font-variant-numeric:tabular-nums;color:var(--color-text)}
.ecomply-stat small{color:var(--color-text-light-2);text-transform:uppercase;letter-spacing:.06em;font-size:10.5px;font-weight:600}

.ecomply-tiles{margin-top:18px;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.ecomply-tile{display:flex;gap:12px;align-items:flex-start;background:var(--color-card);border:1px solid var(--color-secondary);border-radius:10px;padding:12px 14px;color:var(--color-text);transition:background .15s,border-color .15s,transform .15s}
.ecomply-tile:hover{background:var(--color-hover);border-color:var(--ec-blue);transform:translateY(-1px);color:var(--color-text)}
.ecomply-tile .ic{flex:none;width:34px;height:34px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(135deg,var(--ec-cyan),var(--ec-deep));color:#fff}
.ecomply-tile .ic svg{fill:currentColor}
.ecomply-tile b{display:block;font:700 14px/1.2 var(--ec-disp)}
.ecomply-tile span{display:block;color:var(--color-text-light-2);font-size:12px;margin-top:2px}

.ecomply-tools{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ecomply-tools .lbl{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-light-2);margin-right:6px}
.ecomply-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--color-secondary);border-radius:999px;padding:5px 11px;font-weight:600;font-size:12.5px;background:var(--color-box-body);color:var(--color-text)}
.ecomply-chip:hover{border-color:var(--ec-blue);color:var(--color-text)}
.ecomply-chip .host{color:var(--color-text-light-2);font-weight:500}
.ecomply-chip svg{fill:var(--color-text-light-2)}
@media (prefers-reduced-motion:reduce){.ecomply-tile{transition:none}}
@media (max-width:767px){.ecomply-home.ui.container{padding:18px 16px}.ecomply-stat{margin-left:0}}

/* ===== dashboard: heatmap y feed en tarjetas ===== */
.dashboard.feeds .flex-container-main .activity-heatmap-container{background:var(--color-box-body);border:1px solid var(--color-secondary);border-radius:10px;padding:14px 16px 10px;margin-bottom:14px}
.dashboard.feeds .flex-container-main .activity-heatmap-container .activity-heatmap{border:0;padding:0}
.dashboard.feeds #activity-feed{background:var(--color-box-body);border:1px solid var(--color-secondary);border-radius:10px;padding:2px 16px}
.dashboard.feeds #activity-feed > div.item{padding:12px 0}
.dashboard.feeds .flex-container-sidebar .dashboard-repos,.dashboard.feeds .flex-container-sidebar .ui.segment{border-radius:10px}
.dashboard.feeds .flex-container-sidebar .ui.top.attached.header{border-radius:10px 10px 0 0}


/* ===== heatmap: el de Gitea tal cual, solo esquinas redondeadas ===== */
#user-heatmap .heatmap-day{rx:2px;ry:2px}
#user-heatmap .heatmap-legend-svg rect{rx:1.5px;ry:1.5px}

/* ===== feed: hora a la derecha, sin iconos laterales, sha como texto mono ===== */
.dashboard.feeds #activity-feed > div.item{padding:12px 0;gap:12px}
.dashboard.feeds #activity-feed .pagination{margin:12px 0 10px}
.dashboard.feeds #activity-feed .item-trailing{display:none}
.dashboard.feeds #activity-feed .item-leading .avatar,.dashboard.feeds #activity-feed .item-leading img{border-radius:50%}
.dashboard.feeds #activity-feed .item-main > div:first-child relative-time,.dashboard.feeds #activity-feed .item-main > div:first-child .time-since{float:right;margin-left:12px;color:var(--color-text-light-2);font-size:12px;white-space:nowrap}
.dashboard.feeds #activity-feed .item-main .ui.sha.label{background:transparent !important;border:0 !important;padding:0 !important;margin:0 !important;font-weight:500;color:var(--ec-deep) !important;font-size:12px}
.dashboard.feeds #activity-feed .item-main > div:first-child > a:first-child{color:var(--color-text);font-weight:600}
.dashboard.feeds #activity-feed .item-main .flex-text-block img.avatar,.dashboard.feeds #activity-feed .item-main .flex-text-block .avatar-stack,.dashboard.feeds #activity-feed .item-main .flex-text-block > a.avatar{display:none}

.dashboard.feeds #activity-feed .item-main .flex-text-block > span{color:var(--color-text-light-2);font-size:12.5px}

/* ===== login ===== */
.ecomply-login.ui.container{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);max-width:1000px !important;min-height:520px;border:1px solid var(--color-secondary);border-radius:14px;overflow:hidden;background:var(--color-box-body);margin-top:24px;margin-bottom:24px}
@media (max-width:820px){.ecomply-login.ui.container{grid-template-columns:1fr}}
.ecomply-brand{position:relative;overflow:hidden;color:#fff;padding:40px 40px 32px;display:flex;flex-direction:column;justify-content:space-between;gap:24px;background:linear-gradient(150deg,#16325e 0%,var(--ec-deep) 45%,#2a7fc0 100%)}
.ecomply-brand::before{content:"";position:absolute;left:-10%;bottom:-60%;width:38%;height:170%;background:linear-gradient(160deg,var(--ec-cyan),var(--ec-blue));opacity:.28;transform:rotate(22deg);border-radius:60px}
.ecomply-brand::after{content:"";position:absolute;left:30%;top:-50%;width:6%;height:170%;background:var(--ec-cyan);opacity:.18;transform:rotate(22deg);border-radius:40px}
.ecomply-brand > *{position:relative}
.ecomply-brand .ecomply-logo{align-self:flex-start;border-color:transparent;padding:10px 14px}
.ecomply-brand .ecomply-logo img{height:40px}
.ecomply-brand h2{font:800 32px/1.1 var(--ec-disp);margin:0 0 10px;letter-spacing:-.015em;color:#fff;max-width:14ch}
.ecomply-brand p{margin:0;color:rgba(255,255,255,.82);max-width:44ch;font-size:15px}
.ecomply-brand .facts{display:flex;gap:26px;margin-top:26px;flex-wrap:wrap}
.ecomply-brand .facts b{font:700 18px/1 var(--ec-disp);display:block;color:#fff}
.ecomply-brand .facts small{color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.07em;font-size:10.5px;font-weight:600}
.ecomply-brand .foot{color:rgba(255,255,255,.6);font-size:12px}
.ecomply-form{padding:40px 40px;display:flex;flex-direction:column;justify-content:center;gap:0}
.ecomply-form .ui.container.fluid{width:100% !important;max-width:none !important;margin:0 !important;padding:0 !important}
/* caja de Gitea → plano */
.ecomply-form .ui.top.attached.header{background:transparent !important;border:0 !important;padding:0 !important;margin:0 0 20px !important;text-align:left !important;font-family:var(--ec-disp);font-weight:700;font-size:22px;line-height:1.2;color:var(--color-text);border-radius:0}
.ecomply-form .ui.top.attached.header::after{display:block;margin-top:4px;font-family:var(--fonts-regular,inherit);font-weight:400;font-size:14px;color:var(--color-text-light-2);content:"Use your eComply Gitea account."}
html[lang="es-ES"] .ecomply-form .ui.top.attached.header::after{content:"Usa tu cuenta de Gitea de eComply."}
html[lang="de-DE"] .ecomply-form .ui.top.attached.header::after{content:"Melde dich mit deinem eComply-Gitea-Konto an."}
.ecomply-form .ui.attached.segment{border:0 !important;padding:0 !important;margin:0 !important;background:transparent !important;box-shadow:none !important;border-radius:0}
.ecomply-form .ui.form .field{margin-bottom:14px}
.ecomply-form .ui.form label{font-weight:600}
.ecomply-form .ui.form input[type="text"],.ecomply-form .ui.form input[type="password"]{padding:10px 12px}
.ecomply-form .ui.primary.button{background:linear-gradient(90deg,var(--ec-blue),var(--ec-deep));font-weight:700;padding:11px}
.ecomply-form .ui.primary.button:hover{background:linear-gradient(90deg,var(--ec-deep),var(--ec-deep))}
.ecomply-form .divider.divider-text{margin:16px 0}
/* passkey: de caja aparte a botón secundario */
.ecomply-form .ui.attached.segment.header{margin-top:10px !important;max-width:none !important;align-items:stretch !important}
.ecomply-form .signin-passkey{display:block;text-align:center;border:1px solid var(--color-secondary);border-radius:6px;padding:10px;font-weight:600;color:var(--color-text);background:var(--color-box-body);cursor:pointer}
.ecomply-form .signin-passkey:hover{border-color:var(--ec-blue);color:var(--color-text)}
@media (max-width:820px){.ecomply-brand{padding:28px 24px}.ecomply-form{padding:24px 20px}}