/* pretbenzina-v2 — main.css — responsive, single codebase */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ---- Base ---- */
body {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 14px;
    background: #f5f5f5;
    color: #222;
}

a             { color: #0057c3; text-decoration: none; }
a:hover       { text-decoration: underline; }
img           { border: 0; max-width: 100%; height: auto; }

/* ---- Layout ---- */
#wrapper {
    max-width: 1000px;
    margin: 0 auto;
    background: #fff;
}

/* ---- Logo ---- */
#logo {
    padding: 10px 15px;
    background: #fff;
}
#logo img { height: 50px; }

/* ---- Nav ---- */
#header {
    background: #66AAFF;
    overflow: hidden;
}
#header ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}
#header ul li a {
    display: block;
    padding: 8px 16px;
    color: #fff;
    font-size: 14px;
    white-space: nowrap;
}
#header ul li a:hover {
    background: #4488dd;
    text-decoration: none;
}

/* ---- Main content ---- */
#mainside {
    padding: 10px 15px;
}

/* ---- Page title ---- */
.page-title {
    color: #0057c3;
    font-size: 17px;
    padding: 10px 0 8px;
    border-bottom: 2px solid #66AAFF;
    margin-bottom: 12px;
}


/* ---- County selector ---- */
.county-selector {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 10px 0 16px;
    font-size: 13px;
}
.county-selector select {
    padding: 4px 8px;
    border: 1px solid #aaa;
    font-size: 13px;
    font-family: Georgia, serif;
    background: #fff;
    cursor: pointer;
}

/* ---- Fuel section title ---- */
.fuel-section-title {
    color: #0057c3;
    font-size: 15px;
    margin: 16px 0 10px;
    border-left: 4px solid #66AAFF;
    padding-left: 8px;
}

/* ---- Price boxes grid ---- */
.price-boxes {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 8px;
}

.price-box {
    width: 160px;
    border: 1px solid #a7a7a7;
    background: #fff;
    text-align: center;
    font-family: Georgia, "Times New Roman", Times, serif;
    color: #777;
}

.price-box-logo {
    padding: 10px 8px 4px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.price-box-logo img {
    max-height: 30px;
    max-width: 120px;
    width: auto;
}
.price-box-network-text {
    font-weight: bold;
    font-size: 13px;
    color: #333;
    letter-spacing: 0.03em;
}

.price-box-fuel {
    font-size: 11px;
    color: #999;
    padding: 0 8px 6px;
}

.price-box-main {
    padding: 4px 8px 8px;
    white-space: nowrap;
}

.fuel-badge {
    display: inline-block;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    width: 16px;
    line-height: 16px;
    text-align: center;
    vertical-align: middle;
    margin-right: 3px;
}
.badge-benzina      { background: #009e00; }
.badge-benzina-prem { background: #006600; }
.badge-motorina     { background: #555; }
.badge-motorina-prem{ background: #000; }
.badge-gpl          { background: #0055aa; }
.badge-electric     { background: #006688; }

.price-val {
    color: #810000;
    font-size: 15px;
    font-weight: bold;
    vertical-align: middle;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.price-row {
    display: flex;
    align-items: baseline;
    gap: 4px;
}
.show-max-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 12px 0;
    font-size: 13px;
    cursor: pointer;
}
.price-row-min,
.price-row-max {
    display: none;
}
.price-label {
    font-size: 10px;
    font-weight: normal;
    color: #999;
    width: 22px;
    text-align: right;
    flex-shrink: 0;
}
.price-val small {
    font-size: 10px;
    font-weight: normal;
    color: #999;
}

.price-box-meta {
    font-size: 10px;
    color: #999;
    padding: 6px 6px 8px;
    border-top: 1px solid #eee;
    line-height: 1.5;
}

/* ---- Network stats line ---- */
.network-stats {
    font-size: 13px;
    color: #444;
    margin-top: 16px;
    line-height: 1.5;
}

/* ---- Scrape info ---- */
.scrape-info {
    font-size: 11px;
    color: #888;
    margin-top: 8px;
    padding: 4px 0;
    border-top: 1px dashed #ccc;
}

/* ---- Despre/static pages ---- */
.page-content {
    line-height: 1.7;
}
.page-content p {
    margin-bottom: 12px;
}

/* ---- Footer ---- */
#despre {
    font-size: 11px;
    color: #888;
    padding: 10px 15px;
    border-top: 1px solid #ddd;
}

#footer {
    background: #eee;
    border-top: 3px solid #66AAFF;
    padding: 10px 15px;
}
#footer ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
#footer ul li a {
    color: #333;
    font-size: 12px;
}
#footer ul li a:hover {
    text-decoration: underline;
}

#footerlnk {
    background: #eee;
    text-align: center;
    font-size: 11px;
    padding: 6px 15px 10px;
    color: #888;
}


/* ---- Visitor price entries (alimentari-vizitatori) ---- */
#box1 {
    float: left;
    width: 110px;
    border: 1px solid #a7a7a7;
    background: #fff;
    text-align: center;
    margin: 0 8px 8px 0;
    padding: 6px 4px 4px;
    font-family: Georgia, "Times New Roman", Times, serif;
    color: #777;
}
#box1 img { max-height: 30px; max-width: 90px; }
#clear { clear: both; }
#tip_1 {
    display: inline-block;
    background: #009e00;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    width: 16px;
    line-height: 16px;
    text-align: center;
    margin: 4px auto 2px;
}
#tip_2 {
    display: inline-block;
    background: #555;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    width: 16px;
    line-height: 16px;
    text-align: center;
    margin: 4px auto 2px;
}
#tip_3 {
    display: inline-block;
    background: #000;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    width: 16px;
    line-height: 16px;
    text-align: center;
    margin: 4px auto 2px;
}
#box_pret {
    color: #810000;
    font-size: 13px;
    font-weight: bold;
}
#box2 {
    overflow: hidden;
    background: #fff;
    padding: 8px 10px;
    margin-bottom: 8px;
    font-size: 13px;
    line-height: 1.6;
}
.location {
    font-size: 11px;
    color: #888;
    margin-top: 4px;
}

