/* Account section redesign — modern cards, orange accent (site design language).
 * Loaded on account pages via header.tpl. Overrides the legacy PS 1.6 styling
 * with the same specificity (#my-account ...) but loaded later, so it wins.
 *
 * Phase 1: account hub (ÚČET).
 */

/* ===================== Phase 1 — account hub (my-account) ===================== */
#my-account .info-account { color: #6b7480; font-size: 14px; margin-bottom: 18px; }

#my-account ul.myaccount-link-list { list-style: none; margin: 0; padding: 0; }
#my-account ul.myaccount-link-list li { overflow: visible; padding: 0; margin: 0 0 12px; }

#my-account ul.myaccount-link-list li a {
	display: flex;
	align-items: center;
	gap: 14px;
	position: static;
	overflow: visible;
	font: 600 15px/1.3 "Open Sans", sans-serif;
	color: #1f2733;
	text-shadow: none;
	text-transform: none;
	text-decoration: none;
	background: #fff;
	background-image: none;
	border: 1px solid #e4e8ee;
	border-radius: 14px;
	padding: 14px 18px;
	transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
#my-account ul.myaccount-link-list li a:hover {
	filter: none;
	background: #fff;
	border-color: #f47b20;
	box-shadow: 0 4px 16px rgba(20, 30, 50, .08);
	transform: translateY(-1px);
	color: #1f2733;
}
#my-account ul.myaccount-link-list li a i {
	position: static;
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 0;
	border-radius: 12px;
	background: #fff3e9;
	color: #f47b20;
	font-size: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
}
#my-account ul.myaccount-link-list li a span {
	display: block;
	flex: 1;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	overflow: visible;
}
#my-account ul.myaccount-link-list li a:after {
	content: "\203A";
	flex: 0 0 auto;
	color: #c0c7d0;
	font-size: 24px;
	font-weight: 700;
	line-height: 1;
}

/* ===================== Buttons (account pages — CSS loaded only here) ===================== */
#center_column .footer_links { list-style: none; padding: 0; margin: 22px 0 0; display: flex; gap: 10px; flex-wrap: wrap; }
#center_column .footer_links li { margin: 0; padding: 0; }
#center_column a.button,
#center_column .btn.button {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #fff;
	background-image: none;
	border: 1px solid #cfd6df;
	border-radius: 10px;
	color: #1f2733;
	text-shadow: none;
	text-transform: none;
	font: 600 13px/1 "Open Sans", sans-serif;
	padding: 10px 16px;
	box-shadow: none;
	min-height: 0;
}
#center_column a.button:hover,
#center_column .btn.button:hover {
	background: #fff;
	border-color: #f47b20;
	color: #1f2733;
	box-shadow: 0 2px 8px rgba(20, 30, 50, .06);
}
#center_column a.button span,
#center_column .btn.button span {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	border-radius: 0;
}
#center_column a.button i { color: #f47b20; }

/* ===================== Phase 2 — order history table ===================== */
#center_column #order-list { width: 100%; border: 0; border-collapse: separate; border-spacing: 0; }
#center_column #order-list thead th {
	background: #f7f9fc;
	color: #6b7480;
	font-weight: 700;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .03em;
	border: 0;
	border-bottom: 1px solid #e4e8ee;
	padding: 12px 14px;
	text-align: left;
}
#center_column #order-list tbody td {
	border: 0;
	border-bottom: 1px solid #eef1f5;
	padding: 14px;
	font-size: 14px;
	vertical-align: middle;
	background: #fff;
}
#center_column #order-list tbody tr:hover td { background: #fafbfc; }
#center_column #order-list .history_link a { color: #d9651a; font-weight: 700; }
#center_column #order-list .history_state .label {
	display: inline-block;
	padding: 5px 11px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	color: #fff;
	border: 0;
}
#center_column #order-list .history_state .label.dark { color: #1f2733; }

