#mtbxfc-connector-page {
    margin-top: 20px;
    margin-right: 20px;
}

@media screen and (max-width: 782px) {
    #mtbxfc-connector-page {
        margin-left: 10px;
        margin-right: 10px;
    }
}

#mtbxfc-connector-page .wrap {
    margin: 0;
    padding: 0;
}

#mtbxfc-connector-header .navbar {
    background: #fff; border: 1px solid rgba(0,0,0,.06); border-radius: 8px;
    padding: 12px 16px; box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
#mtbxfc-connector-header .container {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
#mtbxfc-connector-header .navbar-brand { display:flex; align-items:center; gap:10px; text-decoration:none; color:inherit; }
#mtbxfc-connector-header .navbar-brand-logo { width:180px; object-fit:contain; display:block; }
#mtbxfc-connector-header .navbar-brand-title { font-weight:600; font-size:15px; line-height:1; }

#mtbxfc-connector-header .navbar-right { display:flex; align-items:center; gap:12px; margin-left:auto; }
#mtbxfc-connector-header .navbar-nav { display:flex; align-items:center; gap:6px; list-style:none; margin:0; padding:0; }
#mtbxfc-connector-header .nav-link {
    display:inline-flex; align-items:center; padding:6px 10px; border-radius:6px;
    text-decoration:none; color:#1d2327; line-height:1; border:1px solid transparent;
}
#mtbxfc-connector-header .nav-link:hover { background:#f6f7f7; border-color:rgba(0,0,0,.08); }
#mtbxfc-connector-header .nav-link.active { background:#15253F; color:#fff; border-color:#15253F; }

#mtbxfc-connector-header .status-badge {
    display:inline-flex; align-items:center; gap:8px;
    font-size:12px; font-weight:600; border-radius:999px; padding:4px 10px; border:1px solid transparent;
}
#mtbxfc-connector-header .status-badge .status-dot {
    width:8px; height:8px; border-radius:50%; display:inline-block;
}


#mtbxfc-connector-header .status-online   { color:#0a7a28; background:#e8f5ec; border-color:#bfe5cc; }
#mtbxfc-connector-header .status-online .status-dot   { background:#1f9d41; }

#mtbxfc-connector-header .status-degraded { color:#8a5b00; background:#fff7e6; border-color:#ffe0a6; }
#mtbxfc-connector-header .status-degraded .status-dot { background:#f0ad00; }

#mtbxfc-connector-header .status-offline  { color:#7a1020; background:#fdecef; border-color:#f5bac6; }
#mtbxfc-connector-header .status-offline .status-dot  { background:#d7263d; }

#mtbxfc-connector-header .status-not_configured { color:#3b3b3b; background:#f3f4f6; border-color:#e4e6eb; }
#mtbxfc-connector-header .status-not_configured .status-dot { background:#9aa0a6; }

/* ── MetaBox Fulfillment  – Color System & Utilities  ──────────── */
/* Scope: csak a plugin oldalakon, a #mtbxfc-connector-page alatt élnek */
#mtbxfc-connector-page {
    /* Brand */
    --mtbxfc-primary-50:  #EEF1F6;
    --mtbxfc-primary-100: #E3E8F2;
    --mtbxfc-primary-500: #15253F;  /* kék (primary) */
    --mtbxfc-primary-600: #101C2F;
    --mtbxfc-primary-700: #0B1320;

    --mtbxfc-warning-50:  #FFF8D6;
    --mtbxfc-warning-100: #FFF1AD;
    --mtbxfc-warning-500: #FFCC01;  /* narancs (warning) */
    --mtbxfc-warning-600: #E6B800;
    --mtbxfc-warning-700: #CCA300;

    /* Harmonizált paletta */
    --mtbxfc-info-50:   #ECFEFF;
    --mtbxfc-info-100:  #CFFAFE;
    --mtbxfc-info-500:  #0EA5E9;
    --mtbxfc-info-600:  #0284C7;

    --mtbxfc-danger-50:  #FEF2F2;
    --mtbxfc-danger-100: #FEE2E2;
    --mtbxfc-danger-500: #DC2626;
    --mtbxfc-danger-600: #B91C1C;

    --mtbxfc-dark-50:   #F5F7FA;
    --mtbxfc-dark-100:  #E9EEF5;
    --mtbxfc-dark-500:  #111827;
    --mtbxfc-dark-600:  #0B1220;

    --mtbxfc-neutral-50:  #f6f7f7;
    --mtbxfc-neutral-200: #dcdcde;
    --mtbxfc-neutral-700: #1d2327;
    --mtbxfc-white: #ffffff;

    /* fókusz gyűrű a primary-ból */
    --mtbxfc-ring: rgba(21, 37, 63, .35);
}