/* ---- Adauga pret form ---- */
.adauga-form { max-width: 420px; margin: 16px 0; }
.adauga-form label { display: block; font-size: 13px; margin-bottom: 4px; color: #444; }
.adauga-form input[type="text"],
.adauga-form select {
    width: 100%; padding: 6px 8px; border: 1px solid #aaa;
    font-size: 13px; margin-bottom: 12px; font-family: Georgia, serif;
}
.adauga-form input[type="submit"] {
    background: #66AAFF; color: #fff; border: none;
    padding: 8px 20px; font-size: 14px; cursor: pointer;
}
.adauga-form input[type="submit"]:hover { background: #4488dd; }
.form-error   { color: #a00; font-size: 13px; margin-bottom: 10px; }
.form-success { color: #060; font-size: 14px; margin: 16px 0; }

/* ---- Network listing (/statii-de-carburant) ---- */
.network-list {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin: 24px 0;
}
.network-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 16px 24px;
    border: 1px solid #ddd;
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
    min-width: 120px;
    text-align: center;
}
.network-card:hover {
    border-color: #aaa;
    background: #f9f9f9;
}
.network-card img {
    max-height: 40px;
    max-width: 100px;
    object-fit: contain;
}

/* ---- Price-change stats block (homepage) ---- */
.price-stats {
    margin: 20px 0 28px;
    padding: 16px 20px;
    background: #f5f8ff;
    border: 1px solid #cdd8ee;
    border-radius: 6px;
    overflow-x: auto;
}
.stats-title {
    font-size: 16px;
    margin: 0 0 12px;
    color: #1a2a4a;
}
.stats-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.stats-table th,
.stats-table td {
    padding: 6px 10px;
    text-align: right;
    border-bottom: 1px solid #dde4f0;
    white-space: nowrap;
}
.stats-table th {
    background: #e8eef9;
    font-weight: bold;
    color: #333;
    font-size: 12px;
}
.stats-table td:first-child,
.stats-table th:first-child { text-align: left; }
.stats-fuel-label { font-weight: bold; text-transform: capitalize; }
.delta-up   { color: #b00; }
.price-stats > p {
    margin-top: 10px;
    padding: 0 4px;
    font-size: 12px;
    color: #666;
    font-style: italic;
}
.delta-down { color: #060; }

/* ---- Cheapest fuel boxes (homepage) ---- */
.cheapest-fuel {
    margin: 0 0 28px;
    padding: 16px 20px;
    background: #f5f8ff;
    border: 1px solid #cdd8ee;
    border-radius: 6px;
}
.cheapest-fuel-boxes {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 12px;
}
.cheapest-box {
    flex: 1 1 200px;
    background: #fff;
    border: 1px solid #cdd8ee;
    border-radius: 5px;
    padding: 14px 16px;
}
.cheapest-label {
    font-size: 11px;
    font-weight: bold;
    color: #556;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin: 0 0 6px;
}
.cheapest-price {
    font-size: 26px;
    font-weight: bold;
    color: #1a2a4a;
    margin-bottom: 6px;
    line-height: 1;
}
.cheapest-unit {
    font-size: 13px;
    font-weight: normal;
    color: #556;
}
.cheapest-logo {
    margin-bottom: 8px;
    height: 32px;
    display: flex;
    align-items: center;
}
.cheapest-logo img {
    max-height: 32px;
    max-width: 90px;
    object-fit: contain;
}
.cheapest-logo-text {
    font-weight: bold;
    font-size: 13px;
    color: #333;
}
.cheapest-station {
    font-size: 13px;
    font-weight: bold;
    color: #222;
    margin-bottom: 2px;
}
.cheapest-address {
    font-size: 12px;
    color: #555;
    margin-bottom: 4px;
}
.cheapest-time {
    font-size: 11px;
    color: #888;
    margin-top: 6px;
}

/* ---- County nav boxes ---- */
.county-nav {
    margin: 20px 0;
}
.county-nav-title {
    font-size: 15px;
    color: #0057c3;
    margin: 0 0 12px;
    border-left: 4px solid #66AAFF;
    padding-left: 8px;
}
.county-nav-list {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.county-nav-list li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 50px;
    border: 1px solid #c0cce0;
    background: #fff;
    color: #0057c3;
    font-size: 12px;
    font-family: Georgia, serif;
    text-align: center;
    padding: 4px 6px;
    line-height: 1.3;
    overflow: hidden;
}
.county-nav-list li a:hover {
    background: #eef3ff;
    border-color: #66AAFF;
    text-decoration: none;
}
.county-nav-list li a.active {
    background: #66AAFF;
    border-color: #4488dd;
    color: #fff;
    font-weight: bold;
}
.county-nav-list li a.active:hover {
    background: #4488dd;
}