/* Add here all your CSS customizations */

p,
label,
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #1f2933;
}
/* Header Initials CSS */
.avatar-circle {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;

    color: #fff;
    font-weight: 600;
    font-size: 18px;
    text-transform: uppercase;
    user-select: none;
}

/* FOOTER */
.site-footer {
    flex-shrink: 0;
    background: #1f2a33;
    color: #cfd8dc;
    font-size: 0.9rem;
}

.site-footer a {
    color: #9ecbff;
    text-decoration: none;
}

.site-footer a:hover {
    text-decoration: underline;
}

.pricing-card {
    border-radius: 12px;
    transition: all 0.2s ease;
}

.pricing-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}

.pricing-card .card-header {
    border-radius: 12px 12px 0 0;
}
.pricing-card {
    border-radius:12px;
    transition:all .2s ease;
}

.pricing-card:hover{
    transform:translateY(-4px);
    box-shadow:0 10px 25px rgba(0,0,0,.08);
}
.plan-ribbon{
    position:absolute;
    top:14px;
    right:-35px;
    background:#198754;
    color:white;
    padding:6px 40px;
    font-size:12px;
    font-weight:600;
    transform:rotate(45deg);
    box-shadow:0 3px 10px rgba(0,0,0,.15);
    z-index: 9;
}
.pricing-card .card-header{
    background:#f8f9fa;
    border-bottom:1px solid #e5e7eb;
    font-size:18px;
}

/* ===============================
   HitchRoute Field Types
   =============================== */

/* Public Fields (Customers see this) */
.field-public {
    border-color: #fd7e14;
}

.field-public:focus {
    border-color: #fd7e14;
    box-shadow: 0 0 0 0.2rem rgba(253,126,20,.25);
}


/* Internal Fields (Admin use only) */
.field-internal {
    border-color: #007bff;
}

.field-internal:focus {
    border-color: #007bff;
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}


/* System Fields (auto/system values) */
.field-system {
    border-color: #6c757d;
    background-color: #f8f9fa;
}

.field-system:focus {
    border-color: #6c757d;
    box-shadow: 0 0 0 0.2rem rgba(108,117,125,.25);
}


/* Error Fields */
.field-error {
    border-color: #dc3545;
}

.field-error:focus {
    border-color: #dc3545;
    box-shadow: 0 0 0 0.2rem rgba(220,53,69,.25);
}

/* ===============================
   HitchRoute Field Flags
   =============================== */

.flag {
    width: 16px;
    height: 16px;
    display: inline-block;
    border-radius: 4px;
    margin-right: 8px;
    vertical-align: middle;
    box-shadow: 0 0 3px rgba(0,0,0,.25);
}

/* Public Fields */
.flag-public {
    background-color: #fd7e14;
}

/* Internal Fields */
.flag-internal {
    background-color: #007bff;
}

/* System Fields */
.flag-system {
    background-color: #6c757d;
}

/* Error Fields */
.flag-error {
    background-color: #dc3545;
}

.badge-public {
    background-color: #fd7e14;
    color: #1d2127;
}
.badge-internal {
    background-color: #007bff;
    color: #fff;
}
.badge-system {
    background-color: #6c757d;
    color: #fff;
}
.badge-error {
    background-color: #dc3545;
    color: #fff;
}