/* Alertoweb overrides on top of the Adminre theme */

/* Guest pages: logo block above the form */
.auth-brand {
    margin: 40px 0;
}

/* Error pages */
.error-status {
    font-size: 64px;
    line-height: 1.2;
}

/* Logout is a POST form rendered as a dropdown menu item */
.logout-form {
    margin: 0;
}
.btn-link-menu {
    display: block;
    width: 100%;
    padding: 3px 20px;
    border: 0;
    background: none;
    text-align: left;
    color: #333;
    line-height: 1.42857143;
    white-space: nowrap;
}
.btn-link-menu:hover,
.btn-link-menu:focus {
    background-color: #f5f5f5;
    color: #262626;
    outline: 0;
}

/* Menu entries of features not built yet */
.topmenu > li.disabled > a {
    opacity: .5;
    cursor: not-allowed;
}

/* Buttons wrapped in a POST form, displayed inline with links */
.inline-form {
    display: inline-block;
    margin: 0;
}

/* Followed pages list */
.subscriptions-table td {
    vertical-align: middle !important;
}
.subscription-name {
    max-width: 480px;
    word-break: break-all;
}

/* State of a page (macros/page_status.html.twig): label + explanation below it */
.page-status {
    max-width: 320px;
}
.page-status-detail {
    display: block;
    margin-top: 4px;
    color: #777;
    font-size: 12px;
    line-height: 1.4;
}

/* Page history (pages/show.html.twig) */
.page-facts dt {
    color: #777;
    font-weight: 400;
}
.page-facts dd {
    margin-bottom: 8px;
    word-break: break-all;
}
.versions-table td {
    vertical-align: middle !important;
}
.version-reference td {
    background: #fafafa;
}

/* "Modifications" feed (changes/index.html.twig): new changes stand out */
.changes-table td {
    vertical-align: middle !important;
}
.changes-table tr.change-new td {
    background: #fffaf0;
}
.changes-table tr.change-new td:first-child {
    box-shadow: inset 3px 0 0 #ffb020;
}
.change-page {
    max-width: 420px;
    word-break: break-word;
}

/* One change (pages/version.html.twig) */
.version-counts {
    margin-left: 10px;
    font-size: 13px;
    font-weight: 600;
}
.text-diff-count-added {
    color: #1d7a36;
}
.text-diff-count-removed {
    margin-left: 4px;
    color: #b3261e;
}
.version-intro {
    padding-bottom: 0;
}
.version-view-help {
    margin: 10px 0 12px;
    font-size: 13px;
}
.version-frame {
    display: block;
    width: 100%;
    height: 75vh;
    min-height: 480px;
    border: 0;
    border-top: 1px solid #e3e7ea;
    background: #fff;
}

/* Text diff (escaped segments, see Service\Diff\TextDiff) */
.text-diff {
    border-top: 1px solid #e3e7ea;
    font-size: 13px;
    line-height: 1.5;
}
.text-diff-row {
    display: flex;
    padding: 3px 15px;
}
.text-diff-sign {
    flex: 0 0 18px;
    color: #999;
    font-weight: 700;
}
.text-diff-line {
    flex: 1;
    white-space: pre-wrap;
    word-break: break-word;
}
.text-diff-same {
    color: #777;
}
.text-diff-added {
    background: #eefaf0;
}
.text-diff-added .text-diff-sign {
    color: #1d7a36;
}
.text-diff-added mark {
    padding: 0 1px;
    background: #c9f2d0;
    color: inherit;
}
.text-diff-removed {
    background: #fff1f1;
}
.text-diff-removed .text-diff-sign {
    color: #b3261e;
}
.text-diff-removed mark {
    padding: 0 1px;
    background: #ffd2d2;
    color: inherit;
    text-decoration: line-through;
}
.text-diff-gap {
    padding: 2px 15px;
    border-top: 1px dashed #e3e7ea;
    border-bottom: 1px dashed #e3e7ea;
    color: #aaa;
    text-align: center;
}