/* ── Text utilities ─────────────────────────────────────────────────────── */
#mtbxfc-connector-page .text-primary { color: var(--mtbxfc-primary-600) !important; }
#mtbxfc-connector-page .text-warning { color: var(--mtbxfc-warning-600) !important; }
#mtbxfc-connector-page .text-info    { color: var(--mtbxfc-info-600) !important; }
#mtbxfc-connector-page .text-danger  { color: var(--mtbxfc-danger-600) !important; }
#mtbxfc-connector-page .text-dark    { color: var(--mtbxfc-dark-500) !important; }
#mtbxfc-connector-page .text-white   { color: var(--mtbxfc-white) !important; }

/* ── Background utilities ───────────────────────────────────────────────── */
#mtbxfc-connector-page .bg-primary        { background: var(--mtbxfc-primary-500) !important; color: var(--mtbxfc-white) !important; }
#mtbxfc-connector-page .bg-primary-soft   { background: var(--mtbxfc-primary-50)   !important; color: var(--mtbxfc-primary-700) !important; }

#mtbxfc-connector-page .bg-warning        { background: var(--mtbxfc-warning-500) !important; color: #3b2e00 !important; }
#mtbxfc-connector-page .bg-warning-soft   { background: var(--mtbxfc-warning-50)   !important; color: #3b2e00 !important; }

#mtbxfc-connector-page .bg-info           { background: var(--mtbxfc-info-500)    !important; color: var(--mtbxfc-white) !important; }
#mtbxfc-connector-page .bg-info-soft      { background: var(--mtbxfc-info-50)     !important; color: var(--mtbxfc-info-600) !important; }

#mtbxfc-connector-page .bg-danger         { background: var(--mtbxfc-danger-500)  !important; color: var(--mtbxfc-white) !important; }
#mtbxfc-connector-page .bg-danger-soft    { background: var(--mtbxfc-danger-50)   !important; color: var(--mtbxfc-danger-600) !important; }

#mtbxfc-connector-page .bg-dark           { background: var(--mtbxfc-dark-500)    !important; color: var(--mtbxfc-white) !important; }
#mtbxfc-connector-page .bg-white          { background: var(--mtbxfc-white)       !important; }

/* ── Border utilities ───────────────────────────────────────────────────── */
#mtbxfc-connector-page .border            { border: 1px solid var(--mtbxfc-neutral-200) !important; }
#mtbxfc-connector-page .border-0          { border: 0 !important; }
#mtbxfc-connector-page .border-primary    { border-color: var(--mtbxfc-primary-500) !important; }
#mtbxfc-connector-page .border-warning    { border-color: var(--mtbxfc-warning-500) !important; }
#mtbxfc-connector-page .border-info       { border-color: var(--mtbxfc-info-500) !important; }
#mtbxfc-connector-page .border-danger     { border-color: var(--mtbxfc-danger-500) !important; }
#mtbxfc-connector-page .border-dark       { border-color: var(--mtbxfc-dark-500) !important; }

/* ── Ring/Fókusz util ───────────────────────────────────────────────────── */
#mtbxfc-connector-page .ring { box-shadow: 0 0 0 3px var(--mtbxfc-ring) !important; outline: none !important; }

/* ── Button system frissítés (a korábbira építve) ───────────────────────── */
#mtbxfc-connector-page .mtbxfc-btn {
    -webkit-appearance: none; appearance: none; display: inline-flex; align-items: center; justify-content: center;
    gap: .5rem; border-radius: .5rem; border: 1px solid transparent;
    padding: .5rem .875rem; font-weight: 600; line-height: 1.2; cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .02s ease;
    text-decoration: none; user-select: none;
    color: var(--mtbxfc-neutral-700); background: var(--mtbxfc-white); border-color: var(--mtbxfc-neutral-200);
}
#mtbxfc-connector-page .mtbxfc-btn:hover { background: var(--mtbxfc-neutral-50); }
#mtbxfc-connector-page .mtbxfc-btn:active { transform: translateY(1px); }
#mtbxfc-connector-page .mtbxfc-btn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--mtbxfc-ring); }
#mtbxfc-connector-page .mtbxfc-btn[disabled], #mtbxfc-connector-page .mtbxfc-btn:disabled { opacity: .6; cursor: not-allowed; }

