/**
 * LM File Service — Styles Mon Compte
 *
 * @package LM_File_Service
 */

/* ==========================================================================
   FORMULAIRE VÉHICULE
   ========================================================================== */

.lmfs-vehicle-form-wrapper {
	max-width: 700px;
}

.lmfs-vehicle-form-wrapper h3 {
	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 2px solid #2271b1;
	color: #1d2327;
}

.lmfs-form-row {
	margin-bottom: 16px;
}

.lmfs-form-row label {
	display: block;
	font-weight: 600;
	margin-bottom: 5px;
	color: #1d2327;
}

.lmfs-form-row label .required {
	color: #d63638;
}

.lmfs-form-row input[type="text"],
.lmfs-form-row input[type="number"],
.lmfs-form-row select,
.lmfs-form-row textarea {
	width: 100%;
	padding: 8px 12px;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
	font-size: 14px;
	background: #fff;
	transition: border-color 0.2s;
	box-sizing: border-box;
}

.lmfs-form-row input:focus,
.lmfs-form-row select:focus,
.lmfs-form-row textarea:focus {
	border-color: #2271b1;
	outline: none;
	box-shadow: 0 0 0 1px #2271b1;
}

.lmfs-form-row input.lmfs-error,
.lmfs-form-row select.lmfs-error {
	border-color: #d63638;
}

.lmfs-payment-options.lmfs-error .lmfs-payment-card,
.lmfs-service-list.lmfs-error .lmfs-service-option {
	border-color: #d63638;
	box-shadow: 0 0 0 2px rgba(214, 54, 56, 0.2);
}

.lmfs-form-row textarea {
	resize: vertical;
	min-height: 80px;
}

.lmfs-form-row input[type="file"] {
	padding: 8px;
	border: 2px dashed #c3c4c7;
	border-radius: 4px;
	width: 100%;
	cursor: pointer;
	background: #f6f7f7;
}

.lmfs-form-row input[type="file"]:hover {
	border-color: #2271b1;
	background: #f0f6fc;
}

.lmfs-form-help {
	margin-top: 4px;
	font-size: 12px;
	color: #646970;
	font-style: italic;
}

.lmfs-form-row-half {
	display: flex;
	gap: 16px;
}

.lmfs-form-row-half .lmfs-form-col {
	flex: 1;
}

.lmfs-field-error {
	color: #d63638;
	font-size: 12px;
	margin-top: 4px;
	display: none;
}

.lmfs-form-section {
	margin-bottom: 30px;
}

.lmfs-form-section h4 {
	font-size: 16px;
	margin-bottom: 15px;
	padding-bottom: 8px;
	border-bottom: 1px solid #e2e4e7;
	color: #1d2327;
}

.lmfs-form-submit {
	margin-top: 30px;
	padding-top: 20px;
	border-top: 2px solid #e2e4e7;
}

/* ==========================================================================
   MESSAGES / NOTICES
   ========================================================================== */

.lmfs-notice {
	padding: 12px 16px;
	margin-bottom: 20px;
	border-radius: 4px;
	border-left: 4px solid;
}

.lmfs-notice-success {
	background: #edfaef;
	border-color: #00a32a;
	color: #00450b;
}

.lmfs-notice-error {
	background: #fcf0f1;
	border-color: #d63638;
	color: #8a1114;
}

.lmfs-notice-info {
	background: #f0f6fc;
	border-color: #2271b1;
	color: #0a4b78;
}

/* ==========================================================================
   BOUTONS
   ========================================================================== */

.lmfs-btn {
	display: inline-block;
	padding: 10px 20px;
	border: none;
	border-radius: 4px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	transition: background-color 0.2s;
	line-height: 1.4;
}

.lmfs-btn-primary {
	background: #2271b1;
	color: #fff;
}

.lmfs-btn-primary:hover {
	background: #135e96;
	color: #fff;
}

.lmfs-btn-secondary {
	background: #f0f0f1;
	color: #1d2327;
}

.lmfs-btn-secondary:hover {
	background: #dcdcde;
	color: #1d2327;
}

.lmfs-btn-success {
	background: #00a32a;
	color: #fff;
}

.lmfs-btn-success:hover {
	background: #008a20;
	color: #fff;
}

.lmfs-btn-small {
	padding: 6px 12px;
	font-size: 12px;
}

.lmfs-btn-large {
	padding: 14px 28px;
	font-size: 16px;
}

/* ==========================================================================
   DASHBOARD
   ========================================================================== */

.lmfs-dashboard {
	max-width: 800px;
}

