/* ==========================================================================
   THOJA — Board "Mes produits numériques" (My Account)
   Design tokens tirés de la charte THOJA My Account.
   Aucune largeur/hauteur fixe : grid + clamp() + minmax() uniquement.
   Toutes les classes sont préfixées thoja- pour ne jamais entrer en conflit
   avec Goya / EveryTheme.
   ========================================================================== */

.thoja-board{
	--thoja-primary:#2563EB;
	--thoja-primary-dark:#1D4ED8;
	--thoja-primary-light:#EFF4FF;
	--thoja-bg:#F7F8FA;
	--thoja-card:#FFFFFF;
	--thoja-text:#111827;
	--thoja-secondary:#6B7280;
	--thoja-border:rgba(0,0,0,.06);
	--thoja-success:#059669;
	--thoja-success-bg:#ECFDF5;
	--thoja-amber:#B45309;
	--thoja-amber-bg:#FFFBEB;
	--thoja-radius-lg:22px;
	--thoja-radius-md:18px;
	--thoja-radius-sm:14px;
	--thoja-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06);

	background:var(--thoja-bg);
	color:var(--thoja-text);
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Helvetica,Arial,sans-serif;
	padding:clamp(12px,3vw,24px);
	border-radius:var(--thoja-radius-lg);
	width:100%;
	max-width:100%;
	box-sizing:border-box;
}
.thoja-board *{ box-sizing:border-box; }

/* ---------- Head ---------- */
.thoja-board-head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	flex-wrap:wrap;
	margin-bottom:16px;
}
.thoja-board-head h2{
	font-size:clamp(16px,2.4vw,19px);
	margin:0 0 2px;
	letter-spacing:-.01em;
}
.thoja-board-head .thoja-count{
	font-size:12.5px;
	color:var(--thoja-secondary);
}

/* ---------- Filter pills ---------- */
.thoja-filters{
	display:flex;
	gap:8px;
	overflow-x:auto;
	padding:2px 0 18px;
	scrollbar-width:none;
}
.thoja-filters::-webkit-scrollbar{ display:none; }
.thoja-filter-pill{
	flex:0 0 auto;
	padding:9px 16px;
	border-radius:999px;
	font-size:13px;
	font-weight:600;
	border:1px solid var(--thoja-border);
	background:var(--thoja-card);
	color:var(--thoja-secondary);
	cursor:pointer;
	white-space:nowrap;
	transition:.15s;
	font-family:inherit;
}
.thoja-filter-pill .thoja-count-badge{ opacity:.6; margin-left:4px; font-weight:700; }
.thoja-filter-pill.thoja-active{
	background:var(--thoja-text);
	color:#fff;
	border-color:var(--thoja-text);
}

/* ---------- Fluid grid : 1 col mobile -> auto-fit cards on wider screens ---------- */
.thoja-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));
	gap:12px;
	width:100%;
}

/* ---------- Product card ---------- */
.thoja-card{
	background:var(--thoja-card);
	border:1px solid var(--thoja-border);
	border-radius:var(--thoja-radius-md);
	box-shadow:var(--thoja-shadow);
	padding:16px;
	display:flex;
	flex-direction:column;
	gap:12px;
	min-width:0;
}
.thoja-card.thoja-hidden{ display:none; }

.thoja-card-top{ display:flex; gap:12px; align-items:flex-start; }
.thoja-card-icon{
	width:48px;height:48px;border-radius:14px;
	flex:0 0 auto;
	display:flex;align-items:center;justify-content:center;
	font-size:20px;
	box-shadow:inset 0 0 0 1px rgba(0,0,0,.04);
}
.thoja-card-info{ flex:1; min-width:0; }
.thoja-card-info h3{
	font-size:14px;
	margin:0 0 3px;
	letter-spacing:-.01em;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	font-weight:700;
}
.thoja-card-meta{
	font-size:12px;
	color:var(--thoja-secondary);
	display:flex;
	align-items:center;
	gap:6px;
	flex-wrap:wrap;
}
.thoja-card-meta .thoja-sep{ opacity:.5; }

.thoja-status{
	font-size:11px;
	font-weight:700;
	padding:5px 10px;
	border-radius:999px;
	flex:0 0 auto;
	white-space:nowrap;
	display:inline-flex;
	align-items:center;
	gap:5px;
}
.thoja-status.thoja-delivered{ background:var(--thoja-success-bg); color:var(--thoja-success); }
.thoja-status.thoja-pending{ background:var(--thoja-amber-bg); color:var(--thoja-amber); }
.thoja-status::before{ content:''; width:6px;height:6px;border-radius:50%; background:currentColor; flex:0 0 auto; }