/* ===================== Phase 3 — order detail ===================== */
.od-wrap { max-width: 1040px; margin: 0 auto; }
.od-title { font-size: 20px; font-weight: 800; margin: 0 0 18px; color: #1f2733; }
.od-info { background: #f7f9fc; border: 1px solid #e4e8ee; border-radius: 12px; padding: 14px 18px; margin: 0 0 20px; font-size: 14px; line-height: 1.8; }
.od-info .od-lbl { font-weight: 700; color: #1f2733; margin-right: 4px; }
.od-followup { font-size: 14px; margin: 0 0 18px; }
.od-addresses { display: flex; gap: 16px; flex-wrap: wrap; margin: 0 0 22px; }
.od-addr { flex: 1; min-width: 240px; background: #fff; border: 1px solid #e4e8ee; border-radius: 12px; padding: 16px 18px; }
.od-addr h3 { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: #6b7480; margin: 0 0 10px; }
.od-addr ul { list-style: none; margin: 0; padding: 0; font-size: 14px; line-height: 1.7; }
.od-products { margin: 0 0 18px; }
.od-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; }
.od-table thead th { background: #f7f9fc; color: #6b7480; font-weight: 700; font-size: 12px; text-transform: uppercase; letter-spacing: .03em; padding: 12px 14px; text-align: left; border-bottom: 1px solid #e4e8ee; }
.od-table tbody td { padding: 14px; border-bottom: 1px solid #eef1f5; vertical-align: middle; }
.od-table .od-pname { font-weight: 600; }
.od-pstatus { display: inline-block; padding: 4px 10px; border-radius: 999px; background: #eef1f5; color: #1f2733; font-size: 12px; font-weight: 700; }
.od-summary { max-width: 420px; margin: 0 0 24px auto; background: #f7f9fc; border: 1px solid #e4e8ee; border-radius: 12px; padding: 6px 18px; }
.od-sum-row { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; font-size: 14px; border-bottom: 1px solid #e9edf2; }
.od-sum-row:last-child { border-bottom: 0; }
.od-sum-total { font-weight: 800; font-size: 17px; border-top: 2px solid #d8dee6; }
.od-vat-note { max-width: 420px; margin: -16px 0 26px auto; text-align: right; font-size: 12px; color: #6b7480; }
@media (max-width: 680px) {
	.od-table thead { display: none; }
	.od-table, .od-table tbody, .od-table tr, .od-table td { display: block; width: 100%; }
	.od-table tr { border: 1px solid #e4e8ee; border-radius: 12px; margin: 0 0 12px; padding: 6px 2px; }
	.od-table tbody td { border: 0; padding: 8px 14px; display: flex; justify-content: space-between; gap: 14px; text-align: right; }
	.od-table tbody td:before { content: attr(data-th); font-weight: 700; color: #6b7480; font-size: 12px; text-align: left; }
	.od-summary { max-width: none; margin-left: 0; }
	.od-vat-note { max-width: none; text-align: left; }
}

/* ===================== Phase 4 — addresses + identity (forms) ===================== */
/* Card wrapper (identity info box, etc.) */
#center_column .box {
	background: #fff;
	border: 1px solid #e4e8ee;
	border-radius: 14px;
	padding: 22px;
	box-shadow: none;
	margin: 0 0 20px;
}
#center_column .box .page-subheading,
#center_column h1.page-subheading {
	font-size: 16px;
	font-weight: 800;
	color: #1f2733;
	text-transform: none;
	border: 0;
	padding: 0;
	margin: 0 0 16px;
}
#center_column .info-title { color: #6b7480; font-size: 14px; }
#center_column .required sup, #center_column .required .required sup { color: #c0392b; }

/* Form fields */
#center_column .form-group { margin-bottom: 14px; }
#center_column .form-group > label,
#center_column form.std label { display: block; font-size: 13px; font-weight: 600; color: #1f2733; margin-bottom: 5px; }
#center_column .form-control {
	width: 100%;
	max-width: 440px;
	height: auto;
	padding: 10px 12px;
	border: 1px solid #cfd6df;
	border-radius: 9px;
	font-size: 14px;
	box-shadow: none;
}
#center_column .form-control:focus { border-color: #f47b20; box-shadow: 0 0 0 3px rgba(244, 123, 32, .12); outline: 0; }
#center_column .checkbox label { font-weight: 400; font-size: 14px; }

/* Address list cards */
#center_column .bloc_adresses { display: flex; flex-wrap: wrap; gap: 16px; margin: 0 0 16px; }
#center_column .bloc_adresses .address { float: none; width: auto; flex: 1; min-width: 260px; padding: 0; }
#center_column .bloc_adresses .address ul.box {
	height: 100%;
	list-style: none;
	margin: 0;
}
#center_column .bloc_adresses .address ul.box li { list-style: none; font-size: 14px; line-height: 1.7; }
#center_column .bloc_adresses .address ul.box .page-subheading {
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: #d9651a;
	font-weight: 700;
	margin: 0 0 10px;
}
#center_column .address_update { margin-top: 16px; display: flex; gap: 8px; flex-wrap: wrap; }

/* Address form: "I'm buying for a company" toggle hides the company/IČO/IČ DPH fields by default. */
#center_column .od-biz-toggle { margin: 4px 0 18px; }
#center_column .od-biz-check { display: flex; align-items: center; gap: 9px; font-weight: 600; font-size: 14px; color: #1f2733; cursor: pointer; margin: 0; }
#center_column .od-biz-check input { width: 18px; height: 18px; flex: 0 0 auto; }
#add_address { display: flex; flex-direction: column; }
#add_address .js-biz { display: none !important; }
#add_address.show-biz .js-biz { display: block !important; }
/* Group the company fields together under the checkbox: Firma, IČO, DIČ, IČ DPH. */
#add_address .od-biz-toggle { order: -5; }
#add_address .od-company-field { order: -4; }
#add_address .dni_area { order: -3; }
#add_address .dic_area { order: -2; }
#add_address #vat_area { order: -1; }

/* ===================== Phase 6 — overall polish ===================== */
/* The breadcrumb is empty/dead on account pages — hide it. */
.breadcrumb_bg { display: none; }

/* Intro / info paragraphs softer + readable width */
#center_column .info-account,
#center_column .info-title,
#center_column .account_creation > p,
#center_column .addresses > p { color: #6b7480; font-size: 14px; max-width: 760px; line-height: 1.6; }
#center_column .info-account strong,
#center_column .addresses > p strong { color: #1f2733; }

/* Alerts → soft rounded cards (instead of the harsh default blocks) */
#center_column .alert { border-radius: 12px; padding: 13px 16px; font-size: 14px; box-shadow: none; border: 1px solid; }
#center_column .alert-danger { background: #fdecea; border-color: #f3c2bc; color: #8e2b20; }
#center_column .alert-success { background: #eafaf0; border-color: #bfe8cd; color: #1d6b3d; }
#center_column .alert-warning { background: #fff7e0; border-color: #f0dca0; color: #7a5b00; }
#center_column #create_account_error { border-radius: 12px; }

/* Login (authentication) — two equal-height cards, comfortable spacing */
#authentication #center_column .row { display: flex; flex-wrap: wrap; }
#authentication #center_column .row > div { display: flex; margin-bottom: 16px; }
#authentication #center_column .row > div > .box { width: 100%; margin-bottom: 0; }
#authentication #center_column #login_form .lost_password { margin: 6px 0 14px; }
#authentication #center_column .box .submit,
#authentication #center_column .box p.submit { margin-bottom: 0; }

/* Address list cards a touch more padding */
#center_column .bloc_adresses .address ul.box { padding: 20px; }

@media (max-width: 767px) {
	#center_column .page-heading { font-size: 20px; }
	#authentication #center_column .row > div { width: 100%; }
}

/* Registration form — company fields (Firma/IČO/DIČ/IČ DPH) behind the same checkbox. */
#account-creation_form .js-biz,
#account-creation_form .dni_area,
#account-creation_form .dic_area,
#account-creation_form #vat_number { display: none !important; }
#account-creation_form.show-biz .js-biz,
#account-creation_form.show-biz .dni_area,
#account-creation_form.show-biz .dic_area,
#account-creation_form.show-biz #vat_number { display: block !important; }