.lmfs-dashboard-card {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 20px;
	margin-bottom: 16px;
	background: #fff;
	border: 1px solid #e2e4e7;
	border-radius: 8px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.lmfs-card-icon {
	font-size: 32px;
	flex-shrink: 0;
}

.lmfs-card-content {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.lmfs-card-label {
	font-size: 13px;
	color: #646970;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.lmfs-card-value {
	font-size: 28px;
	font-weight: 700;
	color: #1d2327;
}

.lmfs-card-value-small {
	font-size: 16px;
	font-weight: 600;
}

.lmfs-card-value-muted {
	font-size: 14px;
	color: #646970;
	font-style: italic;
}

.lmfs-dashboard-actions {
	display: flex;
	gap: 12px;
	margin-top: 24px;
	flex-wrap: wrap;
}

.lmfs-dashboard-actions .lmfs-btn {
	flex: 1;
	text-align: center;
	min-width: 180px;
}

/* ==========================================================================
   STATUS BADGE
   ========================================================================== */

.lmfs-status-badge {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 12px;
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
}

/* ==========================================================================
   TABLEAUX
   ========================================================================== */

.lmfs-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 20px;
}

.lmfs-table th {
	background: #f6f7f7;
	padding: 10px 12px;
	text-align: left;
	font-weight: 600;
	font-size: 13px;
	color: #1d2327;
	border-bottom: 2px solid #e2e4e7;
	vertical-align: middle;
}

.lmfs-table td {
	padding: 12px;
	border-bottom: 1px solid #f0f0f1;
	font-size: 14px;
	vertical-align: middle;
}

.lmfs-table .lmfs-actions {
	white-space: nowrap;
}

.lmfs-table tbody tr:hover {
	background: #f9f9f9;
}

.lmfs-text-success {
	color: #00a32a;
}

.lmfs-text-danger {
	color: #d63638;
}

.lmfs-text-muted {
	color: #646970;
}

.lmfs-actions {
	display: flex;
	flex-direction: column;
	gap: 8px;
	align-items: flex-start;
}

/* ==========================================================================
   PAGINATION
   ========================================================================== */

.lmfs-pagination {
	display: flex;
	gap: 6px;
	justify-content: center;
	margin-top: 20px;
}

.lmfs-page-current,
.lmfs-page-link {
	display: inline-block;
	padding: 6px 12px;
	border: 1px solid #e2e4e7;
	border-radius: 4px;
	font-size: 14px;
	text-decoration: none;
}

.lmfs-page-current {
	background: #2271b1;
	color: #fff;
	border-color: #2271b1;
	font-weight: 600;
}

.lmfs-page-link {
	color: #2271b1;
}

.lmfs-page-link:hover {
	background: #f0f6fc;
}

/* ==========================================================================
   CRÉDITS
   ========================================================================== */

.lmfs-credits-balance {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 24px;
	margin-bottom: 30px;
	background: linear-gradient(135deg, #f0f6fc 0%, #e8f4f8 100%);
	border: 1px solid #c3d4e7;
	border-radius: 8px;
}

.lmfs-balance-box {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.lmfs-balance-label {
	font-size: 13px;
	color: #646970;
	text-transform: uppercase;
}

.lmfs-balance-amount {
	font-size: 32px;
	font-weight: 700;
	color: #1d2327;
}

.lmfs-balance-info {
	padding: 12px 16px;
	margin-bottom: 20px;
	background: #f0f6fc;
	border: 1px solid #c3d4e7;
	border-radius: 6px;
	font-size: 14px;
}

.lmfs-link-small {
	margin-left: 10px;
	font-size: 12px;
}

/* ==========================================================================
   SÉLECTION SERVICE
   ========================================================================== */

.lmfs-service-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.lmfs-service-option {
	cursor: pointer;
}

.lmfs-service-option input[type="radio"] {
	display: none;
}

.lmfs-service-card {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 16px;
	border: 2px solid #e2e4e7;
	border-radius: 8px;
	transition: all 0.2s;
}

.lmfs-service-option input:checked + .lmfs-service-card {
	border-color: #2271b1;
	background: #f0f6fc;
	box-shadow: 0 0 0 1px #2271b1;
}

.lmfs-service-card:hover {
	border-color: #2271b1;
}

.lmfs-service-name {
	font-weight: 700;
	font-size: 15px;
	color: #1d2327;
}

.lmfs-service-cost {
	font-size: 14px;
	color: #2271b1;
	font-weight: 600;
}

.lmfs-service-cost small {
	color: #646970;
	font-weight: 400;
}

.lmfs-service-desc {
	font-size: 13px;
	color: #646970;
	margin-top: 4px;
}

/* ==========================================================================
   MODE DE PAIEMENT
   ========================================================================== */

.lmfs-payment-options {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.lmfs-payment-option {
	flex: 1;
	min-width: 200px;
	cursor: pointer;
}

.lmfs-payment-option input[type="radio"] {
	display: none;
}

.lmfs-payment-card {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 16px;
	border: 2px solid #e2e4e7;
	border-radius: 8px;
	transition: all 0.2s;
	text-align: center;
}

.lmfs-payment-option input:checked + .lmfs-payment-card {
	border-color: #2271b1;
	background: #f0f6fc;
	box-shadow: 0 0 0 1px #2271b1;
}

.lmfs-payment-card:hover {
	border-color: #2271b1;
}

.lmfs-payment-name {
	font-weight: 700;
	font-size: 15px;
}

.lmfs-payment-info {
	font-size: 12px;
	color: #646970;
}

/* ==========================================================================
   UPLOAD INLINE (MES DEMANDES)
   ========================================================================== */

.lmfs-upload-inline {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}

.lmfs-upload-inline input[type="file"] {
	font-size: 12px;
	max-width: 200px;
}

/* ==========================================================================
   DEMANDES HEADER
   ========================================================================== */

.lmfs-demandes-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
}

.lmfs-demandes-header h3 {
	margin: 0;
}

/* ==========================================================================
   NAVIGATION MON COMPTE (WooCommerce)
   ========================================================================== */

.woocommerce-MyAccount-navigation {
	background: #f0f0f1;
	border: 1px solid #e2e4e7;
	border-radius: 8px;
	overflow: hidden;
	padding: 8px 0;
}

.woocommerce-MyAccount-navigation ul {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.woocommerce-MyAccount-navigation ul li {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.woocommerce-MyAccount-navigation ul li::before,
.woocommerce-MyAccount-navigation ul li::marker {
	display: none !important;
	content: none !important;
}

.woocommerce-MyAccount-navigation ul li a {
	display: block;
	padding: 12px 20px;
	color: #1d2327;
	text-decoration: none;
	font-size: 14px;
	font-weight: 500;
	transition: all 0.2s;
	border-left: 3px solid transparent;
}

.woocommerce-MyAccount-navigation ul li a:hover {
	background: #e2e4e7;
	color: #1d2327;
	border-left-color: #c3c4c7;
}

.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--lmfs-dashboard a.is-active {
	background: #fff;
	color: #1d2327;
	border-left-color: #a0461e;
	font-weight: 600;
}

/* Séparateur entre les liens LMFS et les liens WooCommerce standard */
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--orders {
	border-top: 1px solid #e2e4e7;
	margin-top: 4px;
	padding-top: 4px;
}

/* Layout Mon Compte */
.woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-navigation {
	width: 220px;
	flex-shrink: 0;
}

.woocommerce-MyAccount-content,
.woocommerce-account .woocommerce-MyAccount-content {
	flex: 1;
	min-width: 0;
}

.woocommerce-account .woocommerce > .woocommerce-MyAccount-navigation + .woocommerce-MyAccount-content,
.woocommerce-account .woocommerce {
	display: flex;
	gap: 30px;
	align-items: flex-start;
}

/* Masquer le titre "Mon compte" par défaut de WooCommerce si doublon */
.woocommerce-account .woocommerce-MyAccount-content > p:first-child {
	margin-top: 0;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 768px) {
	.lmfs-form-row-half {
		flex-direction: column;
		gap: 0;
	}

	.lmfs-dashboard-card {
		flex-direction: column;
		text-align: center;
	}

	.lmfs-dashboard-actions {
		flex-direction: column;
	}

	.lmfs-credits-balance {
		flex-direction: column;
		text-align: center;
	}

	.lmfs-payment-options {
		flex-direction: column;
	}

	.lmfs-table {
		font-size: 13px;
	}

	.lmfs-table th,
	.lmfs-table td {
		padding: 8px;
	}

	.lmfs-demandes-header {
		flex-direction: column;
		gap: 10px;
		align-items: flex-start;
	}

	.woocommerce-account .woocommerce,
	.woocommerce-account .woocommerce > .woocommerce-MyAccount-navigation + .woocommerce-MyAccount-content {
		flex-direction: column;
	}

	.woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce-MyAccount-navigation {
		width: 100%;
	}

	.woocommerce-MyAccount-navigation ul {
		display: flex;
		flex-wrap: wrap;
		gap: 2px;
		padding: 8px !important;
	}

	.woocommerce-MyAccount-navigation ul li a {
		padding: 8px 14px;
		font-size: 13px;
		border-left: none;
		border-radius: 4px;
	}

	.woocommerce-MyAccount-navigation ul li a:hover {
		border-left-color: transparent;
	}

	.woocommerce-MyAccount-navigation ul li.is-active a {
		border-left-color: transparent;
		background: #a0461e;
		color: #fff !important;
	}

	.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--orders {
		border-top: none;
		margin-top: 0;
		padding-top: 0;
	}
}