/*
 * Flamenet Affiliates — Frontend styles
 * Used by [flamenet_affiliate] shortcode.
 */

.fnaff-wrap {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    margin-bottom: 16px;
    max-width: 680px;
}

/* -------------------------------------------------------
   Header
------------------------------------------------------- */
.fnaff-header {
    background: linear-gradient(180deg, #596EBB 0%, #1835A0 50%, #13297D 100%);
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    padding: 4px 8px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border: 1px solid #122678;
    border-bottom: none;
}

/* -------------------------------------------------------
   Body
------------------------------------------------------- */
.fnaff-body {
    border: 1px solid #7F9DB9;
    background: #FFFFFF;
    padding: 14px 16px;
}

.fnaff-body p,
.fnaff-body ul {
    font-size: 12px;
    margin: 0 0 10px;
    color: #333;
}

.fnaff-benefits {
    padding-left: 18px;
    margin-bottom: 12px;
}

.fnaff-benefits li {
    margin-bottom: 4px;
}

/* -------------------------------------------------------
   Notices
------------------------------------------------------- */
.fnaff-notice {
    padding: 8px 10px;
    font-size: 11px;
    border: 1px solid #7F9DB9;
    margin-bottom: 12px;
}

.fnaff-notice-success { background: #EEF2FF; color: #1835A0; border-color: #7F9DB9; }
.fnaff-notice-info    { background: #FFFBE6; color: #665000; border-color: #CCAA00; }
.fnaff-notice-error   { background: #FFF0F0; color: #CC0000; border-color: #CC0000; }

/* -------------------------------------------------------
   Stats row
------------------------------------------------------- */
.fnaff-stats {
    display: flex;
    gap: 1px;
    margin-bottom: 16px;
    background: linear-gradient(180deg, #9EB5CA 0%, #7F9DB9 50%, #667E94 100%);
    border: 1px solid #7F9DB9;
}

.fnaff-stat {
    flex: 1;
    background: #fff;
    padding: 10px 12px;
    text-align: center;
}

.fnaff-stat-val {
    display: block;
    font-size: 20px;
    font-weight: bold;
    color: #1835A0;
    font-family: "Courier New", Courier, monospace;
}

.fnaff-stat-lbl {
    display: block;
    font-size: 10px;
    color: #666;
    margin-top: 2px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* -------------------------------------------------------
   Sections
------------------------------------------------------- */
.fnaff-section {
    margin-bottom: 16px;
}

.fnaff-section-title {
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #1835A0;
    border-bottom: 1px solid #7F9DB9;
    padding-bottom: 3px;
    margin: 0 0 8px;
}

/* -------------------------------------------------------
   Referral link row
------------------------------------------------------- */
.fnaff-reflink-wrap {
    display: flex;
    gap: 6px;
    align-items: center;
}

.fnaff-reflink-input {
    flex: 1;
    font-family: "Courier New", Courier, monospace;
    font-size: 12px;
    padding: 4px 6px;
    border: 1px solid #7F9DB9;
    background: #EEF2FF;
    color: #1835A0;
    font-weight: bold;
}

/* -------------------------------------------------------
   Buttons
------------------------------------------------------- */
.fnaff-btn {
    background: linear-gradient(180deg, #596EBB 0%, #1835A0 50%, #13297D 100%);
    color: #fff;
    border: 1px solid #122678;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    padding: 5px 16px;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.fnaff-btn:hover {
    background: linear-gradient(180deg, #3F8BBD 0%, #0266A8 50%, #025286 100%);
}

.fnaff-btn-sm {
    padding: 4px 10px;
    font-size: 11px;
}

/* -------------------------------------------------------
   Table
------------------------------------------------------- */
.fnaff-table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #7F9DB9;
    font-size: 12px;
    font-family: "Courier New", Courier, monospace;
}

.fnaff-table th {
    background: linear-gradient(180deg, #596EBB 0%, #1835A0 50%, #13297D 100%);
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: bold;
    padding: 4px 8px;
    text-align: left;
    border: 1px solid #122678;
}

.fnaff-table td {
    padding: 4px 8px;
    border-bottom: 1px solid #C8D8E8;
    font-family: Arial, Helvetica, sans-serif;
}

.fnaff-row-even { background: #FFFFFF; }
.fnaff-row-odd  { background: #EEF2FF; }

.fnaff-row-even:hover,
.fnaff-row-odd:hover { background: linear-gradient(180deg, #DBE6FF 0%, #D0DEFF 50%, #A6B2CC 100%); }

/* -------------------------------------------------------
   Conversion status colours
------------------------------------------------------- */
.fnaff-status-pending  { color: #666; }
.fnaff-status-approved { color: #006600; font-weight: bold; }
.fnaff-status-paid     { color: #1835A0; font-weight: bold; }
.fnaff-status-rejected { color: #CC0000; }

/* -------------------------------------------------------
   Fine print
------------------------------------------------------- */
.fnaff-note {
    font-size: 10px;
    color: #666;
    margin: 6px 0 0;
}

/* -------------------------------------------------------
   Responsive
------------------------------------------------------- */
@media (max-width: 480px) {
    .fnaff-stats {
        flex-wrap: wrap;
    }
    .fnaff-stat {
        flex: 1 1 45%;
    }
    .fnaff-reflink-wrap {
        flex-direction: column;
        align-items: stretch;
    }
}
