/*
 * GOXA Speed v3.3
 * Manrope (tytuł) · Exo 2 (UI) · Raspberry · Glassmorphism
 */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700;800&family=Exo+2:wght@200;300;400;500;600&display=swap');

.goxa-speedtest-wrapper {
    --g-raspberry:     #E8325A;
    --g-raspberry-dim: rgba(232,50,90,0.08);
    --g-raspberry-mid: rgba(232,50,90,0.30);
    --g-text:          #FFFFFF;
    --g-text-sec:      #C0C0D8;
    --g-text-dim:      #8A8A9E;
    --g-surface:       rgba(3,3,6,0.45);
    --g-border:        rgba(255,255,255,0.08);
    --g-border-dim:    rgba(255,255,255,0.05);
    --g-font-ui:       'Exo 2', sans-serif;
    --g-font-d:        'Manrope', sans-serif;
    --g-tr:            0.22s ease;

    box-sizing:              border-box;
    background:              rgba(5,5,8,0.52);
    backdrop-filter:         blur(32px);
    -webkit-backdrop-filter: blur(32px);
    border:                  1px solid var(--g-border);
    border-top:              2px solid var(--g-raspberry);
    color:                   var(--g-text);
    font-family:             var(--g-font-ui);
    font-size:               14px;
    line-height:             1.6;
    padding:                 28px 24px 36px;
    max-width:               680px;
    width:                   100%;
    margin:                  0 auto;
    position:                relative;
    overflow:                hidden;
}
.goxa-speedtest-wrapper::after {
    content:''; position:absolute; inset:0;
    background:linear-gradient(135deg,rgba(255,255,255,0.03) 0%,transparent 55%);
    pointer-events:none;
}
.goxa-speedtest-wrapper *,
.goxa-speedtest-wrapper *::before,
.goxa-speedtest-wrapper *::after { box-sizing:inherit; }

/* NAGŁÓWEK */
.goxa-speedtest-header { text-align:left; margin-bottom:24px; position:relative; z-index:1; }
.goxa-speedtest-label {
    display:block; font-size:11px; font-weight:600;
    color:var(--g-raspberry); letter-spacing:.28em;
    text-transform:uppercase; margin-bottom:6px;
    font-family:var(--g-font-ui);
}
.goxa-speedtest-title {
    display:block; font-family:var(--g-font-d);
    font-size:30px; font-weight:800; color:var(--g-text);
    letter-spacing:-.02em; line-height:1.05;
    text-shadow:0 2px 16px rgba(0,0,0,0.4);
}

/* LICZNIK */
.goxa-speedtest-gauge-wrap {
    display:flex; flex-direction:column; align-items:center;
    margin-bottom:20px; position:relative; z-index:1;
}
#goxa-gauge-canvas { display:block; }
.goxa-gauge-value-wrap {
    position:absolute; top:64px; left:50%; transform:translateX(-50%);
    text-align:center; pointer-events:none;
}
.goxa-gauge-value {
    display:block; font-family:var(--g-font-ui); font-size:44px;
    font-weight:200; color:var(--g-text); line-height:1; letter-spacing:-.01em;
    transition:color var(--g-tr);
}
.goxa-gauge-unit {
    display:block; font-size:10px; color:var(--g-text-dim);
    letter-spacing:.2em; text-transform:uppercase; margin-top:5px; font-weight:400;
}
.goxa-gauge-phase {
    margin-top:6px; font-size:11px; letter-spacing:.15em; text-transform:uppercase;
    color:var(--g-raspberry); min-height:16px; text-align:center; font-weight:500;
}

/* PRZYCISK START */
.goxa-speedtest-btn {
    display:flex; align-items:center; justify-content:center; gap:10px;
    width:100%; padding:14px 24px; background:transparent;
    border:1px solid var(--g-raspberry); color:var(--g-raspberry);
    font-family:var(--g-font-ui); font-size:11px; letter-spacing:.2em;
    text-transform:uppercase; cursor:pointer; outline:none; font-weight:600;
    -webkit-tap-highlight-color:transparent;
    transition:background var(--g-tr), opacity var(--g-tr);
    margin-bottom:20px; position:relative; z-index:1;
}
.goxa-speedtest-btn:hover  { background:var(--g-raspberry-dim); }
.goxa-speedtest-btn:active { opacity:.8; }
.goxa-speedtest-btn:disabled { opacity:.3; cursor:not-allowed; }
.goxa-btn-arrow { font-size:14px; transition:transform var(--g-tr); }
.goxa-speedtest-btn:not(:disabled):hover .goxa-btn-arrow { transform:translateX(4px); }

