<!doctype html>
<html dir="$i18n{textdirection}" lang="$i18n{language}">
<head>
<meta charset="utf-8">
<meta name="viewport"
content="initial-scale=1, minimum-scale=1, width=device-width, interactive-widget=resizes-content">
<!-- TODO(crbug.com/40250276): Once fixed, "interactive-widget=resizes-content" can be removed. -->
<title>$i18n{blockPageTitle}</title>
<link rel="stylesheet" href="../../../../../components/security_interstitials/core/common/resources/interstitial_core.css">
<link rel="stylesheet" href="supervised_user_block_interstitial_v2.css">
<script src="supervised_user_block_interstitial_v2.js"></script>
</head>
<body class="supervised-user-block">
<div class="frame-blocked" id="frame-blocked" tabindex="-1">
<div class="message-container">
<div class="banner" id="banner">
<!-- Icon is from go/gm3-family-link-icon (Googler-only) -->
<svg id="family-link-kite-icon" xmlns="http://www.w3.org/2000/svg" focusable="false"
height="20" viewBox="0 -960 960 960" width="20" fill="#5F6368">
<path d="m500-225 260-360-260-253-260 253 260 360ZM390-40q-51
0-90.5-30.5T246-149q-6-23-25.5-37T178-200q-16 0-30
6.5T124-175l-61-51q21-26 51-40t64-14q51 0 91 30.5t54 78.5q6 23 25 37t42
14q20 0 36-9.5t25-26.5L175-538q-17-24-14.5-53.5T184-642l263-256q11-11
25-16.5t28-5.5q14 0 28 5.5t25 16.5l263 256q21 20 23.5
50T825-538L520-116q-20 35-54 55.5T390-40Zm110-492Z">
</svg>
<div id="banner-message">
<p class="banner-header">$i18n{bannerTitle}</p>
<p class="banner-content"> $i18n{bannerMessage}</p>
</div>
</div>
<picture id="error-page-illustration">
<source
srcset="error_page_illustration_dark_theme.svg"
media="(prefers-color-scheme: dark)"
alt="">
<img class="illustration"
src="error_page_illustration_light_theme.svg"
alt="">
</picture>
<picture id="waiting-for-approval-illustration" hidden>
<source
srcset="waiting_for_approval_dark_theme.svg"
media="(prefers-color-scheme: dark)"
alt="">
<img class="illustration"
src="waiting_for_approval_light_theme.svg"
alt="">
</picture>
<div id="main-message">
<h1 id="block-page-header" tabindex="-1">$i18n{blockPageHeader}</h1>
<p id="block-page-message" tabindex="-1">$i18n{blockPageMessage}</p>
<h1 id="request-failed-message" tabindex="-1" aria-live="assertive" aria-atomic="true" hidden>$i18n{requestFailedMessage}</h1>
<h1 id="request-sent-message" tabindex="-1" aria-live="assertive" aria-atomic="true" hidden>$i18n{requestSentMessage}</h1>
<p id="request-sent-description" tabindex="-1" hidden>$i18n{requestSentDescription}</p>
</div>
<div id="block-reason-container">
<p id="block-reason-show-details-link" tabindex="-1">$i18n{showDetailsLink}</p>
<p id="block-reason-hide-details-link" tabindex="-1">$i18n{hideDetailsLink}</p>
<div id="block-reason">
<div>
<h2 id="block-reason-header">$i18n{siteBlockHeader}</h2>
<p id="block-reason-message">$i18n{blockReasonMessage}</p>
</div>
</div>
</div>
<div id="custodians-information" hidden>
<div id="custodian-information" class="custodian-information">
<img id="custodian-avatar-img" class="avatar-img" alt="">
<div id="custodian-contact" class="custodian-contact">
<div id="custodian-name" tabindex="-1" class="custodian-name"></div>
<div id="custodian-email" tabindex="-1" class="custodian-email"></div>
</div>
</div>
<div id="second-custodian-information" class="custodian-information" hidden>
<img id="second-custodian-avatar-img" class="avatar-img" hidden alt="">
<div id="second-custodian-contact" class="custodian-contact">
<div id="second-custodian-name" tabindex="-1" class="custodian-name"></div>
<div id="second-custodian-email" tabindex="-1" class="custodian-email"></div>
</div>
</div>
</div>
</div>
<div class="button-container">
<button id="back-button" class="go-back-button" hidden>
$i18n{backButton}
</button>
<button id="local-approvals-button" class="local-approvals-button" hidden>
$i18n{localApprovalsButton}
</button>
<button id="local-approvals-remote-request-sent-button" class="local-approvals-button" hidden>
$i18n{localApprovalsRemoteRequestSentButton}
</button>
<button id="remote-approvals-button" class="remote-approvals-button" hidden>
$i18n{remoteApprovalsButton}
</button>
<div id="details-button-container">
<button id="show-details-link" class="details-button small-link" hidden>
$i18n{showDetailsLink}
</button>
<button id="hide-details-link" class="details-button small-link" hidden>
$i18n{hideDetailsLink}
</button>
</div>
</div>
<div id="details" hidden>
<p id="details-header" role="alert" >$i18n{blockReasonHeader}</p>
</div>
</div>
</body>
</html>