:root {
    --ct-price-navy: #091c2e;
    --ct-price-panel: #10283e;
    --ct-price-panel-deep: #0b2135;
    --ct-price-blue: #2d7dcc;
    --ct-price-line: rgba(162, 194, 221, .26);
    --ct-price-green: #1bc75f;
    --ct-price-red: #f0524d;
}

body.canada-today-market-prices-page,
body.test-theme-gold-page {
    background: var(--ct-price-navy) !important;
}

body.canada-today-market-prices-page .main-container,
body.canada-today-market-prices-page .default-template,
body.canada-today-market-prices-page .default-template .content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.ct-price-page {
    min-height: 720px;
    padding: 30px 16px 58px;
    color: #f7fbff;
    background: var(--ct-price-navy);
    font-family: "Noto Kufi Arabic", Tahoma, Arial, sans-serif;
}

.ct-price-shell {
    width: min(1320px, 100%);
    margin: 0 auto;
}

.ct-price-title,
.ct-price-section__header {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    border-top: 2px solid rgba(142, 177, 207, .22);
}

.ct-price-title {
    justify-content: flex-start;
    margin-bottom: 24px;
    padding-top: 16px;
}

.ct-price-title > span,
.ct-price-section__header > span {
    width: 0;
    height: 0;
    flex: 0 0 auto;
    border-top: 15px solid var(--ct-price-blue);
    border-left: 15px solid transparent;
}

.ct-price-title h1 {
    margin: -7px 0 4px;
    color: #fff;
    font-size: clamp(29px, 4vw, 44px);
    font-weight: 900;
}

.ct-price-title p {
    margin: 0;
    color: #a9bdce;
    font-size: 12px;
}

.ct-price-section {
    margin-top: 26px;
}

.ct-price-section__header {
    margin-bottom: 12px;
    padding-top: 11px;
}

.ct-price-section__header > span {
    border-top-width: 12px;
    border-left-width: 12px;
}

.ct-price-section__header h2 {
    margin: -4px 0 0;
    color: #fff;
    font-size: clamp(20px, 2.5vw, 27px);
    font-weight: 900;
}

.ct-price-section__header small {
    display: block;
    margin-top: 5px;
    color: #a9bdce;
    font-size: 11px;
}

.ct-price-table-scroll {
    overflow-x: auto;
    border: 1px solid #385067;
    scrollbar-color: #3978b5 #0b1e31;
}

.ct-price-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
    color: #fff;
    background: var(--ct-price-panel-deep);
    font-size: 13px;
}

.ct-price-table th,
.ct-price-table td {
    height: 48px;
    padding: 10px 15px;
    border-left: 1px solid rgba(159, 192, 218, .13);
    border-bottom: 1px dashed rgba(159, 192, 218, .3);
    text-align: right;
    vertical-align: middle;
}

