/* BetApp Tipster Widget - standalone CSS (χωρίς Tailwind), prefix .betapp- */

.betapp { --betblue: #0155a3; --bggray: #f3f4f6; --green: #15803d; --red: #991b1b;
	font-size: 15px; line-height: 1.4; color: #111827; margin: 0 0 30px; }
.betapp * { box-sizing: border-box; }
.betapp img { max-width: 100%; }

.betapp-loading, .betapp-empty { text-align: center; padding: 18px 10px; color: #374151; }

/* Κεφαλίδα + tabs */
.betapp-top { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; }
.betapp-top h1 { font-size: 1.45em; font-weight: 600; margin: 0 0 10px; }
.betapp-upper { text-transform: uppercase; }
.betapp-tabs { display: flex; gap: 6px; }

.betapp-btn { background: var(--betblue); color: #fff; border: 0; border-radius: 8px;
	padding: 9px 18px; font-size: 0.95em; font-weight: 500; cursor: pointer; }
.betapp-btn:hover { background: #01427f; }
.betapp-btn:disabled { opacity: 0.5; cursor: default; }
/* Ενεργή καρτέλα: διακριτικά πιο σκούρα, χωρίς δαχτυλίδι (το app δεν έχει) */
.betapp-btn.betapp-tab-active { background: #01427f; }

/* Season select */
.betapp-season-wrap { margin: 18px 0 14px; }
.betapp-season-title { font-size: 1.15em; font-weight: 600; margin: 0 0 6px; }
.betapp-season { background: #f9fafb; border: 1px solid #d1d5db; border-radius: 8px;
	padding: 9px 12px; font-size: 0.95em; cursor: pointer; }

/* Μπλε μπάρες τμημάτων */
.betapp-blue-bar, .betapp-section-head { background: var(--betblue); color: #fff;
	display: flex; justify-content: space-between; align-items: center;
	padding: 14px 16px; border-radius: 8px 8px 0 0; margin-top: 22px; }
.betapp-blue-bar h2, .betapp-section-head h2 { color: #fff; font-size: 1.15em; font-weight: 600; margin: 0; }
.betapp-overall-profit { color: #fff; font-size: 1.15em; margin: 0; }
.betapp-text-green { color: #4ade80; }
.betapp-text-red { color: #f87171; }
td.betapp-text-green { color: #16a34a; font-weight: 700; }
td.betapp-text-red { color: #dc2626; font-weight: 700; }

/* Overall grid */
.betapp-overall-grid { background: var(--bggray); display: flex; flex-wrap: wrap;
	padding: 14px; text-align: center; border-radius: 0 0 8px 8px; }
.betapp-overall-grid .betapp-stat { width: 33.33%; margin: 5px 0; }

/* Κάρτες tips/αποτελεσμάτων */
.betapp-card { background: var(--bggray); border-radius: 8px; padding: 14px; margin: 0 0 16px; text-align: center; }
.betapp-match-row { display: flex; justify-content: space-between; align-items: center;
	flex-wrap: wrap; gap: 8px; padding: 4px 2px; }
.betapp-match-left { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.betapp-match-left p { margin: 0; }
.betapp-country { text-transform: uppercase; font-weight: 600; }
.betapp-flag { width: 28px; height: 20px; object-fit: cover; border-radius: 2px; }
.betapp-when { margin: 0; white-space: nowrap; }
/* Όνομα αγώνα έντονο, όπως στο application */
.betapp-match-name { font-weight: 700; }

.betapp-analysis-btn { background: var(--betblue); color: #fff; border: 0; border-radius: 14px;
	padding: 4px 12px; font-size: 0.85em; cursor: pointer; flex-shrink: 0; }
/* Desktop: κείμενο «Ανάλυση». Κινητό: μόνο το εικονίδιο 🔍 (δες media query). */
.betapp-analysis-icon { display: none; }

/* Overall: γραμμή ανά στατιστικό */
.betapp-stat { margin: 5px 0; }
.betapp-stat-label { color: inherit; }
.betapp-stat-value { font-weight: inherit; }

/* Διπλά/τριπλά: αέρας πριν από κάθε επόμενο σκέλος ώστε να ξεχωρίζει */
.betapp-bet-stats + .betapp-bet-row { margin-top: 1.25rem; }

.betapp-grid { display: flex; gap: 14px; align-items: center; padding: 6px 2px; }
.betapp-cell { flex: 1; min-width: 0; }
.betapp-cell-label { margin: 0 0 4px; font-size: 0.9em; }

/* Τα «κουτάκια» τιμών: έντονο (bold) + περίγραμμα, όπως στο application.
   Το οριζόντιο padding χρειάζεται ώστε το κείμενο να μην ακουμπά το περίγραμμα. */
.betapp-pill { background: var(--betblue); color: #fff; border-radius: 22px;
	padding: 8px 0.625rem; margin: 0; overflow-wrap: anywhere;
	font-weight: 700; border: 3px solid #9ca3af; }
.betapp-pill.betapp-green { background: var(--green); }
.betapp-pill.betapp-red { background: var(--red); }
.betapp-locked-pill { background: #334155; letter-spacing: 1px; }

/* Odds κουμπί με logo εταιρείας */
.betapp-odds { width: 100%; }
.betapp-odds-link { display: flex; align-items: center; width: 100%; text-decoration: none; }
.betapp-odds-logo { display: flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; min-width: 44px; border-radius: 50%; overflow: hidden;
	border: 1px solid #fff; position: relative; left: 6px; z-index: 1; }
.betapp-odds-logo img { width: 100%; height: 100%; object-fit: contain; }
.betapp-odds-value { background: #fff; color: #111827; display: flex; align-items: center;
	justify-content: center; height: 32px; font-weight: 700; flex-grow: 1;
	border: 1px solid #e5e7eb; }
.betapp-odds-locked, .betapp-odds-plain { font-weight: 700; border: 3px solid #9ca3af; }
.betapp-odds-arrow { background: crimson; color: #fff; width: 40px; height: 32px;
	display: flex; align-items: center; justify-content: center;
	font-size: 1.5em; font-weight: 700; line-height: 1; border-radius: 0 6px 6px 0; }
.betapp-odds-plain { background: #fff; border: 1px solid #d1d5db; border-radius: 22px;
	display: block; padding: 7px 0; font-weight: 700; }
.betapp-odds-locked { background: #334155; color: #fff; border-radius: 22px; display: block; padding: 8px 0; }

/* Ανάλυση (popuptext) */
.betapp-analysis { display: none; background: var(--betblue); color: #fff;
	border: 1px solid #d1d5db; border-radius: 8px; padding: 10px; margin-top: 10px; width: 100%; }
.betapp-analysis.betapp-show { display: block; }

/* CTA συνδρομής σε κλειδωμένα */
.betapp-sub-cta { margin-top: 10px; width: 100%; }
.betapp-sub-cta a { display: inline-block; background: #334155; color: #fff;
	border-radius: 18px; padding: 6px 16px; font-size: 0.9em; text-decoration: none; }
.betapp-sub-cta a:hover { background: #1e293b; }

/* Accordions */
.betapp-accordion-btn { width: 100%; background: var(--betblue); color: #fff; border: 0;
	text-align: left; padding: 14px 16px; margin-top: 22px; border-radius: 8px 8px 0 0;
	font-size: 1.15em; font-weight: 600; cursor: pointer; }
.betapp-accordion-body { display: none; padding-top: 12px; }
.betapp-accordion-body.betapp-show { display: block; }

/* Pagination */
.betapp-pagination { display: flex; justify-content: center; align-items: center; gap: 14px; margin: 14px 0 4px; }

/* Πίνακες στατιστικών */
.betapp-table-wrap { overflow-x: auto; margin-top: 16px; border-radius: 8px; }
.betapp-table { width: 100%; border-collapse: collapse; font-size: 0.9em; text-align: left; }
.betapp-table thead tr { background: var(--betblue); color: #fff; text-transform: uppercase; font-size: 0.85em; }
.betapp-table th, .betapp-table td { padding: 11px 14px; }
.betapp-table tbody tr { background: var(--bggray); border-bottom: 2px solid #fff; }
.betapp-table tbody th { font-weight: 700; white-space: nowrap; }
.betapp-table td { font-weight: 700; }
.betapp-sortable { cursor: pointer; user-select: none; }
.betapp-sortable:hover { text-decoration: underline; }

/* ============================ ΚΙΝΗΤΟ (≤767px) ============================
   Ίδια συμπεριφορά με το application: τα κελιά σε πλέγμα 2 στηλών αντί για
   στοίβα πλήρους πλάτους, ημερομηνία χωρίς χρονιά, «Ανάλυση» ως εικονίδιο,
   και Overall σε γραμμές ετικέτα-αριστερά / τιμή-δεξιά. */
@media (max-width: 767px) {

	/* Κελιά προγνωστικού: 2 στήλες (Αγορά+Προγνωστικό, Stake+Αποτέλεσμα, Odds+Profit) */
	.betapp-grid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		column-gap: 12px;
		row-gap: 12px;
		align-items: start;
	}
	.betapp-cell { width: auto; }
	/* Τα κενά κελιά των diplo/triplo δεν πιάνουν χώρο στο κινητό */
	.betapp-cell-empty { display: none; }

	/* Πρώτη γραμμή: αγώνας (+φακός) πάνω, ώρα από κάτω — κεντραρισμένα.
	   ΠΡΟΣΟΧΗ: nowrap ώστε ο φακός να ΜΗΝ πέφτει ποτέ σε δική του γραμμή·
	   αντ' αυτού σπάει εσωτερικά το όνομα του αγώνα (min-width:0). */
	.betapp-match-row { flex-direction: column; align-items: stretch; gap: 4px; }
	.betapp-match-left {
		flex-wrap: nowrap;
		justify-content: center;
		align-items: center;
		gap: 6px;
	}
	.betapp-match-name { min-width: 0; }
	.betapp-flag { flex-shrink: 0; }
	.betapp-analysis-btn { flex: 0 0 auto; }
	.betapp-when { text-align: center; }

	/* Χρονιά κρυφή — κερδίζουμε χώρο (19/07 αντί 19/07/2026) */
	.betapp-year { display: none; }

	/* «Ανάλυση»: μόνο εικονίδιο, χωρίς φόντο */
	.betapp-analysis-btn { background: transparent; padding: 0; font-size: 1em; }
	.betapp-analysis-icon { display: inline; }
	.betapp-analysis-text { display: none; }

	/* Overall: μία γραμμή ανά στατιστικό, ετικέτα αριστερά / τιμή δεξιά */
	.betapp-overall-grid { flex-direction: column; text-align: left; }
	.betapp-overall-grid .betapp-stat {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: baseline;
		gap: 16px;
		margin: 0;
		padding: 10px 0;
		border-bottom: 1px solid #d1d5db;
	}
	.betapp-overall-grid .betapp-stat:last-child { border-bottom: 0; }
	.betapp-stat-label { color: #4b5563; }
	.betapp-stat-value { font-weight: 600; }

	/* Κεφαλίδα Overall σε στήλη */
	.betapp-blue-bar { flex-direction: column; align-items: flex-start; gap: 4px; }

	/* Κεφαλίδα σελίδας: τίτλος πάνω, tabs από κάτω σε πλήρες πλάτος
	   (ίδιο με το flex-col sm:flex-row του application) */
	.betapp-top { flex-direction: column; align-items: stretch; gap: 6px; }
	.betapp-tabs { width: 100%; display: flex; gap: 8px; }
	/* Ίσο πλάτος και στα δύο κουμπιά, να γεμίζουν τη σειρά (όπως το app).
	   Το min-width:0 είναι απαραίτητο: χωρίς αυτό τα flex items δεν ζαρώνουν
	   κάτω από το πλάτος του κειμένου τους και τα πλάτη βγαίνουν άνισα. */
	.betapp-tabs .betapp-btn {
		flex: 1 1 0;
		min-width: 0;
		white-space: nowrap;
		text-align: center;
		padding: 10px 8px;
	}
}