/* POSTĘP */
.goxa-progress-wrap {
    height:1px; background:var(--g-border); margin-bottom:20px;
    overflow:hidden; opacity:0; transition:opacity .3s; position:relative; z-index:1;
}
.goxa-progress-wrap.visible { opacity:1; }
.goxa-progress-bar { height:100%; width:0%; background:var(--g-raspberry); transition:width .2s linear; }

/* WYNIKI */
.goxa-speedtest-results {
    display:grid; grid-template-columns:repeat(3,1fr);
    gap:1px; background:var(--g-border); border:1px solid var(--g-border);
    margin-bottom:14px; position:relative; z-index:1;
}
.goxa-result-item {
    background:var(--g-surface); padding:18px 12px 14px; text-align:left;
    display:flex; flex-direction:column; gap:4px;
    border-left:2px solid transparent; transition:border-left-color var(--g-tr);
}
.goxa-result-item.active { border-left-color:var(--g-raspberry); }
.goxa-result-icon  { font-size:12px; color:var(--g-raspberry); }
.goxa-result-label { font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--g-text-sec); font-weight:500; }
.goxa-result-value { font-size:22px; font-weight:300; color:var(--g-text); line-height:1; min-height:26px; }
.goxa-result-value.filled { color:var(--g-raspberry); }
.goxa-result-unit  { font-size:9px; color:var(--g-text-dim); }

/* DATA */
.goxa-speedtest-datetime {
    text-align:left; font-size:10px; color:var(--g-text-dim);
    letter-spacing:.1em; min-height:14px; margin-bottom:24px; position:relative; z-index:1;
}

/* HISTORIA */
.goxa-history-wrap  { border-top:1px solid var(--g-border); padding-top:18px; position:relative; z-index:1; }
.goxa-history-title { font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--g-text-dim); margin-bottom:12px; font-weight:500; }
.goxa-history-table { width:100%; border-collapse:collapse; font-size:11px; table-layout:fixed; }
.goxa-history-table th:nth-child(1), .goxa-history-table td:nth-child(1) { width:38%; }
.goxa-history-table th:nth-child(2), .goxa-history-table td:nth-child(2),
.goxa-history-table th:nth-child(3), .goxa-history-table td:nth-child(3),
.goxa-history-table th:nth-child(4), .goxa-history-table td:nth-child(4) { width:20.67%; }
.goxa-history-table th {
    text-align:left; padding:5px 8px; font-weight:500; font-size:10px;
    letter-spacing:.1em; text-transform:uppercase; color:var(--g-text-dim);
    border-bottom:1px solid var(--g-border);
}
.goxa-history-table td {
    padding:8px; color:var(--g-text-sec); border-bottom:1px solid var(--g-border);
    vertical-align:middle; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.goxa-history-table tr:last-child td { border-bottom:none; }
.goxa-history-table tr:first-child td { color:var(--g-raspberry); }

/* BŁĄD */
.goxa-error-msg { margin-top:12px; font-size:11px; color:#FF4466; text-align:left; min-height:14px; position:relative; z-index:1; }

/* MOBILE */
@media (max-width:480px) {
    .goxa-speedtest-wrapper { padding:22px 14px 30px; }
    .goxa-speedtest-title   { font-size:24px; }
    .goxa-gauge-value       { font-size:36px; }
    #goxa-gauge-canvas      { width:220px !important; height:135px !important; }
    .goxa-gauge-value-wrap  { top:54px; }
    .goxa-result-value      { font-size:18px; }
    .goxa-history-table th,
    .goxa-history-table td  { padding:5px 4px; font-size:10px; }
}
@media (max-width:360px) { .goxa-speedtest-results { grid-template-columns:1fr; } }

/* ── FIX: Hover malinowy z białym tekstem (nie koralowy) ── */
.goxa-speedtest-btn:hover {
    background: #E8325A !important;
    color:      #FFFFFF !important;
}
.goxa-speedtest-btn:hover .goxa-btn-arrow {
    color: #FFFFFF !important;
    transform: translateX(4px);
}

/* ── FIX: Przycisk EXPAND — nie wyjeżdża poza kontener ── */
.goxa-expand-btn {
    position: absolute !important;
    top:      12px !important;
    right:    12px !important;
    max-width: calc(100% - 24px) !important;
}