/*
 * DiERP portal (/me, portal lists, Profile & password): the dashboard look of the desk for
 * customers and suppliers. Soft grey cards (radius 22) on white, white rows (14) and tiles (18),
 * round icon badges, two colours: brand (Brand Settings) + highlight; red only for trouble.
 * Scoped to .dp-* and the portal sidebar, so other website pages keep their look.
 */
.dp-page, .dp-sidebar, .dp-list {
	--dp-brand: #023e7d;
	--dp-brand-soft: #e8eef7;
	--dp-hl: #f17021;
	--dp-hl-soft: #fff1e6;
	--dp-hl-ink: #a8480d;
	--dp-soft: #f5f6fa;
	--dp-track: #e9edf3;
	--dp-ink: #1b2330;
	--dp-muted: #5b6575;
	--dp-red-soft: #fde8e8;
	--dp-red-ink: #b91c1c;
	--dp-green-soft: #e3f4ea;
	--dp-green-ink: #166534;
	color: var(--dp-ink);
}
[data-dierp-brand]:not([data-dierp-brand="navy"]) { --dp-hl: #eda100; --dp-hl-soft: #fff4d6; --dp-hl-ink: #8a5a00; }
[data-dierp-brand="blue"] { --dp-brand: #1d4ed8; --dp-brand-soft: #e6edfc; }
[data-dierp-brand="teal"] { --dp-brand: #0f766e; --dp-brand-soft: #e2f3f1; }
[data-dierp-brand="indigo"] { --dp-brand: #4338ca; --dp-brand-soft: #ebe9fb; }
[data-dierp-brand="emerald"] { --dp-brand: #047857; --dp-brand-soft: #e1f3ec; }
[data-dierp-brand="rose"] { --dp-brand: #be123c; --dp-brand-soft: #fbe7ec; }
[data-dierp-brand="slate"] { --dp-brand: #334155; --dp-brand-soft: #eceff3; }

.dp-page { display: flex; flex-direction: column; gap: 22px; padding-bottom: 32px; }
.dp-page a, .dp-sidebar a, .dp-list a { text-decoration: none; }
.dp-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.dp-title { margin: 0; font-size: 28px; font-weight: 700; letter-spacing: -0.02em; color: var(--dp-ink); }
.dp-sub { margin: 6px 0 0; font-size: 14px; color: var(--dp-muted); }
.dp-num, .dp-kpi-figure { font-variant-numeric: tabular-nums; white-space: nowrap; }
.dp-link { font-size: 13px; font-weight: 650; color: var(--dp-brand); }

.dp-btn { display: inline-flex; align-items: center; gap: 8px; border: 0; border-radius: 999px; padding: 11px 18px;
	font-size: 14px; font-weight: 650; line-height: 1.2; cursor: pointer; white-space: nowrap; }
.dp-btn-sm { padding: 7px 15px; font-size: 13px; }
.dp-btn-highlight, .dp-btn-highlight:hover { background: var(--dp-hl); color: #fff; }
.dp-btn-brand, .dp-btn-brand:hover { background: var(--dp-brand); color: #fff; }
.dp-btn-soft, .dp-btn-soft:hover { background: var(--dp-brand-soft); color: var(--dp-brand); }
.dp-btn:hover { filter: brightness(0.95); }
.dp-btn:focus-visible, .dp-tile:focus-visible, .dp-card:focus-visible, .dp-row:focus-visible, .dp-side-link:focus-visible {
	outline: 2px solid var(--dp-brand); outline-offset: 2px; }

.dp-card { background: var(--dp-soft); border-radius: 22px; padding: 20px 22px; display: flex; flex-direction: column; gap: 10px; color: var(--dp-ink); }
.dp-card-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 4px; }
.dp-card-title { margin: 0; font-size: 17px; font-weight: 650; color: var(--dp-ink); }
.dp-empty { margin: 0; font-size: 13px; color: var(--dp-muted); background: #fff; border-radius: 14px; padding: 14px; }

.dp-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 14px; }
.dp-kpi { gap: 12px; }
a.dp-kpi:hover { color: var(--dp-ink); background: #eef0f5; }
.dp-kpi-head { display: flex; align-items: center; gap: 10px; }
.dp-kpi-label { font-size: 15px; font-weight: 650; }
.dp-kpi-figure { font-size: clamp(22px, 2.2vw, 30px); font-weight: 700; letter-spacing: -0.03em; line-height: 1.15; }

.dp-badge { flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; }
.dp-badge-brand { background: var(--dp-brand); }
.dp-badge-highlight { background: var(--dp-hl); }

.dp-chip { display: inline-block; font-size: 12px; font-weight: 600; border-radius: 999px; padding: 3px 10px; white-space: nowrap;
	background: #fff; color: #4a5565; }
.dp-chip-red { background: var(--dp-red-soft); color: var(--dp-red-ink); }
.dp-chip-green { background: var(--dp-green-soft); color: var(--dp-green-ink); }
.dp-chip-amber { background: var(--dp-hl-soft); color: var(--dp-hl-ink); }
.dp-chip-brand { background: var(--dp-brand-soft); color: var(--dp-brand); }
.dp-row .dp-chip-plain, .dp-list .dp-chip-plain { background: var(--dp-soft); }

.dp-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.dp-tile { background: #fff; border-radius: 18px; padding: 16px; display: flex; flex-direction: column; gap: 10px; color: var(--dp-ink); }
.dp-tile:hover { color: var(--dp-ink); box-shadow: 0 0 0 2px var(--dp-brand-soft); }
.dp-tile-label { font-size: 14.5px; font-weight: 650; }
.dp-tile-hint { font-size: 12px; color: var(--dp-muted); margin-top: -4px; }

.dp-split { display: flex; flex-wrap: wrap; gap: 16px; }
.dp-split-narrow { flex: 1 1 300px; }
.dp-split-wide { flex: 2 1 420px; }

.dp-row { background: #fff; border-radius: 14px; padding: 11px 14px; display: flex; align-items: center; gap: 12px; color: var(--dp-ink); }
a.dp-row:hover { color: var(--dp-ink); box-shadow: 0 0 0 2px var(--dp-brand-soft); }
.dp-row-stack { flex-direction: column; align-items: stretch; gap: 8px; }
.dp-row-line { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.dp-row-line .dp-row-title:first-child { min-width: 0; overflow-wrap: anywhere; }
.dp-row-wrap { flex-wrap: wrap; }
.dp-row-main { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; }
.dp-row-title { font-size: 14px; font-weight: 650; }
.dp-row-sub { font-size: 12px; color: var(--dp-muted); }
.dp-track { flex: 0 0 140px; height: 8px; border-radius: 999px; background: var(--dp-track); overflow: hidden; }
.dp-track > span { display: block; height: 100%; background: var(--dp-brand); border-radius: 999px; }


/* Portal lists */
.page-header-wrapper:has(+ .page_content .dp-list) .my-account-header,
.page_content:has(.dp-list) ~ * .my-account-header,
.main-column:has(.dp-list) .my-account-header { font-size: 28px; font-weight: 700; letter-spacing: -0.02em; color: #1b2330; margin: 0 0 6px; }
.main-column:has(.dp-list) .page-breadcrumbs { display: none; }
.dp-list { display: flex; flex-direction: column; gap: 16px; padding-bottom: 32px; }
.dp-list-cards .dp-kpi { gap: 8px; padding: 18px 22px; }
.dp-list-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.dp-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.dp-tab { font-size: 13.5px; font-weight: 600; padding: 8px 14px; border-radius: 999px; background: var(--dp-soft); color: var(--dp-ink); }
.dp-tab:hover { color: var(--dp-ink); background: #eceff4; }
.dp-tab.active, .dp-tab.active:hover { background: var(--dp-brand); color: #fff; }
.dp-tab-count { opacity: .75; font-variant-numeric: tabular-nums; }
.dp-search { display: flex; align-items: center; gap: 8px; background: var(--dp-soft); border-radius: 999px; padding: 8px 14px; min-width: 220px; color: var(--dp-muted); margin: 0; }
.dp-search input { border: 0; background: transparent; font-size: 13.5px; outline: none; width: 100%; color: var(--dp-ink); }
.dp-search:focus-within { box-shadow: 0 0 0 2px var(--dp-brand-soft); }
.dp-list .website-list { margin: 0; padding: 0; }
.dp-list-row .dp-row-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-rows { background: var(--dp-soft); border-radius: 22px; padding: 10px; display: flex; flex-direction: column; gap: 6px; }
.dp-list .web-list-item.dp-list-row { margin: 0; border: 0; padding: 12px 14px; }
.dp-list-row { display: grid; grid-template-columns: minmax(0, 1fr) 130px 150px 120px; gap: 12px; align-items: center; }
.dp-row-link, .dp-row-link:hover { color: var(--dp-ink); }
.dp-row-link:hover .dp-row-title { color: var(--dp-brand); }
.dp-row-amount { text-align: right; }
.dp-row-actions { display: flex; gap: 6px; justify-content: flex-end; align-items: center; }
.dp-icon-btn { border: 0; cursor: pointer; width: 32px; height: 32px; border-radius: 50%; background: var(--dp-soft); color: var(--dp-brand); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.dp-icon-btn:hover { background: var(--dp-brand-soft); color: var(--dp-brand); }
.dp-list .more-block { padding: 12px 0 0; text-align: center; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }


/* Forms: Ask for a quote */
.dp-input { width: 100%; border: 1px solid #dde2ea; background: #fff; border-radius: 12px; padding: 9px 12px; font-size: 14px; color: var(--dp-ink); outline: none; }
.dp-input:focus { border-color: var(--dp-brand); box-shadow: 0 0 0 3px var(--dp-brand-soft); }
.dp-quote-head { display: grid; grid-template-columns: minmax(0, 1fr) 120px 32px; gap: 10px; padding: 0 14px; font-size: 12px; font-weight: 650; color: var(--dp-muted); }
.dp-quote-rows { display: flex; flex-direction: column; gap: 8px; }
.dp-quote-row { display: grid; grid-template-columns: minmax(0, 1fr) 120px 32px; gap: 10px; padding: 8px 10px; }
.dp-quote-more { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 12px; margin-top: 6px; }
.dp-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 650; margin: 0; }
.dp-quote-send { display: flex; justify-content: flex-end; gap: 10px; margin-top: 6px; }
.dp-q-error { margin: 0; color: var(--dp-red-ink); font-size: 13px; font-weight: 600; }
.dp-btn:disabled { opacity: .6; cursor: progress; }


/* Document page (invoice, order, quotation, shipment, supplier documents) */
#page-order .main-column .page-content-wrapper .container.my-4:has(.dp-page) { background: transparent; box-shadow: none; padding: 0; border-radius: 0; }
.dp-crumb { font-size: 13px; color: var(--dp-muted); margin-bottom: -10px; }
.dp-crumb a { font-weight: 600; color: var(--dp-brand); }
.dp-head-top { align-items: flex-start; }
.dp-head-main { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.dp-head-meta { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.dp-sub-inline { margin: 0; font-size: 13px; }
.dp-head-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.dp-track-full { flex: none !important; width: 100%; height: 8px; }
.dp-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px; }
.dp-fact { background: #fff; border-radius: 14px; padding: 11px 14px; display: flex; flex-direction: column; min-width: 0; overflow-wrap: anywhere; }
a.dp-row-title { color: var(--dp-brand); }
.dp-items { display: flex; flex-direction: column; gap: 6px; }
.dp-item { display: grid; grid-template-columns: minmax(0, 1fr) 120px 110px 130px; gap: 12px; align-items: center; background: #fff; border-radius: 14px; padding: 11px 14px; font-size: 14px; }
.dp-item > .dp-num { text-align: right; }
.dp-item-head { background: transparent; padding: 0 14px; font-size: 12px; font-weight: 650; color: var(--dp-muted); }
.dp-item-head > span:not(:first-child) { text-align: right; }
.dp-item-name { display: flex; flex-direction: column; min-width: 0; }
.dp-item-mobile { display: none; }
.dp-totals { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; padding: 10px 14px 0; font-size: 14px; }
.dp-total { display: grid; grid-template-columns: minmax(140px, auto) 130px; gap: 12px; color: var(--dp-muted); }
.dp-total > .dp-num { text-align: right; color: var(--dp-ink); }
.dp-total-grand { font-weight: 700; font-size: 16px; color: var(--dp-ink); border-top: 1px solid #dde2ea; padding-top: 6px; margin-top: 2px; }


/* Order page: stage line, delivered per item */
.dp-stages-card { padding: 18px 22px; }
.dp-stages { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.dp-stage { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.dp-stage-bar { height: 6px; border-radius: 999px; background: var(--dp-track); overflow: hidden; }
.dp-stage-bar > span { display: block; height: 100%; background: var(--dp-brand); border-radius: 999px; }
.dp-stage-label { display: flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 600; color: var(--dp-muted); }
.dp-stage-dot { width: 18px; height: 18px; border-radius: 50%; border: 2px solid #c9d0db; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.dp-stage-done .dp-stage-label { color: var(--dp-ink); font-weight: 650; }
.dp-stage-done .dp-stage-dot { background: var(--dp-brand); border-color: var(--dp-brand); color: #fff; }
.dp-stage-current .dp-stage-label { color: var(--dp-brand); font-weight: 650; }
.dp-stage-current .dp-stage-dot { border: 3px solid var(--dp-brand); }
.dp-order-cards { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.dp-order-cards .dp-kpi-figure { font-size: clamp(20px, 2vw, 26px); }
.dp-oitem { display: grid; grid-template-columns: minmax(0, 1fr) 200px 110px 120px; gap: 14px; align-items: center; background: #fff; border-radius: 14px; padding: 12px 14px; font-size: 14px; }
.dp-oitem.dp-item-head { background: transparent; padding: 0 14px; }
.dp-oitem > .dp-num { text-align: right; }
.dp-oitem.dp-item-head > span:nth-child(n+3) { text-align: right; }
.dp-oitem-got { display: flex; flex-direction: column; gap: 5px; }
.dp-oitem-got-line { display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; font-weight: 650; }
.dp-track-thin { height: 6px !important; }
.dp-todo { color: var(--dp-hl-ink); font-weight: 600; }
.dp-ok { color: var(--dp-green-ink); font-weight: 600; }
.dp-split-half { flex: 1 1 320px; }


/* Quotation answers, shipment check */
.dp-kpi-figure-sm { font-size: 20px !important; overflow-wrap: anywhere; white-space: normal; }
.dp-link-figure { color: var(--dp-brand); }
a.dp-card.dp-kpi:hover { color: var(--dp-ink); background: #eef0f5; }
.dp-step { width: 26px; height: 26px; border-radius: 50%; background: var(--dp-brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; flex: none; }
.dp-aitem { display: grid; grid-template-columns: minmax(0, 1fr) 140px 170px; gap: 12px; align-items: center; background: #fff; border-radius: 14px; padding: 11px 14px; font-size: 14px; }
.dp-aitem.dp-item-head { background: transparent; padding: 0 14px; }
.dp-aitem > :not(:first-child) { text-align: right; }
.dp-aitem-of { font-size: 12.5px; }


/* Give price (supplier) */
.dp-pitem { display: grid; grid-template-columns: minmax(0, 1fr) 120px 190px 130px; gap: 12px; align-items: center; background: #fff; border-radius: 14px; padding: 11px 14px; font-size: 14px; }
.dp-pitem.dp-item-head { background: transparent; padding: 0 14px; }
.dp-pitem > :nth-child(2), .dp-pitem > :nth-child(4) { text-align: right; }
.dp-pitem-price { margin: 0; }
.dp-pitem-price .dp-input { text-align: right; }
.dp-pitem-mobile { display: none; }
.dp-pterms { display: grid; grid-template-columns: 200px 200px minmax(0, 1fr); gap: 12px; }

/* The portal menu, grouped */
.dp-sidebar { display: flex; flex-direction: column; font-size: 14.5px; padding: 4px 0 40px; }
.dp-sidebar .sidebar-items { display: flex; flex-direction: column; gap: 2px; }
.dp-side-title { font-size: 15px; font-weight: 650; padding: 0 14px 8px; }
.dp-side-group { font-size: 11.5px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: #6b7585; padding: 16px 14px 6px; }
.dp-side-link { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 14px; border-radius: 14px;
	color: var(--dp-ink); font-weight: 500; }
.dp-side-link:hover { background: var(--dp-soft); color: var(--dp-ink); }
.dp-side-link.active { background: var(--dp-brand-soft); color: var(--dp-brand); font-weight: 650; }
.dp-side-home { justify-content: flex-start; }
.dp-side-badge { font-size: 11.5px; font-weight: 700; background: var(--dp-red-soft); color: var(--dp-red-ink); border-radius: 999px; padding: 1px 8px; }
.dp-side-badge-amber { background: var(--dp-hl-soft); color: var(--dp-hl-ink); }

/* Website chrome around the portal: logo bar and footer quieter */
.web-footer { border-top: 1px solid #edf0f4; }

/* Below 992px Frappe hides the side menu; DiERP shows it as a row of pills you can swipe */
@media (max-width: 991px) {
	.sidebar-column:has(.dp-sidebar) { display: block; width: 100%; max-width: 100%; flex: 0 0 100%; }
	.dp-sidebar { margin: 8px 0 4px; }
	.dp-sidebar .sidebar-items { flex-direction: row; flex-wrap: nowrap; overflow-x: auto; gap: 6px; padding-bottom: 6px; }
	.dp-side-group { display: none; }
	.dp-side-link { flex: none; background: var(--dp-soft); border-radius: 999px; padding: 8px 14px; min-height: 40px; }
}
@media (max-width: 767px) {
	.dp-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
	.dp-cards > .dp-kpi:first-child { grid-column: 1 / -1; }
	.dp-cards > .dp-kpi:not(:first-child) { border-radius: 18px; padding: 14px 12px; gap: 4px; }
	.dp-cards > .dp-kpi:not(:first-child) .dp-badge,
	.dp-cards > .dp-kpi:not(:first-child) .dp-chip { display: none; }
	.dp-cards > .dp-kpi:not(:first-child) .dp-kpi-label { font-size: 12px; color: var(--dp-muted); }
	.dp-cards > .dp-kpi:not(:first-child) .dp-kpi-figure { font-size: 22px; }
	.dp-kpi .dp-chip { white-space: normal; }
	.dp-row { flex-wrap: wrap; }
	.dp-row > .dp-row-main { flex-basis: 100%; }
	.dp-row > .dp-num { margin-right: auto; }
	.dp-list-row { grid-template-columns: minmax(0, 1fr) auto; }
	.dp-list-row .dp-row-main { grid-column: 1 / -1; }
	.dp-row-amount { text-align: left; }
	.dp-row-actions { grid-column: 1 / -1; justify-content: flex-start; }
	.dp-search { min-width: 0; flex: 1 1 100%; }
	.dp-tabs { flex-wrap: nowrap; overflow-x: auto; }
	.dp-tab { flex: none; }
	.dp-quote-head { display: none; }
	.dp-quote-row { grid-template-columns: minmax(0, 1fr) 84px 32px; }
	.dp-quote-more { grid-template-columns: 1fr; }
	.dp-head-actions { width: 100%; }
	.dp-head-actions .dp-btn { flex: 1 1 0; justify-content: center; }
	.dp-doc-cards { grid-template-columns: 1fr; }
	.dp-doc-cards > .dp-kpi:not(:first-child) { border-radius: 22px; padding: 18px 20px; gap: 8px; }
	.dp-doc-cards > .dp-kpi:not(:first-child) .dp-chip { display: inline-block; }
	.dp-doc-cards > .dp-kpi:not(:first-child) .dp-kpi-label { font-size: 15px; color: var(--dp-ink); }
	.dp-doc-cards > .dp-kpi:not(:first-child) .dp-kpi-figure { font-size: 26px; }
	.dp-item { grid-template-columns: minmax(0, 1fr) auto; }
	.dp-item-head, .dp-item-qty, .dp-item-rate { display: none; }
	.dp-item-mobile { display: block; }
	.dp-facts { grid-template-columns: 1fr; }
	.dp-aitem { grid-template-columns: minmax(0, 1fr) auto; }
	.dp-pitem { grid-template-columns: minmax(0, 1fr) auto; }
	.dp-pitem.dp-item-head { display: none; }
	.dp-pitem-price { grid-column: 1 / -1; }
	.dp-pitem-mobile { display: block; margin-bottom: 4px; }
	.dp-pitem-price .dp-input { text-align: left; font-size: 16px; min-height: 44px; }
	.dp-pitem > .dp-line-total { grid-column: 1 / -1; }
	.dp-pterms { grid-template-columns: 1fr; }
	.dp-totals { align-items: stretch; padding: 10px 14px 0; }
	.dp-total { grid-template-columns: minmax(0, 1fr) auto; }
	.dp-aitem.dp-item-head { display: none; }
	.dp-aitem-of { grid-column: 1 / -1; text-align: left !important; }
	.dp-stages { grid-template-columns: 1fr; gap: 0; }
	.dp-stage { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 2px 10px; padding: 6px 0; }
	.dp-stage-bar { display: none; }
	.dp-stage .dp-row-sub { flex-basis: 100%; padding-left: 28px; }
	.dp-order-cards { grid-template-columns: 1fr 1fr; }
	.dp-order-cards > .dp-kpi:first-child { grid-column: auto; }
	.dp-order-cards .dp-kpi-figure { font-size: 20px; }
	.dp-order-cards > .dp-kpi:not(:first-child) .dp-chip { display: inline-block; white-space: normal; }
	.dp-oitem { grid-template-columns: minmax(0, 1fr) auto; }
	.dp-oitem .dp-item-rate, .dp-oitem.dp-item-head { display: none; }
	.dp-oitem-got { grid-column: 1 / -1; order: 3; }
	.dp-title { font-size: 24px; }
	.dp-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.dp-card { padding: 16px; }
	.dp-btn { min-height: 44px; }
	.dp-track { flex-basis: 100%; }
}

/* ---------- DiERP sign-in (www/login.html, mockups 13–14) ---------- */
body[data-path="login"] { background: #f5f6fa; }
body[data-path="login"] .navbar, body[data-path="login"] .web-footer { display: none; }
.dp-login { min-height: 100vh; display: flex; flex-direction: column; align-items: center; padding: 16px 16px 24px; box-sizing: border-box; font-family: Inter, system-ui, sans-serif; color: #1b2330; }
.dp-login-lang { align-self: flex-end; display: flex; gap: 6px; font-size: 13px; }
.dp-login-lang a { color: #023e7d; border-radius: 999px; padding: 8px 12px; text-decoration: none; }
.dp-login-lang a[aria-current] { background: #e8eef7; color: #1b2330; font-weight: 650; }
.dp-login section { width: 100%; display: flex; justify-content: center; margin: auto 0; }
.dp-login .page-card.dp-login-card { width: 100%; max-width: 420px; margin: 24px auto; background: #fff; border: 0; border-radius: 22px; box-shadow: none; padding: 34px 34px 28px; display: flex; flex-direction: column; gap: 16px; box-sizing: border-box; }
.dp-login-head { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.dp-login-logo { max-height: 36px; width: auto; margin-bottom: 8px; }
.dp-login-head h1 { margin: 0; font-size: 24px; font-weight: 700; letter-spacing: -0.02em; }
.dp-login-head p { margin: 0; font-size: 14px; color: #5b6575; }
.dp-login-google { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 46px; border-radius: 999px; background: #fff; border: 1px solid #dde2ea; color: #1b2330 !important; font-size: 15px; font-weight: 650; text-decoration: none !important; }
.dp-login-google:hover { background: #f5f6fa; }
.dp-login-google img { width: 18px; height: 18px; }
.dp-login-or { display: flex; align-items: center; gap: 12px; font-size: 12px; color: #6b7585; }
.dp-login-or:before, .dp-login-or:after { content: ""; flex: 1; height: 1px; background: #dde2ea; }
.dp-login .page-card.dp-login-card form { display: flex; flex-direction: column; gap: 14px; margin: 0; width: 100%; max-width: none; padding: 0; }
.dp-login .page-card.dp-login-card form.hide { display: none; }
.dp-login-fields { display: flex; flex-direction: column; gap: 6px; }
.dp-login-row { display: flex; justify-content: space-between; align-items: baseline; margin-top: 8px; }
.dp-login-label { font-size: 13px; font-weight: 650; margin: 0; }
.dp-login .form-control.dp-login-in { border: 1px solid #dde2ea; border-radius: 12px; min-height: 44px; padding: 10px 12px; font-size: 15px; background: #fff; color: #1b2330; box-shadow: none; }
.dp-login .form-control.dp-login-in:focus { border-color: #023e7d; box-shadow: 0 0 0 3px rgba(2, 62, 125, .15); }
.dp-login .password-field { position: relative; }
.dp-login .toggle-password { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: 12px; cursor: pointer; }
.dp-login .btn.dp-login-btn { min-height: 46px; border-radius: 999px; background: #023e7d; border: 0; color: #fff; font-size: 15px; font-weight: 650; }
.dp-login .btn.dp-login-btn.btn-default { background: #e8eef7; color: #023e7d; }
.dp-login-link { font-size: 13px; font-weight: 600; color: #023e7d; text-decoration: none; }
.dp-login-center { text-align: center; padding: 6px; }
.dp-login-note { margin: 0; font-size: 12.5px; color: #5b6575; text-align: center; line-height: 1.5; }
.dp-login-alert { background: #fdecec; color: #991b1b; border-radius: 16px; padding: 12px 14px; font-size: 13.5px; line-height: 1.45; }
.dp-login-foot { font-size: 12px; color: #6b7585; padding-top: 8px; }
@media (max-width: 767px) {
	body[data-path="login"] { background: #fff; }
	.dp-login .page-card.dp-login-card { padding: 16px 0; margin: 8px auto; }
	.dp-login .form-control.dp-login-in { font-size: 16px; }
	.dp-login-google, .dp-login .btn.dp-login-btn { min-height: 48px; }
}