.ct-price-table tr:last-child td { border-bottom: 0; }
.ct-price-table th { color: #d9edff; background: #17334e; font-size: 12px; font-weight: 900; }
.ct-price-table td:first-child { width: 34%; }
.ct-price-table a { color: #fff !important; font-weight: 800; text-decoration: none !important; }
.ct-price-table a:hover { color: #74bdff !important; }
.ct-price-table strong { font: 900 14px Arial, sans-serif; }
.ct-price-table small { color: #8dbce3; font: 800 10px Arial, sans-serif; }
.ct-price-change { direction: ltr; font: 800 13px Arial, sans-serif; text-align: right !important; }
.ct-price-change.is-up { color: var(--ct-price-green); }
.ct-price-change.is-down { color: var(--ct-price-red); }
.ct-price-empty { height: 90px !important; color: #afc0cf; text-align: center !important; }

.ct-price-source {
    margin: 16px 0 0;
    color: #91a9bd;
    font-size: 11px;
    line-height: 1.8;
}

.ct-gold-feature {
    border-top: 1px solid #385067;
}

.ct-gold-feature .ct-commodity-chart path {
    stroke: #d6a72c;
}

.ct-gold-table {
    min-width: 560px;
}

.ct-gold-table td:first-child {
    width: 34%;
}

.ct-price-news { margin-top: 38px; }
.ct-price-news__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.ct-price-news__card { min-width: 0; background: #10283e; border-bottom: 3px solid #216eb1; }
.ct-price-news__image { display: block; height: 150px; overflow: hidden; background: #163149; }
.ct-price-news__image img,
.ct-price-news__image .canada-card__placeholder { width: 100%; height: 100%; object-fit: cover; }
.ct-price-news__card > div { padding: 12px 13px 14px; }
.ct-price-news__card small { color: #4ba5ef; font-size: 10px; font-weight: 800; }
.ct-price-news__card h3 { margin: 7px 0 11px; font-size: 14px; line-height: 1.65; }
.ct-price-news__card h3 a { color: #fff !important; text-decoration: none !important; }
.ct-price-news__card time { color: #8fa6b9; font-size: 10px; }

.ct-commodity-tabs {
    display: flex;
    justify-content: flex-start;
    margin: -12px 0 0;
    border-bottom: 1px solid #385067;
}

.ct-commodity-tabs a {
    min-width: 130px;
    padding: 11px 24px;
    color: #fff !important;
    background: #10283e;
    border: 1px solid #385067;
    border-bottom: 0;
    font-weight: 900;
    text-align: center;
    text-decoration: none !important;
}

.ct-commodity-tabs a:first-child { background: var(--ct-price-blue); }

.ct-commodity-feature {
    margin-top: 0;
    padding: 26px 30px 18px;
    background: #0b1f32;
    border: 1px solid #385067;
    border-top: 0;
}

.ct-commodity-feature__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 30px;
    align-items: end;
}

.ct-commodity-feature__head small { color: #91a9bd; font-size: 11px; }
.ct-commodity-feature__head h2 { margin: 5px 0 7px; color: #fff; font-size: 27px; font-weight: 900; }
.ct-commodity-feature__head p { margin: 0; color: #b4c4d1; font-size: 11px; }
.ct-commodity-feature__value { display: grid; justify-items: start; direction: ltr; }
.ct-commodity-feature__value strong { color: #fff; font: 900 clamp(35px, 5vw, 58px) Arial, sans-serif; }
.ct-commodity-feature__value small { margin: 3px 0; }
.ct-commodity-feature__value span { font: 800 13px Arial, sans-serif; }
.ct-commodity-feature__value.is-up span { color: var(--ct-price-green); }
.ct-commodity-feature__value.is-down span { color: var(--ct-price-red); }

.ct-commodity-chart {
    height: 165px;
    margin-top: 25px;
    padding: 12px;
    border-top: 1px solid var(--ct-price-line);
    border-bottom: 1px solid var(--ct-price-line);
    background: repeating-linear-gradient(to bottom, transparent 0, transparent 44px, rgba(149, 180, 205, .08) 45px);
}

.ct-commodity-chart svg { width: 100%; height: 100%; }
.ct-commodity-chart path { fill: none; stroke: #2674b9; stroke-width: 3; vector-effect: non-scaling-stroke; }

@media (max-width: 900px) {
    .ct-price-news__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    .ct-price-page { padding: 22px 10px 42px; }
    .ct-price-title { margin-bottom: 18px; }
    .ct-price-title h1 { font-size: 28px; }
    .ct-price-section { margin-top: 22px; }
    .ct-price-table { min-width: 680px; font-size: 12px; }
    .ct-price-table th,
    .ct-price-table td { height: 44px; padding: 8px 10px; }
    .ct-price-news__grid { grid-template-columns: 1fr; gap: 12px; }
    .ct-price-news__card { display: grid; grid-template-columns: 125px minmax(0, 1fr); }
    .ct-price-news__image { height: 100%; min-height: 120px; }
    .ct-commodity-tabs a { min-width: 50%; padding-inline: 12px; }
    .ct-commodity-feature { padding: 20px 16px 14px; }
    .ct-commodity-feature__head { grid-template-columns: 1fr; gap: 18px; }
    .ct-commodity-chart { height: 125px; }
}