/* Sizes */
#mtbxfc-connector-page .mtbxfc-btn-xs{ padding:.25rem .5rem; font-size:.75rem; border-radius:.375rem; }
#mtbxfc-connector-page .mtbxfc-btn-sm{ padding:.375rem .75rem; font-size:.8125rem; }
#mtbxfc-connector-page .mtbxfc-btn-lg{ padding:.625rem 1rem; font-size:.9375rem; }

/* Variants */
#mtbxfc-connector-page .mtbxfc-btn-primary{ background:var(--mtbxfc-primary-500); border-color:var(--mtbxfc-primary-500); color:var(--mtbxfc-white); }
#mtbxfc-connector-page .mtbxfc-btn-primary:hover{ background:var(--mtbxfc-primary-600); border-color:var(--mtbxfc-primary-600); }
#mtbxfc-connector-page .mtbxfc-btn-primary:active{ background:var(--mtbxfc-primary-700); border-color:var(--mtbxfc-primary-700); }

#mtbxfc-connector-page .mtbxfc-btn-warning{ background:var(--mtbxfc-warning-500); border-color:var(--mtbxfc-warning-500); color:#3b2e00; }
#mtbxfc-connector-page .mtbxfc-btn-warning:hover{ background:var(--mtbxfc-warning-600); border-color:var(--mtbxfc-warning-600); }
#mtbxfc-connector-page .mtbxfc-btn-warning:active{ background:var(--mtbxfc-warning-700); border-color:var(--mtbxfc-warning-700); }

#mtbxfc-connector-page .mtbxfc-btn-outline{ background:transparent; color:var(--mtbxfc-neutral-700); border-color:var(--mtbxfc-neutral-200); }
#mtbxfc-connector-page .mtbxfc-btn-outline:hover{ background:var(--mtbxfc-neutral-50); }
#mtbxfc-connector-page .mtbxfc-btn-outline-primary{ background:transparent; color:var(--mtbxfc-primary-600); border-color:var(--mtbxfc-primary-500); }
#mtbxfc-connector-page .mtbxfc-btn-outline-primary:hover{ background:rgba(21,37,63,.08); }

/* WP submit_button kompat: csak a plugin oldalakon „tailwindesítjük” */
#mtbxfc-connector-page .button { border-radius:.5rem; padding:.5rem .875rem; font-weight:600; border:1px solid var(--mtbxfc-neutral-200); background:var(--mtbxfc-white); color:var(--mtbxfc-neutral-700); }
#mtbxfc-connector-page .button:hover{ background:var(--mtbxfc-neutral-50); }
#mtbxfc-connector-page .button-primary{ background:var(--mtbxfc-primary-500)!important; border-color:var(--mtbxfc-primary-500)!important; color:var(--mtbxfc-white)!important; }
#mtbxfc-connector-page .button-primary:hover{ background:var(--mtbxfc-primary-600)!important; border-color:var(--mtbxfc-primary-600)!important; }

.wc-action-button-mtbxfc-push::after { content: "\f345"; }

#mtbxfc-connector-page .mtbxfc-form-group {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

#mtbxfc-connector-page .mtbxfc-form-label {
    font-weight: 600;
    margin-bottom: .375rem;
    color: var(--mtbxfc-dark-500);
    font-size: .875rem;
}

/* ── Alap input / select / textarea ─────────────────────────────────────── */
#mtbxfc-connector-page .mtbxfc-form-control {
    display: block;
    width: 100%;
    padding: .5rem .75rem;
    font-size: .875rem;
    line-height: 1.5;
    color: var(--mtbxfc-dark-500);
    background-color: var(--mtbxfc-white);
    background-clip: padding-box;
    border: 1px solid var(--mtbxfc-neutral-200);
    border-radius: .5rem;
    transition: border-color .15s ease, box-shadow .15s ease;
    box-shadow: none;
}

#mtbxfc-connector-page .mtbxfc-form-control:focus {
    border-color: var(--mtbxfc-primary-500);
    box-shadow: 0 0 0 3px var(--mtbxfc-ring);
    outline: 0;
}

#mtbxfc-connector-page .mtbxfc-form-control:hover {
    border-color: var(--mtbxfc-neutral-700);
}

#mtbxfc-connector-page .mtbxfc-form-control::placeholder {
    color: #9aa0a6;
    opacity: 1;
}

