/* =========================================================
   DataFirefly — Affiliate program styles
   Front-end (page-templates/affiliate.php + my-account dashboard)
   AND admin (datafirefly-affiliate page)
   ========================================================= */

/* ============================================================
   FRONT-END : public program page
   ============================================================ */

.df-aff-program{
	max-width:1100px;
	margin:0 auto;
	padding:32px 24px 96px;
}

/* ---- HERO ---- */
.df-aff-hero-section{
	padding:32px 0 56px;
	border-bottom:1px solid var(--line);
}
.df-aff-hero-section .df-h-xl em{
	color:var(--amber-deep);
	font-style:italic;
}
.df-aff-hero-stats{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
	gap:20px;
	margin:36px 0 28px;
}
.df-aff-hero-stat{
	padding:18px 20px;
	background:var(--card);
	border:1px solid var(--line);
	border-radius:14px;
	box-shadow:var(--shadow);
}
.df-aff-hero-stat-n{
	font-size:28px;
	font-weight:600;
	color:var(--ink);
	line-height:1.1;
}
.df-aff-hero-stat-n span{
	font-size:16px;
	font-weight:400;
	color:var(--ink-3);
	margin-left:4px;
}
.df-aff-hero-stat-l{
	font-size:13px;
	color:var(--ink-3);
	margin-top:6px;
}
.df-aff-hero-cta{
	display:flex;
	gap:14px;
	flex-wrap:wrap;
	align-items:center;
	margin-top:8px;
}
.df-aff-status-pill{
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:8px 16px;
	background:color-mix(in oklab, var(--amber) 18%, transparent);
	color:var(--amber-deep);
	border-radius:99px;
	font-size:14px;
	font-weight:500;
}
.df-aff-status-pill::before{
	content:'';
	display:inline-block;
	width:8px;
	height:8px;
	border-radius:50%;
	background:var(--amber-deep);
}
.df-aff-status-pill-warn{
	background:color-mix(in oklab, #f5a83a 18%, transparent);
	color:#a96b00;
}
.df-aff-status-pill-warn::before{background:#a96b00;}

/* ---- HOW IT WORKS ---- */
.df-aff-how{padding:64px 0;border-bottom:1px solid var(--line);}
.df-aff-steps{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
	gap:24px;
	list-style:none;
	padding:0;
	margin:36px 0 0;
	counter-reset:none;
}
.df-aff-steps li{
	padding:28px 26px;
	background:var(--card);
	border:1px solid var(--line);
	border-radius:18px;
	box-shadow:var(--shadow);
	position:relative;
}
.df-aff-step-n{
	width:38px;
	height:38px;
	display:grid;
	place-items:center;
	background:var(--amber);
	color:#1a1207;
	border-radius:50%;
	font-weight:700;
	font-size:18px;
	margin-bottom:14px;
}
.df-aff-steps h3{
	font-size:18px;
	margin:0 0 8px;
	color:var(--ink);
}
.df-aff-steps p{
	font-size:14.5px;
	color:var(--ink-2);
	line-height:1.55;
	margin:0;
}

/* ---- CALCULATOR ---- */
.df-aff-calc{padding:64px 0;border-bottom:1px solid var(--line);}
.df-aff-calc-head{text-align:center;max-width:680px;margin:0 auto 32px;}
.df-aff-calc-card{
	background:var(--card);
	border:1px solid var(--line);
	border-radius:20px;
	padding:36px;
	box-shadow:var(--shadow-lg);
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:48px;
	align-items:center;
}
@media (max-width:768px){
	.df-aff-calc-card{grid-template-columns:1fr;gap:28px;padding:24px;}
}
.df-aff-calc-input label{
	display:block;
	font-size:13px;
	color:var(--ink-3);
	text-transform:uppercase;
	letter-spacing:.1em;
	margin-bottom:14px;
}
.df-aff-calc-input input[type=range]{
	width:100%;
	accent-color:var(--amber-deep);
	height:6px;
}
.df-aff-calc-value{
	margin-top:14px;
	font-size:22px;
	color:var(--ink);
	font-weight:600;
}
.df-aff-calc-value span{color:var(--amber-deep);font-size:36px;}
.df-aff-calc-output{
	background:color-mix(in oklab, var(--amber) 10%, transparent);
	border-radius:14px;
	padding:24px;
}
.df-aff-calc-row{
	display:flex;
	justify-content:space-between;
	align-items:baseline;
	padding:10px 0;
	border-bottom:1px dashed color-mix(in oklab, var(--amber-deep) 20%, transparent);
}
.df-aff-calc-row:last-child{border-bottom:0;}
.df-aff-calc-row span{color:var(--ink-2);font-size:14px;}
.df-aff-calc-row strong{color:var(--ink);font-size:18px;}
.df-aff-calc-payout strong{color:var(--amber-deep);font-size:28px;font-weight:700;}
.df-aff-calc-yearly{margin-top:6px;}
.df-aff-calc-yearly strong{color:var(--amber-deep);}

/* ---- WHO ---- */
.df-aff-who{padding:64px 0;border-bottom:1px solid var(--line);}
.df-aff-who-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
	gap:18px;
	margin-top:32px;
}
.df-aff-who-card{
	padding:22px;
	background:var(--card);
	border:1px solid var(--line);
	border-radius:14px;
}
.df-aff-who-ico{
	font-size:28px;
	margin-bottom:10px;
}
.df-aff-who-card h3{
	font-size:17px;
	margin:0 0 6px;
	color:var(--ink);
}
.df-aff-who-card p{
	font-size:14px;
	color:var(--ink-2);
	margin:0;
}

/* ---- INCLUDED ---- */
.df-aff-included{padding:64px 0;border-bottom:1px solid var(--line);}
.df-aff-included-grid{
	display:grid;
	grid-template-columns:1.4fr 1fr;
	gap:48px;
	align-items:start;
}
@media (max-width:880px){
	.df-aff-included-grid{grid-template-columns:1fr;gap:32px;}
}
.df-aff-included-list{
	list-style:none;
	padding:0;
	margin:24px 0 0;
}
.df-aff-included-list li{
	padding:10px 0;
	border-bottom:1px solid var(--line);
	font-size:15px;
	color:var(--ink-2);
	display:flex;
	align-items:flex-start;
	gap:12px;
}
.df-aff-included-list li:last-child{border-bottom:0;}
.df-aff-tick{
	flex-shrink:0;
	width:22px;
	height:22px;
	border-radius:50%;
	background:var(--amber);
	color:#1a1207;
	font-weight:700;
	display:grid;
	place-items:center;
	font-size:13px;
	margin-top:1px;
}
.df-aff-included-card{
	background:#1a1207;
	color:#fff8e6;
	border-radius:18px;
	padding:28px;
	box-shadow:var(--shadow-lg);
}
.df-aff-included-card-eyebrow{
	font-size:11px;
	text-transform:uppercase;
	letter-spacing:.15em;
	color:#f0a830;
	margin-bottom:8px;
}
.df-aff-included-card-link{
	background:rgba(255,255,255,.06);
	border-radius:8px;
	padding:10px 14px;
	margin-bottom:18px;
	overflow-x:auto;
}
.df-aff-included-card-link code{
	font-family:'JetBrains Mono', ui-monospace, monospace;
	font-size:13px;
	color:#fff8e6;
	white-space:nowrap;
}
.df-aff-included-card-note{
	font-size:13.5px;
	color:rgba(255,248,230,.7);
	margin:14px 0 0;
	line-height:1.55;
}

/* ---- FAQ ---- */
.df-aff-faq{padding:64px 0;border-bottom:1px solid var(--line);}
.df-aff-faq-list{margin-top:32px;}
.df-aff-faq details{
	background:var(--card);
	border:1px solid var(--line);
	border-radius:14px;
	margin-bottom:12px;
	overflow:hidden;
}
.df-aff-faq summary{
	padding:18px 22px;
	cursor:pointer;
	font-weight:500;
	font-size:16px;
	color:var(--ink);
	list-style:none;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.df-aff-faq summary::-webkit-details-marker{display:none;}
.df-aff-faq summary::after{
	content:'+';
	font-size:22px;
	color:var(--ink-3);
	transition:transform .2s;
}
.df-aff-faq details[open] summary::after{
	content:'−';
	color:var(--amber-deep);
}
.df-aff-faq details p{
	padding:0 22px 20px;
	margin:0;
	color:var(--ink-2);
	font-size:14.5px;
	line-height:1.6;
}
.df-aff-faq-terms-body{padding:0 22px 22px;font-size:14px;color:var(--ink-2);}

/* ---- SIGNUP ---- */
.df-aff-signup-section{padding:64px 0;}
.df-aff-signup-card{
	background:var(--card);
	border:1px solid var(--line);
	border-radius:18px;
	padding:36px;
	box-shadow:var(--shadow-lg);
	max-width:640px;
	margin:0 auto;
}
.df-aff-signup-card-ok{
	background:color-mix(in oklab, var(--amber) 14%, var(--card));
	border-color:var(--amber);
}
.df-aff-signup-card-info{
	text-align:center;
}
.df-aff-signup-form{margin-top:24px;}
.df-aff-signup-form label{
	display:block;
	margin-bottom:18px;
}
.df-aff-signup-form label > span{
	display:block;
	font-size:13px;
	font-weight:500;
	color:var(--ink-2);
	margin-bottom:6px;
}
.df-aff-signup-form input[type=url],
.df-aff-signup-form input[type=text],
.df-aff-signup-form select,
.df-aff-signup-form textarea{
	width:100%;
	padding:12px 14px;
	border:1px solid var(--line);
	border-radius:10px;
	background:var(--bg);
	color:var(--ink);
	font-size:15px;
	font-family:inherit;
	transition:border-color .15s;
}
.df-aff-signup-form input:focus,
.df-aff-signup-form select:focus,
.df-aff-signup-form textarea:focus{
	outline:none;
	border-color:var(--amber-deep);
	box-shadow:0 0 0 3px var(--glow);
}
.df-aff-consent{display:flex !important;align-items:flex-start;gap:10px;}
.df-aff-consent input{margin-top:3px;flex-shrink:0;}
.df-aff-consent span{
	flex:1;
	font-size:13.5px !important;
	color:var(--ink-2) !important;
	margin:0 !important;
	font-weight:400 !important;
}
.df-aff-signup-msg{
	margin-top:14px;
	padding:12px 16px;
	border-radius:8px;
	font-size:14px;
	display:none;
}
.df-aff-signup-msg.is-ok{
	display:block;
	background:color-mix(in oklab, #22c55e 12%, transparent);
	color:#15803d;
}
.df-aff-signup-msg.is-err{
	display:block;
	background:color-mix(in oklab, #ef4444 12%, transparent);
	color:#b91c1c;
}

.df-aff-extra-content{padding:48px 0 0;border-top:1px solid var(--line);}
.df-aff-extra-inner{max-width:720px;margin:0 auto;color:var(--ink-2);line-height:1.7;}

/* ============================================================
   FRONT-END : My-account dashboard
   ============================================================ */

.df-aff-dash{
	max-width:920px;
}

.df-aff-empty{
	padding:32px;
	background:var(--card);
	border:1px solid var(--line);
	border-radius:14px;
	text-align:center;
}
.df-aff-empty h3{margin:0 0 8px;color:var(--ink);}

.df-aff-hero{
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:24px;
	padding:24px 28px;
	background:linear-gradient(135deg, #1a1207 0%, #2a1d10 100%);
	color:#fff8e6;
	border-radius:18px;
	margin-bottom:24px;
}
.df-aff-eyebrow{
	font-size:11px;
	text-transform:uppercase;
	letter-spacing:.15em;
	color:#f0a830;
	margin-bottom:8px;
}
.df-aff-code{display:flex;align-items:center;gap:12px;}
.df-aff-code code{
	font-family:'JetBrains Mono', ui-monospace, monospace;
	font-size:28px;
	font-weight:700;
	color:#fff8e6;
	letter-spacing:1px;
}
.df-aff-copy{
	background:rgba(255,255,255,.1);
	border:0;
	color:#fff8e6;
	width:36px;
	height:36px;
	border-radius:8px;
	cursor:pointer;
	font-size:16px;
	transition:background .15s;
}
.df-aff-copy:hover{background:rgba(255,255,255,.18);}
.df-aff-rate-pill{
	background:var(--amber);
	color:#1a1207;
	padding:14px 20px;
	border-radius:14px;
	text-align:center;
	min-width:120px;
}
.df-aff-rate-n{font-size:26px;font-weight:700;line-height:1;}
.df-aff-rate-l{font-size:12px;text-transform:uppercase;letter-spacing:.1em;margin-top:4px;}

.df-aff-link-box{
	background:var(--card);
	border:1px solid var(--line);
	border-radius:14px;
	padding:22px;
	margin-bottom:24px;
}
.df-aff-link-box label{
	display:block;
	font-size:13px;
	color:var(--ink-3);
	margin-bottom:8px;
	text-transform:uppercase;
	letter-spacing:.1em;
}
.df-aff-link-row{
	display:flex;
	gap:8px;
}
.df-aff-link-row input{
	flex:1;
	padding:10px 14px;
	border:1px solid var(--line);
	border-radius:8px;
	background:var(--bg-2);
	color:var(--ink);
	font-family:'JetBrains Mono', ui-monospace, monospace;
	font-size:13px;
}
.df-aff-link-builder{margin-top:18px;padding-top:18px;border-top:1px solid var(--line);}
.df-aff-built-link{
	margin-top:10px;
	padding:10px 14px;
	background:color-mix(in oklab, var(--amber) 12%, transparent);
	border-radius:8px;
	font-family:'JetBrains Mono', ui-monospace, monospace;
	font-size:13px;
	word-break:break-all;
}

.df-aff-stat-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
	gap:14px;
	margin-bottom:24px;
}
.df-aff-stat{
	background:var(--card);
	border:1px solid var(--line);
	border-radius:14px;
	padding:18px;
}
.df-aff-stat-l{
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:.1em;
	color:var(--ink-3);
	margin-bottom:6px;
}
.df-aff-stat-n{
	font-size:22px;
	font-weight:600;
	color:var(--ink);
}
.df-aff-stat.is-accent{
	background:linear-gradient(135deg, var(--amber), var(--amber-deep));
	color:#1a1207;
	border-color:transparent;
}
.df-aff-stat.is-accent .df-aff-stat-l{color:rgba(26,18,7,.7);}
.df-aff-stat.is-accent .df-aff-stat-n{color:#1a1207;}

.df-aff-bars{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
	gap:12px;
	margin-bottom:24px;
}
.df-aff-bar{
	background:var(--card);
	border:1px solid var(--line);
	border-radius:10px;
	padding:14px 18px;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.df-aff-bar-l{font-size:13px;color:var(--ink-3);}
.df-aff-bar-v{font-weight:600;color:var(--ink);}

.df-aff-payout-card{
	background:var(--card);
	border:1px solid var(--line);
	border-radius:14px;
	padding:24px;
	margin-bottom:24px;
}
.df-aff-payout-card h3{margin:0 0 8px;color:var(--ink);}
.df-aff-payout-form{margin-top:18px;}
.df-aff-payout-form label{
	display:block;
	margin-bottom:14px;
}
.df-aff-payout-form label > span{
	display:block;
	font-size:13px;
	color:var(--ink-2);
	margin-bottom:6px;
}
.df-aff-payout-form select,
.df-aff-payout-form textarea{
	width:100%;
	padding:10px 12px;
	border:1px solid var(--line);
	border-radius:8px;
	background:var(--bg);
	color:var(--ink);
	font-family:inherit;
	font-size:14px;
}
.df-aff-payout-form button[disabled]{opacity:.5;cursor:not-allowed;}
.df-aff-payout-msg{margin-top:12px;font-size:14px;}
.df-aff-payout-msg.is-ok{color:#15803d;}
.df-aff-payout-msg.is-err{color:#b91c1c;}

.df-aff-table-wrap{
	background:var(--card);
	border:1px solid var(--line);
	border-radius:14px;
	padding:24px;
	overflow-x:auto;
}
.df-aff-table-wrap h3{margin:0 0 16px;color:var(--ink);}
.df-aff-table{
	width:100%;
	border-collapse:collapse;
	font-size:14px;
}
.df-aff-table thead th{
	text-align:left;
	padding:10px 12px;
	color:var(--ink-3);
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:.08em;
	border-bottom:1px solid var(--line);
	font-weight:500;
}
.df-aff-table tbody td{
	padding:12px;
	border-bottom:1px solid var(--line);
	color:var(--ink-2);
}
.df-aff-table tbody tr:last-child td{border-bottom:0;}

/* ---- Status pills ---- */
.df-aff-pill{
	display:inline-block;
	padding:3px 10px;
	border-radius:99px;
	font-size:12px;
	font-weight:500;
	background:var(--chip);
	color:var(--ink-2);
}
.df-aff-pill-pending{background:color-mix(in oklab, #f5a83a 18%, transparent);color:#a96b00;}
.df-aff-pill-approved{background:color-mix(in oklab, #3b82f6 14%, transparent);color:#1d4ed8;}
.df-aff-pill-paid{background:color-mix(in oklab, #22c55e 14%, transparent);color:#15803d;}
.df-aff-pill-rejected{background:color-mix(in oklab, #ef4444 14%, transparent);color:#b91c1c;}
.df-aff-pill-suspended{background:color-mix(in oklab, #71717a 14%, transparent);color:#3f3f46;}
.df-aff-pill-requested{background:color-mix(in oklab, #f5a83a 18%, transparent);color:#a96b00;}
.df-aff-pill-processing{background:color-mix(in oklab, #3b82f6 14%, transparent);color:#1d4ed8;}

/* ============================================================
   ADMIN
   ============================================================ */

.df-aff-admin{margin-top:20px;}
.df-aff-admin-body{margin-top:20px;}

.df-aff-cards{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
	gap:14px;
	margin-bottom:32px;
}
.df-aff-card{
	background:#fff;
	border-radius:10px;
	padding:18px 20px;
	box-shadow:0 1px 3px rgba(0,0,0,.08);
}
.df-aff-card-l{
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:.08em;
	color:#666;
	margin-bottom:6px;
}
.df-aff-card-n{
	font-size:24px;
	font-weight:600;
	color:#1a1207;
	line-height:1.1;
}
.df-aff-card-s{
	font-size:12.5px;
	color:#888;
	margin-top:6px;
}
.df-aff-card-s a{color:#c77a1e;text-decoration:none;}
.df-aff-card-s a:hover{text-decoration:underline;}

.df-aff-overview-grid{
	display:grid;
	grid-template-columns:1fr 1.4fr;
	gap:24px;
	margin-top:24px;
}
@media (max-width:1100px){
	.df-aff-overview-grid{grid-template-columns:1fr;}
}

.df-aff-filters{
	display:flex;
	gap:6px;
	margin-bottom:18px;
	flex-wrap:wrap;
}
.df-aff-filter{
	padding:6px 14px;
	background:#fff;
	border:1px solid #ddd;
	border-radius:99px;
	color:#555;
	font-size:13px;
	text-decoration:none;
	transition:all .12s;
}
.df-aff-filter:hover{background:#f6f4ee;color:#1a1207;}
.df-aff-filter.is-active{
	background:#1a1207;
	color:#fff8e6;
	border-color:#1a1207;
}

.df-aff-admin-table{margin-top:8px;}
.df-aff-admin-table th{font-weight:600;}
.df-aff-admin-table .df-aff-pill{margin:0;}
.df-aff-actions{display:flex;gap:6px;flex-wrap:wrap;}
.df-aff-pre{
	font-family:'JetBrains Mono', ui-monospace, monospace;
	font-size:12px;
	white-space:pre-wrap;
	word-break:break-word;
	margin:0;
	max-width:240px;
	background:#f6f4ee;
	padding:6px 8px;
	border-radius:4px;
}
.df-aff-payout-form-inline{
	display:flex;
	gap:6px;
	align-items:center;
}
.df-aff-payout-form-inline input{
	font-size:12px;
	padding:4px 8px;
	max-width:160px;
}

.df-aff-settings h2{margin-top:32px;padding-top:16px;border-top:1px solid #eee;}
.df-aff-settings h2:first-of-type{border-top:0;padding-top:0;}

/* ============================================================
   Generic buttons used inside the affiliate UI (frontend)
   ============================================================ */
.df-aff-program .df-btn,
.df-aff-dash .df-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:6px;
	padding:10px 22px;
	font-size:14.5px;
	font-weight:500;
	text-decoration:none;
	border-radius:99px;
	border:1px solid transparent;
	cursor:pointer;
	font-family:inherit;
	transition:all .15s;
}
.df-aff-program .df-btn-primary,
.df-aff-dash .df-btn-primary{
	background:#1a1207;
	color:#fff8e6;
}
.df-aff-program .df-btn-primary:hover,
.df-aff-dash .df-btn-primary:hover{
	background:#2a1d10;
}
.df-aff-program .df-btn-ghost,
.df-aff-dash .df-btn-ghost{
	background:transparent;
	color:var(--ink);
	border-color:var(--line);
}
.df-aff-program .df-btn-ghost:hover,
.df-aff-dash .df-btn-ghost:hover{
	background:var(--bg-2);
}
.df-aff-program .df-btn-lg{padding:13px 28px;font-size:15.5px;}