/**
 * TARG Design System — dashboard overview.
 */

/* ==========================================================
   SATOSHI — LOKALNE PLIKI
========================================================== */

@font-face {
font-family: "Satoshi";
src: url("../assets/fonts/Satoshi-Regular.woff2") format("woff2");
font-weight: 400;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: "Satoshi";
src: url("../assets/fonts/Satoshi-Medium.woff2") format("woff2");
font-weight: 500;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: "Satoshi";
src: url("../assets/fonts/Satoshi-Bold.woff2") format("woff2");
font-weight: 700;
font-style: normal;
font-display: swap;
}

body.tds-dashboard-page,
body.tds-dashboard-page button,
body.tds-dashboard-page input,
body.tds-dashboard-page select,
body.tds-dashboard-page textarea {
font-family:
"Satoshi",
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
sans-serif !important;
}

/* ==========================================================
   KONTENER
========================================================== */

body.tds-dashboard-module-dashboard
#tds-dashboard-overview {
width: 100%;
margin-top: 28px;
}

body.tds-dashboard-module-dashboard
.tds-dashboard-overview__grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 24px;
width: 100%;
}

/* ==========================================================
   KARTA
========================================================== */

body.tds-dashboard-module-dashboard
.tds-dashboard-overview-card {
position: relative;

display: flex;
flex-direction: column;
align-items: flex-start;

min-width: 0;
min-height: 220px;
padding: 34px;

color: #262824;
background: #ffffff;

border: 1px solid #ebe7e0;
border-radius: 14px;

box-shadow:
0 1px 2px rgba(28, 30, 27, 0.02),
0 10px 28px rgba(28, 30, 27, 0.04);

text-decoration: none;

transition:
transform 160ms ease,
border-color 160ms ease,
box-shadow 160ms ease;
}

body.tds-dashboard-module-dashboard
.tds-dashboard-overview-card:hover {
color: #262824;
border-color: #ddd4c7;

box-shadow:
0 2px 4px rgba(28, 30, 27, 0.025),
0 16px 38px rgba(28, 30, 27, 0.065);

transform: translateY(-2px);
}

/* ==========================================================
   IKONA
========================================================== */

body.tds-dashboard-module-dashboard
.tds-dashboard-overview-card__icon {
display: inline-flex;
align-items: center;
justify-content: center;

width: 66px;
height: 66px;
margin-bottom: 27px;

color: #aa7335;
background: #f8f0e5;

border-radius: 50%;
}

body.tds-dashboard-module-dashboard
.tds-dashboard-overview-card__icon svg {
display: block;
width: 31px;
height: 31px;

stroke: currentColor;
stroke-width: 1.7;
stroke-linecap: round;
stroke-linejoin: round;
fill: none;
}

/* ==========================================================
   LICZBA I OPIS
========================================================== */

body.tds-dashboard-module-dashboard
.tds-dashboard-overview-card__value {
display: block;
margin: 0 0 9px;

color: #262824;

font-size: 39px;
font-weight: 700;
line-height: 1;
letter-spacing: -0.05em;
}

body.tds-dashboard-module-dashboard
.tds-dashboard-overview-card__label {
display: block;
max-width: 205px;

color: #666963;

font-size: 15px;
font-weight: 400;
line-height: 1.42;
letter-spacing: -0.01em;
}

/* ==========================================================
   USUNIĘCIE STAREGO UKŁADU REALHOMES
========================================================== */

body.tds-dashboard-module-dashboard
.dashboard-small-widgets {
display: none !important;
}

/* ==========================================================
   RESPONSYWNOŚĆ
========================================================== */

@media (max-width: 1250px) {
body.tds-dashboard-module-dashboard
.tds-dashboard-overview__grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}

@media (max-width: 720px) {
body.tds-dashboard-module-dashboard
.tds-dashboard-overview__grid {
grid-template-columns: minmax(0, 1fr);
gap: 16px;
}

body.tds-dashboard-module-dashboard
.tds-dashboard-overview-card {
min-height: 190px;
padding: 27px;
}
}