/* Dashboard stat cards (white card + coloured icon pastille; strong colour only when there is something to report) */
a.stat-card {
    display: table;
    width: 100%;
    margin-bottom: 20px;
    padding: 18px 20px;
    border: 1px solid #e3e7ea;
    border-left: 4px solid transparent;
    border-radius: 4px;
    background: #fff;
    color: #2e3440;
    text-decoration: none;
    transition: box-shadow .15s ease;
}
a.stat-card:hover,
a.stat-card:focus {
    color: #2e3440;
    text-decoration: none;
    box-shadow: 0 3px 12px rgba(46, 52, 64, .08);
}
.stat-card-icon,
.stat-card-body {
    display: table-cell;
    vertical-align: middle;
}
.stat-card-icon {
    width: 64px;
}
.stat-card-icon > i {
    display: inline-block;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    font-size: 22px;
    line-height: 48px;
    text-align: center;
}
.stat-card-value {
    display: block;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
}
.stat-card-label {
    display: block;
    color: #888;
    font-weight: 600;
}
.stat-card-brand .stat-card-icon > i   { background: #fdecec; color: #e5383b; }
.stat-card-amber .stat-card-icon > i   { background: #fff4de; color: #d98c00; }
.stat-card-neutral .stat-card-icon > i { background: #f1f3f5; color: #9aa3ad; }
.stat-card-alert {
    border-left-color: #b3261e;
}
.stat-card-alert .stat-card-icon > i   { background: #b3261e; color: #fff; }
.stat-card-alert .stat-card-value      { color: #b3261e; }

/* Header avatar: initials in a brand-coloured pastille */
.avatar-initials {
    display: inline-block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #e5383b;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 32px;
    text-align: center;
    letter-spacing: .5px;
}

/* Links: brand dark by default, brand red on hover (red is kept for main actions, active states and alerts).
   Use .text-primary on a link that must stand out. */
a {
    color: #2e3440;
}
a:hover,
a:focus,
a:active {
    color: #c42b2e;
}
a.text-primary,
.text-primary a {
    color: #e5383b;
}

/* Amber badges ("En pause"): dark text, white on amber is not readable enough */
.label-warning {
    color: #2e3440;
}

/* Admin settings screen */
.settings-form .setting-row {
    padding: 12px 0;
    margin: 0;
    border-bottom: 1px solid #eee;
}
.settings-form .setting-row:last-child {
    border-bottom: 0;
}
.settings-form .setting-int {
    max-width: 220px;
}

/* Registration honeypot: off-screen (not display:none, which some bots detect) */
.hp-field {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* "Continuer avec Google" button + "ou" separator (login / registration) */
.btn-google-sign-in {
    background: #fff;
    color: #1f1f1f;
    border: 1px solid #dadce0;
    margin-bottom: 15px;
}
.btn-google-sign-in:hover,
.btn-google-sign-in:focus {
    background: #f8f9fa;
    color: #1f1f1f;
}
.btn-google-sign-in .google-g {
    vertical-align: -3px;
    margin-right: 8px;
}
.separator-or {
    position: relative;
    margin: 0 0 15px;
}
.separator-or:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    border-top: 1px solid #ddd;
}
.separator-or span {
    position: relative;
    padding: 0 10px;
    background: #fff;
}

/* "Coming soon" marker on disabled menu entries (tooltip on the <li>) */
.topmenu > li.disabled .menu-soon {
    opacity: .8;
    font-size: 13px;
}

/* Alertoweb logo (partials/logo.html.twig, images in assets/image/brand/) */
.brand-logo {
    width: auto;
    height: 40px;
}
/* App header: dark brand area, same as the sidebar (keeps the logo readable whatever its colours) */
#header.navbar .navbar-header {
    background-color: #2a2a2a;
}
/* Bootstrap makes ".navbar-brand > img" a block: back to inline so the brand's text-align/line-height centre it */
#header.navbar .navbar-header > .navbar-brand .brand-logo {
    display: inline-block;
    height: 34px;
    vertical-align: middle;
}
#header.navbar .navbar-header > .navbar-brand .brand-logo-icon {
    display: none;
    width: auto;
    height: 32px;
    vertical-align: middle;
}
.sidebar-minimized #header.navbar .navbar-header > .navbar-brand .brand-logo,
.screen-sm #header.navbar .navbar-header > .navbar-brand .brand-logo {
    display: none;
}
.sidebar-minimized #header.navbar .navbar-header > .navbar-brand .brand-logo-icon,
.screen-sm #header.navbar .navbar-header > .navbar-brand .brand-logo-icon {
    display: inline-block;
}
/* Guest pages (login, registration) */
.auth-brand .brand-logo {
    height: 44px;
}
a.auth-logo {
    display: inline-block;
    margin-bottom: 8px;
}

/* Administration › Robot (admin/crawler.html.twig) */
.crawler-settings-line {
    margin: -8px 0 18px;
}
.crawler-periods {
    margin-bottom: 15px;
}
.crawler-period-panels .panel {
    min-height: 250px;
}
.crawler-total td {
    border-top: 2px solid #e3e7ea !important;
}
.crawler-table td {
    vertical-align: middle !important;
}
.crawler-page {
    max-width: 380px;
    word-break: break-word;
}
.crawler-chart {
    position: relative;
    height: 260px;
}

/* "Pages surveillées" by site (pages/index.html.twig): the header panel, then one collapsible panel per domain */
.domain-panel .panel-title .label {
    vertical-align: middle;
}
.domain-panel .subscriptions-table thead th {
    border-top: 0;
}

/* Administration › Pages (toutes) (admin/pages/index.html.twig) */
.admin-pages-filters {
    margin-bottom: 15px;
}
.admin-pages-search .form-control {
    margin-right: 6px;
}
.admin-pages-search input[type="search"] {
    width: 220px;
}
.admin-pages-search select {
    max-width: 240px;
}
.robots-content {
    max-height: 320px;
    overflow: auto;
    font-size: 11px;
    white-space: pre-wrap;
    word-break: break-all;
}

