/* Editor overrides and fixed-size original cards for consistent preview/export. */
.document-page #walletOabContainer.document-editor .document-form {height:auto;}
.document-page #walletOabContainer.document-editor .document-form button {position:static; margin:0!important; top:auto; height:auto;}
.document-page .document-form #resetForm {background:transparent!important; border-color:#a48bb4!important; color:#fff6fa!important;}
.document-page .document-form .btn-group-action {display:flex;flex-wrap:wrap;gap:12px;}
.document-page #walletCrmContainer.document-editor #certificateCRMForm .form-text {color:#d9cbe0;}
.document-preview .credential-actions {flex-wrap:wrap;gap:12px;}
.document-preview .credential-actions button {margin:0!important;min-height:44px;white-space:normal;}
.document-page #walletOab {
    width: 100%;
    height: 100vh;
}
.document-page #walletOab .walletOabContainer {
    width: 616.32px;
    height: 355.68px;
}
.document-page #walletOab .walletOabContainer img[src="img/background-carteirinha-oab.png"] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.document-page #walletOab .walletOabContainer .walletOabText {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.document-page #walletOab .walletOabText .walletOabPhoto {
    width: 144px;
    height: 144px;
    position: absolute;
    top: 28.8px;
    left: 72px;
}
.document-page #walletOab .walletOabText .walletOabPhoto img {
    width: 100%;
    height: 100%;
    border-radius: 14.4px;
    object-fit: cover;
}
.document-page #walletOab .walletOabText .expirationDate, .document-page #walletOab .walletOabText .emission {
    
    position: absolute;
    left: 567.36px; 
    transform: rotate(-90deg);
    color: black;
    font-size: 5.76px;
    white-space: nowrap;
}
.document-page #walletOab .walletOabText .expirationDate {
    top: 25% !important; 
}
.document-page #walletOab .walletOabText .userInfosContainer {
    width: 518.4px;
    height: 43.2px;
    display: flex;
    justify-content: space-between;
    position: absolute;
    left: 74.88px;
    bottom: 43.2px;
    
}
.document-page #walletOab .walletOabText .userInfos {
    width: 244.8px;
    height: 100%;
    position: relative;
    border-radius: 14.4px;
    border: solid 1px black;
    color: black;
    display: flex;
    align-items: center;
    justify-content: start;
    box-sizing: border-box;
    padding-left: 10.08px;
    white-space: nowrap;
}
.document-page #walletOab .walletOabText .userInfos p {
    font-size: 14.4px;
    position: absolute;
    right: 0px;
    top: -21.6px;
}
.document-page #walletOab .cityImage {
    width: 86.4px;
    height: 57.6px;
    position: absolute;
    top: 72px;
    right: 38.88px;
}
.document-page #walletOab .cityImage img {
    width: 100%;
    height: 100%;
}
.document-page #elderlyCardContainer {
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.document-page #elderlyCardContainer .elderlyCard {
    width: 616.32px;
    height: 388.8px;
    background-color: rgb(127, 138, 160) !important;
}
.document-page #elderlyCardContainer .elderlyCardBg {
    width: 100%;
    height: 50%;
    background: rgb(255, 255, 255);
}
.document-page #elderlyCardContainer .elderlyCardInfosContainer {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.document-page #elderlyCardContainer .elderlyCardInfosContainer .elderlyCardInfos {
    width: 288px;
    height: 288px;
    overflow: hidden;
    color: black;
    margin-top: 43.2px;
}
.document-page #elderlyCardContainer .elderlyCardInfosContainer .elderlyCardInfos h1 {
    font-size: 24.48px;
    font-weight: 900;
    text-transform: uppercase;
}
.document-page #elderlyCardContainer .elderlyCardInfosContainer .elderlyCardInfos h2 {
    font-size: 14.4px;
    text-transform: capitalize;
    white-space: nowrap;
}
.document-page #elderlyCardContainer .elderlyCardInfosContainer .elderlyCardInfos p:nth-child(5) {
    width: 100%;
    height: 93.6px;
    overflow: hidden;
    
}
.document-page #elderlyCardContainer .photoElderlyCard {
    width: 144px;
    height: 144px;
    border-radius: 50%;
    
    position: absolute;
    right: 14.4px;
    top: 100.8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.document-page #elderlyCardContainer .photoElderlyCard img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.document-page #elderlyCardContainer img[src="img/codigo-de-barras.avif"] {
    width: 288px;
    height: 28.8px;
    position: absolute;
    left: 14.4px;
    bottom: 28.8px;
    object-fit: cover;
    
}

.document-page #walletOab {width:616.32px;height:355.68px; margin:0; color:black;}
.document-page #elderlyCardContainer {width:616.32px;height:388.8px; margin:0; color:black;}
.document-page #elderlyCardContainer .elderlyCardInfos {margin-left:24px;}
.document-page #walletOab .walletOabText .emission {top:55%!important;}
.document-page #porteDearmaContainer {width:1011px;height:639px;margin:0;background:white;}
.document-page #porteDearmaContainer .porteDearma {width:1011px;height:639px;}
.document-page #porteDearmaContainer .porteDearmaInfos {overflow-wrap:anywhere;}
.document-page #walletOab .walletOabText .userInfos {overflow-wrap:anywhere;white-space:normal;}
.document-page #elderlyCardContainer .elderlyCardInfosContainer .elderlyCardInfos h2 {white-space:normal;overflow-wrap:anywhere;}
.document-page #elderlyCardContainer .elderlyCardInfosContainer .elderlyCardInfos p {font-size:14px;line-height:1.35;margin:0 0 8px;overflow-wrap:anywhere;}
.document-page #elderlyCardContainer .elderlyCardInfosContainer .elderlyCardInfos p:nth-child(5) {height:auto;max-height:130px;overflow:visible;font-size:12px;line-height:1.35;}
/* The preview shell already supplies spacing; do not shrink the CRM a second time. */
.document-preview #dadosCertidao { padding:0; min-height:0; background:transparent; }
/* Override legacy CRM white upload wrappers, including hover, without touching the card. */
.document-page .document-form .custom-file,
.document-page .document-form .custom-file:hover { background:#1a1422; border-color:#927ba0; }
.document-page #certificateCRMForm input[type="date"] { color-scheme:dark; }