.thoja-field-row{
	display:flex;
	justify-content:space-between;
	align-items:center;
	font-size:12.5px;
	gap:8px;
}
.thoja-field-row .thoja-label{ color:var(--thoja-secondary); }
.thoja-field-row .thoja-value{ font-weight:600; text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.thoja-code-zone{
	background:var(--thoja-primary-light);
	border:1px dashed rgba(37,99,235,.35);
	border-radius:var(--thoja-radius-sm);
	padding:12px 14px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
}
.thoja-code-zone .thoja-code-text{
	font-family:"SFMono-Regular",Consolas,Menlo,monospace;
	font-size:13px;
	font-weight:700;
	letter-spacing:.02em;
	color:var(--thoja-primary-dark);
	word-break:break-all;
}
.thoja-copy-btn{
	border:none;
	background:#fff;
	color:var(--thoja-primary);
	font-size:11.5px;
	font-weight:700;
	padding:6px 10px;
	border-radius:9px;
	box-shadow:var(--thoja-shadow);
	cursor:pointer;
	flex:0 0 auto;
	font-family:inherit;
}

.thoja-reveal-btn{
	border:none;
	width:100%;
	background:var(--thoja-primary);
	color:#fff;
	font-size:13.5px;
	font-weight:700;
	padding:11px;
	border-radius:var(--thoja-radius-sm);
	cursor:pointer;
	font-family:inherit;
	box-shadow:0 4px 12px rgba(37,99,235,.25);
	transition:transform .12s,opacity .12s;
}
.thoja-reveal-btn:active{ transform:scale(.98); }
.thoja-reveal-btn.thoja-ghost{
	background:var(--thoja-card);
	color:var(--thoja-secondary);
	border:1px solid var(--thoja-border);
	box-shadow:none;
	cursor:not-allowed;
}
.thoja-reveal-btn[disabled]{ opacity:.7; cursor:wait; }

/* ---------- Empty state ---------- */
.thoja-empty{
	text-align:center;
	padding:clamp(30px,8vw,50px) 20px 20px;
}
.thoja-empty .thoja-empty-icon{
	width:64px;height:64px;border-radius:20px;background:var(--thoja-primary-light);
	display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:28px;
}
.thoja-empty h4{ margin:0 0 6px; font-size:15px; }
.thoja-empty p{ margin:0 auto; font-size:13px; color:var(--thoja-secondary); line-height:1.5; max-width:280px; }

/* ---------- Wide screens : denser grid ---------- */
@media (min-width:1024px){
	.thoja-grid{ grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:14px; }
	.thoja-board{ padding:24px; }
}


/* ==========================================================================
   2.45.0 — Gift cards only + real product images + readable full titles
   ========================================================================== */
.thoja-card-icon{
	width:72px !important;
	height:72px !important;
	border-radius:14px !important;
	overflow:hidden !important;
	background:#f4f7fb;
}
.thoja-card-icon img{
	width:100% !important;
	height:100% !important;
	display:block !important;
	object-fit:cover !important;
	border-radius:14px !important;
}
.thoja-card-info h3{
	font-size:13px !important;
	line-height:1.35 !important;
	font-weight:700 !important;
	white-space:normal !important;
	overflow:visible !important;
	text-overflow:clip !important;
	word-break:normal !important;
	overflow-wrap:anywhere !important;
	margin:0 0 5px !important;
}
.thoja-card-top{
	align-items:center !important;
}
@media (min-width:768px){
	.thoja-card-info h3{font-size:14px !important;}
	.thoja-card-icon{width:78px !important;height:78px !important;}
}
@media (max-width:767px){
	.thoja-board{padding:12px !important;}
	.thoja-grid{grid-template-columns:1fr !important;}
	.thoja-card{padding:13px !important;gap:10px !important;}
	.thoja-card-icon{width:68px !important;height:68px !important;min-width:68px !important;}
	.thoja-card-info h3{
		font-size:13px !important;
		line-height:1.4 !important;
		white-space:normal !important;
	}
	.thoja-status{font-size:10px !important;padding:5px 8px !important;}
}