/* Administration › Exclusions */
.exclusion-target {
    width: 320px !important;
}
.domain-panel .domain-last-change {
    margin-left: 12px;
    color: #888;
    font-size: 12px;
    font-weight: 400;
}
/* The whole heading of a site panel opens / closes it (assets/js/app.js, data-heading-toggle) */
[data-heading-toggle] {
    cursor: pointer;
    user-select: none;
}
[data-heading-toggle]:hover {
    background-color: #f2f4f6;
}

/* ---------------------------------------------------------------- Administration › Emails */
.email-transport-label { width: 220px; }
.email-field-label { overflow: hidden; margin-bottom: 5px; }
.email-field-label .control-label { margin-bottom: 0; }
.email-textarea { resize: vertical; font-size: 13px; line-height: 1.5; }
.email-default { margin-top: 5px; }
.email-default summary { cursor: pointer; }
.email-default-text { white-space: pre-wrap; padding: 6px 8px; margin-top: 4px; background: #f6f7f9; border-radius: 3px; }
.email-preview-headers td:first-child { width: 80px; }
.email-preview-tabs { padding: 8px 10px 0; background: #f6f7f9; }
.email-preview-frame { display: block; width: 100%; height: 760px; border: 0; background: #f2f4f6; }
.email-preview-text { margin: 0; padding: 15px; border: 0; border-radius: 0; background: #fff; white-space: pre-wrap; word-break: break-word; max-height: 760px; overflow: auto; font-size: 13px; }
.email-send-error { font-size: 11px; max-width: 360px; word-break: break-word; margin-top: 3px; }

/* Banner "Confirmez votre adresse email" (partials/email_unverified.html.twig) */
.email-unverified { overflow: hidden; }
.email-unverified form { margin: -5px 0 -5px 15px; }

/* "Pages surveillées": drag and drop of the sites and pages (SortableJS, assets/js/app.js) */
.drag-handle { display: inline-block; padding: 2px 8px 2px 0; color: #9aa3ad; cursor: grab; touch-action: none; }
.drag-handle:hover { color: #2e3440; }
.dragging, .dragging * { cursor: grabbing !important; }
.subscriptions-table .drag-column { width: 30px; padding-right: 0; vertical-align: middle; }
.drag-ghost { opacity: .5; background: #fdecec !important; }
.drag-chosen { box-shadow: 0 2px 8px rgba(46, 52, 64, .15); }

/* Note under the preview iframe of a change (pages/version.html.twig) */
.version-frame-note { margin: 0; padding: 8px 15px; border-top: 1px solid #e5e7eb; }

/* Ignored zones: selection view, confirmation, list in the page detail (ZoneController) */
.zone-pick-help { border-bottom: 1px solid #e5e7eb; }
.zone-pick-frame { display: block; width: 100%; height: 75vh; min-height: 480px; border: 0; }
.zone-candidates { display: flex; flex-direction: column; gap: 8px; }
.zone-candidate { display: flex; gap: 10px; align-items: flex-start; margin: 0; padding: 10px 12px; font-weight: normal; border: 1px solid #e5e7eb; border-radius: 4px; cursor: pointer; }
.zone-candidate:hover { border-color: #e5383b; background: #fdecec; }
.zone-candidate input { margin-top: 3px; }
.zone-candidate-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.zone-candidate-excerpt { color: #4b5563; font-style: italic; }
.zone-candidate-body code, .zone-list code { white-space: normal; word-break: break-all; }
.zone-excerpt { font-style: italic; margin: 2px 0; }
/* Changes hidden by ignored zones: greyed in the history, lines of ignored zones greyed in the text view */
.versions-table tr.version-hidden td { color: #9aa3ad; }
.text-diff-row.text-diff-ignored { opacity: .45; }
.text-diff-row.text-diff-ignored mark { background: transparent; }
.version-hidden-note { margin-bottom: 10px; }
/* Watched / ignored zones in the page detail and the list of pages */
.zone-mode { border-bottom: 1px solid #e5e7eb; color: #4b5563; }
.zone-mode-watch { background: #fdecec; color: #2e3440; }
.zone-list-title { padding: 8px 15px 4px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: #6b7280; }
.zone-list { margin-bottom: 0; }
.zone-badge { margin-left: 4px; }
.zone-badge-ignore { display: block; margin-top: 2px; }
/* Page that changes at almost every check (pages/show.html.twig) */
.page-volatile { overflow: hidden; }
.page-volatile .btn { margin: -5px 0 -5px 15px; }

/* Thématiques: management page, "Ranger dans…" menu, theme of a page in the list, sidebar counts */
.theme-item { display: flex; align-items: center; gap: 10px; }
.theme-rename { display: flex; gap: 6px; flex: 1; min-width: 0; margin: 0; }
.theme-rename .form-control { max-width: 320px; }
.theme-pages { white-space: nowrap; }
.theme-menu form { margin: 0; }
.theme-menu button { display: block; width: 100%; padding: 4px 20px; text-align: left; background: none; border: 0; color: #2e3440; white-space: nowrap; }
.theme-menu button:hover { background: #f5f5f5; color: #c42b2e; }
.theme-menu li.active button { font-weight: 600; color: #c42b2e; background: #fdecec; }
.page-theme { display: block; margin-top: 2px; }
.submenu-count { color: #8a929c; font-size: 11px; }