/* ==========================================================================
   Treeonrent My Account Dashboard
   Scoped to .woocommerce-account pages only — never leaks into the rest
   of the site. Uses its own variable namespace so it won't collide with
   the theme's existing CSS variables.
   ========================================================================== */

:root{
	--tor-mad-primary:       #2E7D32;
	--tor-mad-primary-dark:  #1B5E20;
	--tor-mad-primary-light: #E8F5E9;
	--tor-mad-accent:        #F5A623;
	--tor-mad-bg:            #FDFBF7;
	--tor-mad-surface:       #FFFFFF;
	--tor-mad-text:          #23291F;
	--tor-mad-muted:         #6B7568;
	--tor-mad-border:        #E4E7DE;
	--tor-mad-radius-lg:     18px;
	--tor-mad-radius-md:     12px;
	--tor-mad-shadow:        0 4px 18px rgba(27, 94, 32, 0.08);
}

/* Give the whole My Account area our background + spacing without touching the theme's page template */
.woocommerce-account .woocommerce{
	background: var(--tor-mad-bg);
	padding: 24px 16px 48px;
	border-radius: var(--tor-mad-radius-lg);
}

/* Restyle the account nav sidebar */
.woocommerce-account .woocommerce-MyAccount-navigation{
	background: var(--tor-mad-surface);
	border: 1px solid var(--tor-mad-border);
	border-radius: var(--tor-mad-radius-lg);
	padding: 12px;
	box-shadow: var(--tor-mad-shadow);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul{ margin:0; padding:0; list-style:none; }
.woocommerce-account .woocommerce-MyAccount-navigation li{
	border-bottom: 1px solid var(--tor-mad-border);
}
.woocommerce-account .woocommerce-MyAccount-navigation li:last-child{ border-bottom:none; }
.woocommerce-account .woocommerce-MyAccount-navigation li a{
	display:block;
	padding: 12px 14px;
	border-radius: var(--tor-mad-radius-md);
	color: var(--tor-mad-text);
	font-weight: 500;
	text-decoration: none;
	transition: background .15s ease, color .15s ease;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover{
	background: var(--tor-mad-primary-light);
	color: var(--tor-mad-primary-dark);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{
	background: var(--tor-mad-primary);
	color: #fff;
}

/* Content column */
.woocommerce-account .woocommerce-MyAccount-content{
	background: transparent;
}

/* ---------- Dashboard wrapper ---------- */
.tor-dash{
	display:flex;
	flex-direction:column;
	gap: 28px;
	font-family: inherit;
	color: var(--tor-mad-text);
	animation: tor-fade-in .4s ease both;
}
@keyframes tor-fade-in{ from{ opacity:0; transform: translateY(6px);} to{ opacity:1; transform:none; } }

/* ---------- Welcome banner ---------- */
.tor-dash-welcome{
	display:flex;
	align-items:center;
	gap:16px;
	flex-wrap:wrap;
	background: linear-gradient(135deg, var(--tor-mad-primary) 0%, var(--tor-mad-primary-dark) 100%);
	color:#fff;
	border-radius: var(--tor-mad-radius-lg);
	padding: 24px 28px;
	box-shadow: var(--tor-mad-shadow);
}
.tor-dash-avatar{
	width:56px; height:56px; flex:0 0 56px;
	border-radius:50%;
	background: rgba(255,255,255,.18);
	display:flex; align-items:center; justify-content:center;
	font-size:22px; font-weight:700;
	border: 2px solid rgba(255,255,255,.5);
}
.tor-dash-welcome-text{ flex: 1 1 200px; }
.tor-dash-welcome-text h2{ margin:0 0 4px; font-size: 1.35rem; font-weight:700; color:#fff; }
.tor-dash-welcome-text p{ margin:0; opacity:.85; font-size:.9rem; }
.tor-dash-cta{
	display:inline-block;
	background: var(--tor-mad-accent);
	color:#231a00;
	font-weight:600;
	padding: 12px 20px;
	border-radius: 999px;
	text-decoration:none;
	white-space:nowrap;
	transition: transform .15s ease, box-shadow .15s ease;
}
.tor-dash-cta:hover{ transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,.15); color:#231a00; }
.tor-dash-cta-outline{
	background: transparent;
	border: 2px solid var(--tor-mad-primary);
	color: var(--tor-mad-primary-dark);
}

/* ---------- Stat cards ---------- */
.tor-dash-stats{
	display:grid;
	grid-template-columns: repeat(2, 1fr);
	gap:14px;
}
@media (min-width: 640px){
	.tor-dash-stats{ grid-template-columns: repeat(4, 1fr); }
}
.tor-stat-card{
	background: var(--tor-mad-surface);
	border: 1px solid var(--tor-mad-border);
	border-radius: var(--tor-mad-radius-lg);
	padding: 18px 14px;
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:4px;
	box-shadow: var(--tor-mad-shadow);
	transition: transform .15s ease;
}
.tor-stat-card:hover{ transform: translateY(-3px); }
.tor-stat-icon{ font-size:1.4rem; margin-bottom:2px; }
.tor-stat-number{ font-size:1.6rem; font-weight:800; color: var(--tor-mad-primary-dark); line-height:1; }
.tor-stat-label{ font-size:.8rem; color: var(--tor-mad-muted); font-weight:500; }

/* ---------- Section heading ---------- */
.tor-dash-subhead{
	margin: 0;
	font-size: 1.05rem;
	font-weight:700;
	color: var(--tor-mad-text);
}

/* ---------- Quick actions ---------- */
.tor-dash-actions{
	display:grid;
	grid-template-columns: 1fr;
	gap:12px;
}
@media (min-width: 560px){
	.tor-dash-actions{ grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 900px){
	.tor-dash-actions{ grid-template-columns: repeat(4, 1fr); }
}
.tor-action-card{
	background: var(--tor-mad-surface);
	border: 1px solid var(--tor-mad-border);
	border-radius: var(--tor-mad-radius-lg);
	padding: 18px;
	text-decoration:none;
	color: var(--tor-mad-text);
	display:flex;
	flex-direction:column;
	gap:4px;
	transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.tor-action-card:hover{
	border-color: var(--tor-mad-primary);
	transform: translateY(-3px);
	box-shadow: var(--tor-mad-shadow);
	color: var(--tor-mad-text);
}
.tor-action-icon{ font-size:1.5rem; }
.tor-action-title{ font-weight:700; }
.tor-action-desc{ font-size:.82rem; color: var(--tor-mad-muted); }

/* ---------- Recent orders ---------- */
.tor-dash-orders{
	display:flex;
	flex-direction:column;
	gap:10px;
}
.tor-order-row{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	flex-wrap:wrap;
	background: var(--tor-mad-surface);
	border: 1px solid var(--tor-mad-border);
	border-radius: var(--tor-mad-radius-md);
	padding: 14px 16px;
	text-decoration:none;
	color: var(--tor-mad-text);
	transition: border-color .15s ease;
}
.tor-order-row:hover{ border-color: var(--tor-mad-primary); color: var(--tor-mad-text); }
.tor-order-main{ display:flex; flex-direction:column; gap:2px; }
.tor-order-number{ font-weight:700; }
.tor-order-date{ font-size:.78rem; color: var(--tor-mad-muted); }
.tor-order-meta{ display:flex; align-items:center; gap:12px; }
.tor-order-total{ font-weight:700; color: var(--tor-mad-primary-dark); }

.tor-order-status{
	font-size:.74rem;
	font-weight:700;
	padding: 5px 10px;
	border-radius: 999px;
	white-space:nowrap;
	background: var(--tor-mad-primary-light);
	color: var(--tor-mad-primary-dark);
}
.tor-status-pending{ background:#FFF3E0; color:#E65100; }
.tor-status-on-hold{ background:#FFF3E0; color:#E65100; }
.tor-status-processing{ background:#E3F2FD; color:#1565C0; }
.tor-status-completed{ background: var(--tor-mad-primary-light); color: var(--tor-mad-primary-dark); }
.tor-status-cancelled,
.tor-status-failed{ background:#FFEBEE; color:#C62828; }
.tor-status-refunded{ background:#F3E5F5; color:#6A1B9A; }

.tor-dash-viewall{
	align-self:flex-start;
	font-weight:700;
	color: var(--tor-mad-primary-dark);
	text-decoration:none;
}
.tor-dash-viewall:hover{ text-decoration: underline; }

/* ---------- Empty state ---------- */
.tor-dash-empty{
	background: var(--tor-mad-surface);
	border: 1px dashed var(--tor-mad-border);
	border-radius: var(--tor-mad-radius-lg);
	padding: 36px 20px;
	text-align:center;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:10px;
}
.tor-dash-empty-icon{ font-size:2rem; }
.tor-dash-empty p{ margin:0; color: var(--tor-mad-muted); }