/* ── Disabled / Readonly ────────────────────────────────────────────────── */
#mtbxfc-connector-page .mtbxfc-form-control:disabled,
#mtbxfc-connector-page .mtbxfc-form-control[readonly] {
    background-color: var(--mtbxfc-neutral-50);
    opacity: 0.7;
    cursor: not-allowed;
}

/* ── Validációs állapotok ───────────────────────────────────────────────── */
#mtbxfc-connector-page .mtbxfc-form-control.is-invalid {
    border-color: var(--mtbxfc-danger-500);
    box-shadow: 0 0 0 3px rgba(220, 38, 38, .25);
}

#mtbxfc-connector-page .mtbxfc-form-control.is-valid {
    border-color: var(--mtbxfc-info-500);
    box-shadow: 0 0 0 3px rgba(14, 165, 233, .25);
}

#mtbxfc-connector-page .mtbxfc-form-feedback {
    font-size: .8125rem;
    margin-top: .25rem;
    color: var(--mtbxfc-danger-600);
}

/* ── Checkbox / Radio ───────────────────────────────────────────────────── */
#mtbxfc-connector-page .mtbxfc-form-check {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .5rem;
}

#mtbxfc-connector-page .mtbxfc-form-check-input {
    width: 1rem;
    height: 1rem;
    border-radius: .25rem;
    border: 1px solid var(--mtbxfc-neutral-200);
    appearance: none;
    cursor: pointer;
    display: inline-block;
    position: relative;
    background-color: var(--mtbxfc-white);
    transition: all .15s ease;
}

#mtbxfc-connector-page .mtbxfc-form-check-input:checked {
    background-color: var(--mtbxfc-primary-500);
    border-color: var(--mtbxfc-primary-500);
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M13.78 3.72a.75.75 0 010 1.06l-7 7a.75.75 0 01-1.06 0l-3-3a.75.75 0 111.06-1.06L6 10.19l6.97-6.97a.75.75 0 011.06 0z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 80%;
}

#mtbxfc-connector-page .mtbxfc-form-check-label {
    font-size: .875rem;
    color: var(--mtbxfc-dark-500);
}

/* ── Inline layout ──────────────────────────────────────────────────────── */
#mtbxfc-connector-page .mtbxfc-form-inline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
}

#mtbxfc-connector-page .card {
    width: 100%;
    max-width: none;
}

#mtbxfc-connector-page .mtbxfc-form-inline .mtbxfc-form-group {
    margin-bottom: 0;
}

.w-25 {
    width: 25% !important;
}

.w-50 {
    width: 50% !important;
}

.w-75 {
    width: 75% !important;
}

.w-100 {
    width: 100% !important;
}

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;

    background-color: #fff;
    background-clip: border-box;
    border: 1px solid #ebeef1;
    border-radius: 0.5rem; /* 6px */
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

.card-header {
    padding: 0.75rem 1rem;
    margin-bottom: 0;
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    font-weight: 600;
    font-size: 1rem;
}

.card-body {
    flex: 1 1 auto;
    padding: 1rem 1.25rem;
}

.card-title {
    margin-bottom: 0.75rem;
    font-size: 1.1rem;
    font-weight: 600;
}

.card-text {
    margin-bottom: 1rem;
    line-height: 1.5;
}

.card-footer {
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-top: 1px solid #dee2e6;
}

.card-img-top {
    width: 100%;
    border-top-left-radius: 0.375rem;
    border-top-right-radius: 0.375rem;
    display: block;
}

.card-img-bottom {
    width: 100%;
    border-bottom-left-radius: 0.375rem;
    border-bottom-right-radius: 0.375rem;
    display: block;
}

.bg-white { background: var(--mtbxfc-white); }

.mt-5 { margin-top: .5rem; }
.mb-5 { margin-bottom: .5rem; }

.p-5 { padding: .5rem; }
.p-6 { padding: .6rem; }
.p-7 { padding: .7rem; }
.p-8 { padding: .8rem; }
.p-9 { padding: .9rem; }
.p-10 { padding: 1rem; }
.p-11 { padding: 1.1rem; }
.p-12 { padding: 1.2rem; }
.p-13 { padding: 1.3rem; }
.p-14 { padding: 1.4rem; }
.pt-5 { padding-top: .5rem; }

.rounded {
    border-radius: .25rem;
}

.rounded-lg {
    border-radius: .5rem;
}