/*
 * WARP — WRU Applied Research Proceedings
 * FILE: /publications/warp/assets/css/style.css
 * Global shared styles — supplements inline styles in each page
 */

/* ── Reset & Base ────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }
body {
    font-family: 'Source Sans 3', 'Segoe UI', Arial, sans-serif;
    background: #f5f0e8;
    color: #1a1a2e;
    line-height: 1.6;
}
a { text-decoration: none; color: inherit; }
img { display: block; max-width: 100%; }
button { cursor: pointer; font-family: inherit; }

/* ── Typography ──────────────────────────────────────────── */
h1, h2, h3, h4 { line-height: 1.2; }
.serif { font-family: 'Playfair Display', Georgia, serif; }

/* ── Utility ─────────────────────────────────────────────── */
.text-gold    { color: #c9a84c; }
.text-maroon  { color: #7b1c2e; }
.text-blue    { color: #0d1b3e; }
.text-muted   { color: #5a6070; }
.text-center  { text-align: center; }
.mt-1 { margin-top: 8px; }
.mt-2 { margin-top: 16px; }
.mt-3 { margin-top: 24px; }
.mt-4 { margin-top: 36px; }
.mb-1 { margin-bottom: 8px; }
.mb-2 { margin-bottom: 16px; }
.mb-3 { margin-bottom: 24px; }
.d-flex { display: flex; }
.gap-2 { gap: 16px; }
.flex-wrap { flex-wrap: wrap; }
.align-center { align-items: center; }

/* ── Shared Button Styles ────────────────────────────────── */
.warp-btn {
    display: inline-block;
    padding: 11px 22px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13px;
    transition: all .2s;
    border: none;
    font-family: inherit;
    cursor: pointer;
}
.warp-btn-primary   { background: #7b1c2e; color: #fff; }
.warp-btn-primary:hover { background: #9e2438; transform: translateY(-1px); }
.warp-btn-secondary { background: #0d1b3e; color: #fff; }
.warp-btn-secondary:hover { background: #1a3060; }
.warp-btn-gold      { background: #c9a84c; color: #0d1b3e; }
.warp-btn-gold:hover { background: #d4b05a; }
.warp-btn-outline   { background: transparent; border: 1px solid #c9a84c; color: #c9a84c; }
.warp-btn-outline:hover { background: rgba(201,168,76,.1); }

/* ── Alert / Notice ──────────────────────────────────────── */
.warp-alert {
    padding: 14px 18px;
    border-radius: 10px;
    font-size: .9rem;
    line-height: 1.7;
    margin-bottom: 16px;
    border-left: 4px solid;
}
.warp-alert-info    { background: #eff6ff; border-color: #3b82f6; color: #1e40af; }
.warp-alert-success { background: #ecfdf5; border-color: #10b981; color: #065f46; }
.warp-alert-warning { background: #fffbeb; border-color: #f59e0b; color: #92400e; }
.warp-alert-ethics  {
    background: rgba(201,168,76,.08);
    border-color: #c9a84c;
    color: #1a1a2e;
    font-size: .85rem;
}

/* ── Card ────────────────────────────────────────────────── */
.warp-card {
    background: #fff;
    border-radius: 14px;
    border: 1px solid #ddd8ce;
    overflow: hidden;
    transition: transform .3s, box-shadow .3s;
}
.warp-card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(13,27,62,.14); }

/* ── Form styles ─────────────────────────────────────────── */
.warp-form-group { margin-bottom: 20px; }
.warp-form-group label {
    display: block; font-size: 13px; font-weight: 700;
    color: #1a1a2e; margin-bottom: 6px;
}
.warp-form-group label span.req { color: #7b1c2e; margin-left: 3px; }
.warp-input, .warp-textarea, .warp-select {
    width: 100%;
    padding: 11px 14px;
    border: 1px solid #ddd8ce;
    border-radius: 8px;
    font-size: .95rem;
    font-family: inherit;
    color: #1a1a2e;
    background: #fff;
    transition: border-color .2s, box-shadow .2s;
    outline: none;
}
.warp-input:focus, .warp-textarea:focus, .warp-select:focus {
    border-color: #7b1c2e;
    box-shadow: 0 0 0 3px rgba(123,28,46,.12);
}
.warp-textarea { resize: vertical; min-height: 100px; }
.warp-input-hint { font-size: 11px; color: #5a6070; margin-top: 5px; }

/* ── Ethics Notice (shown on every abstract) ─────────────── */
.ethics-notice {
    background: #faf7f0;
    border: 1px solid #e8cc7a;
    border-left: 4px solid #c9a84c;
    border-radius: 10px;
    padding: 14px 18px;
    font-size: .83rem;
    color: #5a4a20;
    line-height: 1.75;
    margin-top: 24px;
}
.ethics-notice strong { color: #7b1c2e; }

/* ── Badge ───────────────────────────────────────────────── */
.warp-badge {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 10px; font-weight: 700; padding: 3px 10px;
    border-radius: 12px; letter-spacing: .05em; text-transform: uppercase;
}
.badge-ieee        { background: #e8f0fe; color: #1a56db; }
.badge-published   { background: #ecfdf5; color: #065f46; }
.badge-pending     { background: #fef3c7; color: #92400e; }
.badge-warp        { background: rgba(123,28,46,.1); color: #7b1c2e; }
.badge-google      { background: #fce8e6; color: #c5221f; }

/* ── Pagination ──────────────────────────────────────────── */
.warp-pagination {
    display: flex; align-items: center; justify-content: center;
    gap: 6px; margin-top: 32px; flex-wrap: wrap;
}
.warp-pagination a, .warp-pagination span {
    width: 36px; height: 36px; border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 700;
    border: 1px solid #ddd8ce; background: #fff;
    color: #1a1a2e; transition: all .2s;
}
.warp-pagination a:hover { background: #7b1c2e; color: #fff; border-color: #7b1c2e; }
.warp-pagination span.current { background: #0d1b3e; color: #fff; border-color: #0d1b3e; }

/* ── Mobile ──────────────────────────────────────────────── */
@media (max-width: 680px) {
    .warp-btn { padding: 10px 16px; font-size: 12px; }
}